Barcha kurslar Yo'nalishlar Reyting Kirish Ro'yxatdan o'tish

Bu modul kursga poydevor qo’yadi: web qanday ishlashi, HTML’ning roli va ish muhitini sozlash ko’rib chiqildi.

Web qanday ishlaydi

Brauzerda biror sayt ochilganda ikkita kompyuter "gaplashadi": sizning qurilmangiz (mijoz) va saytni saqlab turgan kompyuter (server). Brauzer serverga so’rov yuboradi, server javob sifatida HTML hujjat qaytaradi, brauzer esa uni o’qib ekranga chizadi. Demak, siz yozadigan HTML fayllar — brauzer uchun "chizma".

Manzil qatoriga https://ochiqkurs.uz yozilganda nima bo’ladi:

  1. Brauzer shu nom ortida turgan serverning manzilini topadi.
  2. Serverga "menga bosh sahifani ber" degan so’rov ketadi.
  3. Server HTML matn qaytaradi.
  4. Brauzer HTML’ni o’qib, sahifani chizadi.

Sayt nomi (masalan, ochiqkurs.uz) domen deb ataladi, saytni kechayu kunduz saqlab turadigan server xizmati esa hosting. Siz yozgan HTML fayllar hozircha faqat o’z kompyuteringizda ochiladi; ularni butun dunyoga ko’rsatish uchun keyinchalik hostingga joylash o’rganiladi.

Qiziq tajriba: istalgan saytni ochib Ctrl+U bosing (yoki o’ng tugma → View Page Source) — sahifaning HTML kodi chiqadi. Katta saytlarning kodi qo’rqinchli ko’rinishi mumkin, lekin xulosa oddiy: internetdagi har bir sahifa aynan siz o’rganayotgan teglardan yig’ilgan.

HTML, CSS va JavaScript

Web-sahifa uchta texnologiyadan quriladi, har birining vazifasi aniq:

Texnologiya Vazifasi O’xshatish
HTML Struktura: sarlavha, matn, rasm qayerda turadi Uyning devorlari
CSS Ko’rinish: rang, shrift, joylashuv Bo’yoq va bezak
JavaScript Harakat: tugma bosilganda nima bo’lishi Elektr va jihozlar

Bu kursda asosiy e’tibor HTML’ga qaratiladi, CSS bilan yuzaki tanishasiz — uni chuqur o’rganish alohida kursning ishi.

Bitta muhim aniqlik: HTML — dasturlash tili emas, belgilash (markup) tili. Unda shart, sikl, hisob-kitob yo’q; u faqat kontentni "bu sarlavha, bu rasm, bu ro’yxat" deb belgilab chiqadi. Shuning uchun HTML’ni o’rganish dasturlashdan osonroq — lekin har qanday web-dasturchining yo’li aynan shu yerdan boshlanadi.

Dasturlash muhiti

HTML yozish uchun maxsus dastur shart emas — oddiy matn muharriri ham yetadi. Lekin qulaylik uchun VS Code ishlatiladi: kod ranglanadi, teglar avtomatik yopiladi, xatolar ko’zga tashlanadi.

O’rnatish tartibi:

  1. code.visualstudio.com saytidan VS Code’ni yuklab o’rnating.
  2. Live Server kengaytmasini qo’shing — faylni saqlaganingizda brauzer sahifani o’zi yangilab beradi.
  3. Ish uchun alohida papka oching (masalan, html-darslar).

Birinchi HTML fayl

Fayl kengaytmasi .html bo’lishi shart — brauzer aynan shu kengaytmani web-sahifa deb taniydi.

<!DOCTYPE html>
<html>
<head>
  <title>Birinchi sahifam</title>
</head>
<body>
  <h1>Salom, web!</h1>
</body>
</html>

Natija (brauzerda): yirik qora harflar bilan Salom, web! yozuvi, brauzer tabida esa "Birinchi sahifam" nomi.

Tipik xato. Faylni sahifa.txt deb saqlash. Brauzer bunday faylni web-sahifa emas, oddiy matn deb ochadi — teglar ham ekranda ko’rinib qoladi. Saqlashda nom oxiri .html ekaniga qarang.

Amaliyot

  1. VS Code va Live Server’ni o’rnating, html-darslar papkasini yarating.
  2. index.html fayli yaratib, yuqoridagi skeletni qo’lda yozing (nusxalamang) va brauzerda oching.
  3. <h1> ichidagi matnni o’z ismingizga almashtiring, tab nomini "Mening sahifam" qiling.
  4. Faylni ataylab index.txt deb saqlab brauzerda oching — farqni o’z ko’zingiz bilan ko’ring, keyin .htmlga qaytaring.

Modul yakunida testni ishlang — keyingi modulda HTML hujjatning ichki tuzilishi chuqur o’rganiladi.

Kirish — konspekt

Kirish Maqola

Web qanday ishlashi, HTML/CSS/JavaScript vazifalari va ish muhitini sozlash — modul konspekti.

Eslatma yozish uchun saytga kiring.

Resurslar hozircha qo'shilmagan

O'qituvchi dars uchun qo'shimcha materiallarni qo'shganida shu yerda paydo bo'ladi.

Savol berish uchun saytga kiring.

Hozircha savollar yo'q

Bu dars yuzasidan birinchi savolni siz bering.