JS HTML First
HTML-first nima?
HTML-First - bu HTML sahifaning asosi bo‘lgan veb-saytlarni yaratish usuli.
Sahifani o‘qish mumkin, foydalanish mumkin va Basic HTML va CSS bilan foydalanish mumkin bo‘lishi kerak.
Ushbu yondashuv Progressive Enhancement bilan chambarchas bog‘liq.
Misol
<!DOCTYPE html>
<html>
<body>
<h1>HTML First</h1>
<article>
<h2>Welcome</h2>
<p>This page works without JavaScript.</p>
</article>
</body>
</html>
O‘zingiz sinab ko‘ring »
JavaScript ramkalari va murakkab mijoz ilovalari bilan boshlash o‘rniga, HTML-ning birinchi rivojlanishi toza va mazmunli HTML bilan boshlanadi.
Veb-sahifaning mazmuni va tuzilishi JavaScript qo‘shilishidan oldin ishlashi kerak.
Keraksiz JavaScript’dan saqlaning
JavaScript kuchli, lekin juda ko‘p JavaScript veb-saytlarni sekinroq va murakkablashtirishi mumkin.
Ko‘pgina veb-saytlar ko‘proq HTML, CSS va kamroq JavaScript bilan tuzilishi mumkin.
HTML-first yondashuvi quyidagilarni yaxshilashga yordam beradi:
- Page speed
- Qulayliklar
- Search engine visibility
- Maintainability
- Reliability
Progressiv takomillashtirish
Progressive enhancement (bosqichma-bosqich takomillashtirish) ishlaydigan oddiy sahifadan boshlashni anglatadi.
Qo‘shimcha funksiyalar faqat brauzer ularni qo‘llab-quvvatlasagina qo‘shiladi.
Misol uchun, HTML formasi JavaScript muvaffaqiyatsiz bo‘lsa ham ishlashi kerak.
Misol
<form action="Action Page" method="post">
<label for="email">Email:</label>
<input type="email" id="email" name="email" required>
<button type="submit">Subscribe</button>
</form>
O‘zingiz sinab ko‘ring »
Nima uchun HTML-first?
HTML-first yondashuvi JavaScript’dan voz kechish degani emas.
Bu qo‘shimcha murakkablik kiritishdan oldin brauzerning o‘rnatilgan xususiyatlaridan foydalanish haqida.
Ko‘pgina umumiy veb-sayt xususiyatlari faqat HTML va CSS yordamida yaratilishi mumkin.
Brauzerlar allaqachon kuchli
Modern browsers understand many useful HTML elements.
Ushbu elementlar tuzilmani, xatti-harakatni, tekshirishni va foydalanish imkoniyatini ta’minlashi mumkin.
Examples include <form>, <button>, <details>, <summary>, and <dialog>.
Misol
<details>
<summary>Click to read more</summary>
<p>This text can be opened and closed without JavaScript.</p>
</details>
O‘zingiz sinab ko‘ring »
Kamroq JavaScript — tezroq sahifalar degani bo‘lishi mumkin
JavaScript brauzer tomonidan yuklab olinishi, tahlil qilinishi, kompilyatsiya qilinishi va bajarilishi kerak.
Katta JavaScript fayllari sahifaning birinchi yuklanishini sekinlashtirishi mumkin.
Bu, ayniqsa, mobil telefonlar va sekin tarmoqlarda seziladi.
Kichikroq sahifalar tezroq yuklanadi, kamroq xotira sarflaydi va tezroq javob beradigandek tuyuladi.
HTML JavaScript yuklanishidan oldin ishlaydi
HTML brauzer uni qabul qilishi bilanoq ko‘rsatiladi.
Bu shuni anglatadiki, foydalanuvchilar ko‘pincha skriptlar yuklanishi tugaguniga qadar sahifani o‘qishni boshlashlari mumkin.
Qo‘llanmalar, maqolalar, mahsulot sahifalari, hujjatlar va shakllar uchun bu ko‘pincha yetarli.
Semantik HTML qulaylikni (accessibility) oshiradi
Semantik HTML elementlardan ularning to‘g‘ri ma’nosiga ko‘ra foydalanadi.
Bu ekranni o‘qiydiganlarga, qidiruv tizimlariga, klaviatura foydalanuvchilariga va boshqa vositalarga sahifani tushunishga yordam beradi.
Misol
<main>
<article>
<p>Use meaningful HTML first.</p>
</article>
</main>
O‘zingiz sinab ko‘ring »
JavaScript qachon hali ham foydali
JavaScript ko‘plab interaktiv imkoniyatlar uchun hali ham muhim.
HTML-ning birinchi g‘oyasi JavaScript-ni oldin emas, balki kerak bo‘lganda qo‘shishdir.
HTML-first JavaScript’dan hech qachon foydalanmaslik degani emas. Bu JavaScript’dan oldin HTML degani.
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!