Ushbu maqolada siz birinchi veb-saytingizni yozish uchun HTML dan qanday foydalanishni oʻrganasiz! Yaxshiroq tushunish uchun maqolada illyustrativ misollar keltirilgan. Keling, darhol band qilaylik, maqola dastlab HTMLni endigina o'rganayotganlar uchun mo'ljallangan. Bundan tashqari, ushbu maqolani o'qib chiqqach, sizga birinchi veb-saytingizni yaratish kafolatlanadi.
HTML HyperText Markup Language, ya'ni matnni tartibga solish tilini anglatadi.
Veb-saytlarda amallarni bajarish uchun skriptlardan foydalanadigan dasturlash tillaridan (JavaScript, PHP va boshqalar) farqli oʻlaroq, ketma-ketlik tili (HTML) veb-sayt tarkibini belgilash uchun teglardan foydalanadi.
HTML tilini noldan oʻrganishni boshlaylik
Ingliz tili A, B, C va hokazo harflardan tuzilganidek, HTML ham oʻziga xos “harflar”dan iborat:,,
va hokazo. HTML tilining bu oʻziga xos “harflari” veb-ustalar tomonidan teglar deb ataladi.
Quyidagi HTML tegiga misol.
Teglar Ushbu matn chetlari atrofida tagiga chiziq yarating.
CSS til uslublari bilan bogʻlangan HTML teglari veb-saytlarni tez va samarali yaratish imkonini beradi.
HTML tilining boshqa tillar orasidagi oʻrni
Ma'lumki, yaxshi veb-saytkamida 5 tilda yaratilgan.
Zamonaviy veb-sayt quyidagi tillarda yaratilgan:
- HTML (tuzilish va tartib).
- CSS (uslub mazmuni).
- JavaScript (brauzer harakatlari).
- PHP (server harakati).
- SQL (ma'lumotlarni saqlash).
HTML boshqalar asos boʻlgan asosiy fundamental tildir. Shunday ekan, HTMLni oʻrganish internetda veb-saytlar yaratishni oʻrganayotgan har bir kishi uchun birinchi qadam boʻlishi kerak.
Teg
HTML tili yaratilganidan beri yillar davomida oʻzgardi. Ayni paytda aksariyat internet saytlari tilning eng so‘nggi versiyasi – HTML5 ga o‘tmoqda. Lekin hatto HTML5 da tilning asoslari oʻzgarishsiz qoladi.
HTML sahifaning tuzilishi sendvichga o'xshaydi. Sendvichda ikkita bo'lak non bo'lgani kabi, HTML hujjatida ham HTML yorlig'i ochiladi va yopiladi.
Bu teglar sendvichdagi non kabi hamma narsani oʻrab oladi.
Teg
HTML tilini oʻrganishda davom etar ekansiz, teg bilan albatta tanishishingiz kerak. To'g'ridan-to'g'ri ota yorlig'i ichida saytning barcha mazmuni, shu jumladan teg. Ushbu teg talab qilinadi va u yozilgan sayt sahifasining barcha sozlamalarini o'z ichiga oladi. Bu sozlamalar saytga tashrif buyuruvchilarga koʻrinmaydi, faqat brauzerlar (Google Chrome, Mozilla Firefox va boshqalar) ularni koʻradi.
Veb-sahifa sozlamalari blokida brauzerga saytingizni internetda toʻgʻri koʻrsatishga yordam beradigan barcha "koʻrsatilmagan" elementlar mavjud.
Barcha variantlarteg ichida sozlanishi mumkin, biz buni ko'rib chiqamiz, lekin birozdan keyin - vaqti kelganda.
Teg
Teg xuddi teg kabi teg ichida joylashgan.
Bu teg saytingizda koʻrsatmoqchi boʻlgan barcha maʼlumotlarni koʻrsatish uchun kerak.
Sarlavhalar, paragraflar, jadvallar, rasmlar va havolalar teg ichida joylashgan elementlarning faqat kichik bir qismidir.
HTML hujjatining asosiy tuzilishi:
… …
Sizning birinchi saytingiz
Endi siz HTML yordamida veb-saytlar yaratishingiz mumkinligini va buning uchun asosiy teglar ishlatilishini bilasiz:
- . Veb-sahifa chegaralarini belgilaydi.
- . Brauzerda veb-sahifani ko'rsatish sozlamalarini o'z ichiga oladi.
- . Saytga tashrif buyuruvchilarga koʻrsatmoqchi boʻlgan barcha veb-sahifa elementlarini (rasmlar, videolar, matn va boshqalar) oʻz ichiga oladi.
Boshqa teglar,,, kabilar haqida tez orada gaplashamiz.
O'quvchi nafaqat ushbu maqolani o'qibgina qolmay, balki darhol o'z mahoratini oshirishga yugursa, juda yaxshi bo'lardi. HTML ko'nikmalaringizni oshirish uchun siz birinchi veb-saytingizni yaratishingiz kerak bo'ladi, u yangi ko'nikmalaringiz uchun sinov maydonchasi bo'lib xizmat qiladi.
Ma'lumki, uyali aloqa operatorlari ("MTS", "MegaFon" va boshqalar) bizga mobil aloqa xizmatlarini taqdim etadi. Xuddi shu tarzda, saytlarni yaratish va boshqarish bo'yicha xizmatlar bizga xosting operatorlari tomonidan taqdim etiladi. Veb-saytingizni yaratish uchun istalgan bepul xosting operatorining saytiga o'ting.
Tasdiqlangan xosting provayderlari orasida BEGET yokireg, masalan. Siz har kimni tanlashingiz mumkin.
Qisqa roʻyxatdan oʻtgandan soʻng, 24 soatdan soʻng, Internetdagi birinchi veb-saytingiz avtomatik ravishda yaratiladi, u butun dunyoga koʻrinadi va siz mashq qilishni boshlashingiz mumkin!
Zamonaviy sayt tuzilishi
Endi sizda saytingiz bor, tegda qanday teglar borligini va ular saytlardagi ma'lumotlarni qanday tartibga solishini tekshiring.
Yuqoridagi rasm HTML tilining soʻnggi versiyasi – HTML5 bilan birga kelgan strukturaning sxematik koʻrinishidir. HTML5 bilan birga nafaqat yangi teglar, balki veb-saytlar yaratish ma'nosi ham paydo bo'ldi. Rasmda ko'rgan barcha teglar asosiy teg ichida joylashgan. Bu teglar saytingiz strukturasini "konspekt qilish" va unga ma'no berishga yordam beradi.
Masalan, teglar ichida … sayt nomini (teglar) va sayt tavsifini (teglar) joylashtirish qulay.
Teglar ichiga sayt (teg) menyusini (havolalarini) joylashtirish qulay.
Teglar ichiga ma'nosi bilan bog'liq har qanday katta ma'lumot blokini joylashtirish qulay. Bu bir nechta maqola bo'lishi mumkin, ularning har biri teglar yoki fotosuratlar (teglar) yoki jadvallar (teglar) bilan "o'ralgan"
) va boshqalar.
Teglar ichida. maʼnosiga toʻgʻri kelmaydigan har qanday maʼlumotni joylashtirish qulay.
Teglar ichida kontakt ma'lumotlari, saytning qo'shimcha bo'limlari va boshqalar kabi qo'shimcha ma'lumotlarni joylashtirish odatiy holdir.
Demak, endi siz zamonaviy veb-saytlar nimadan iboratligini biroz koʻproq bilasiz. ga misol keltiramizboshimdagi g'alayon o'rnini tushuncha qo'rquvi egalladi.
Shunday qilib, hosting operatoringiz saytida fayl boshqaruvchini ochib, index.php nomli hujjatni topsangiz, unda bemalol saytingiz tuzilishini noldan boshlab yozing.
Mening birinchi veb-saytim
Sahifa nomi
Sahifa tavsifi
Havola №1 | №2 havola | Havola №3
Maqolaning sarlavhasi
Bu har qanday ma'lumotni o'z ichiga olgan blok bo'lib, CSS yordamida siz ushbu blokni va butun saytni barcha mazmuni bilan o'zingiz xohlagan tarzda ranglashingiz mumkin. © Barcha huquqlar himoyalangan
Sayt uchun turli xil sozlamalar borligini aytganimizni eslaysizmi? Mana:
- Brauzerlarga sayt rus va inglizcha belgilarni oʻz ichiga olishi mumkinligini koʻrsatamiz (aks holda saytni ochganingizda dahshatli krakozyabrni koʻrasiz).
- brauzer yorlig'ida va qidiruv tizimida ("Yandex", Google va shunga o'xshash) ko'rsatiladigan sahifa nomini ko'rsatish uchun ishlatiladi.
Albatta, CSS uslubisiz saytingiz ziqna ko'rinadi (oq fonda qora harflar), lekin birinchi sahifangizni HTMLda yozishni unutmang.
Tabriklaymiz! Siz o'z veb-saytingizda birinchi veb-sahifangizni yaratdingiz! Bu qiziqroq bo'ladi!