Czy jesteś początkującym lub ekspertem w Hyper Text Markup Language (HTML), ważne jest, aby przestrzegać kilku najlepszych praktyk w celu zachowania spójności i organizacji dokumentów HTML. Z tak wieloma elementami, atrybutami, właściwościami, wartościami i innymi – jest wiele do nauczenia się.
Oto 10 najlepszych praktyk HTML, o których warto pamiętać podczas pracy nad następnym projektem.
1. Używaj właściwej struktury dokumentu
Dokumenty HTML będą nadal działać bez elementów takich jak <html>, <head> i <body>. Jednak strony nie będą renderować się poprawnie w każdej przeglądarce, więc ważne jest, aby być konsekwentnym używając właściwej struktury dokumentu.
Przykład:
2. Zadeklaruj poprawny doctype
Podczas tworzenia dokumentu HTML, pierwszą rzeczą, którą należy zadeklarować jest doctype. To powie przeglądarce, jakich standardów używasz, aby poprawnie renderować swój znacznik. Doctype umieszcza się przed znacznikiem <html> na górze strony. Jeśli nie jesteś pewien, jakiej deklaracji użyć, W3.org dostarcza informacji na temat wyboru właściwego doctype.
3. Zawsze zamykaj znaczniki
Aby uniknąć napotkania błędów walidacji zawsze pamiętaj o znaczniku zamykającym dla każdego znacznika, który tworzysz.
4. Nie używaj stylów inline
Może się wydawać, że umieszczenie stylów w linii z kodem zamiast tworzenia zewnętrznego arkusza stylów jest łatwą drogą. Jednakże, style inline nie są dobrą praktyką kodowania, ponieważ utrudniają aktualizację i utrzymanie strony. Zamiast tego, trzymaj swoje style oddzielnie od znaczników HTML.
5. Używaj atrybutu alt z obrazami
Nie jest wymagane posiadanie atrybutu alt z obrazami, co sprawia, że łatwo go zignorować. Jednakże, ważne jest, aby mieć znaczący atrybut alt z powodów walidacji i dostępności. Atrybut alt zapewnia kontekst dla czytników ekranu, więc powinien być opisowy, co zawiera obrazek.
6. Często waliduj
Zamiast czekać aż skończysz z dokumentem HTML, waliduj swój kod wiele razy podczas pracy. Pomoże to zaoszczędzić trochę czasu poprzez wczesną identyfikację błędów, szczególnie jeśli dokument jest długi. Jednym z popularnych walidatorów HTML jest W3C’s markup validation service.
7. Umieść zewnętrzne arkusze stylów w znaczniku <head>
Pomimo, że zewnętrzne arkusze stylów mogą być umieszczone w dowolnym miejscu dokumentu HTML, najlepszą praktyką jest umieszczenie ich w znaczniku <head>. Dzięki temu Twoja strona będzie ładować się szybciej.
8. Używaj znaczników znaczących
Każda sekcja Twojej strony internetowej powinna być zbudowana przy użyciu najbardziej odpowiedniego dla danej treści znacznika HTML5. Najlepiej jest unikać nadmiernego używania ogólnych znaczników, takich jak <div>, gdy może istnieć bardziej opisowy znacznik do tego zadania, taki jak <section>, <article>, i tak dalej.
9. Używaj małych liter
Twój znacznik HTML może być napisany małymi lub dużymi literami, a strona internetowa będzie renderować się poprawnie. Jednak najlepszą praktyką jest pisanie nazw znaczników małymi literami, ponieważ jest to łatwiejsze do odczytania i utrzymania.
10. Zmniejsz liczbę elementów na stronie
DokumentyHTML mogą stać się skomplikowane, zwłaszcza w przypadku stron internetowych z dużą ilością treści. Aby zmniejszyć rozmiar swoich stron, sprawdź możliwości dalszej optymalizacji kodu, gdy już skończysz z jego markupem.
Chcesz dowiedzieć się więcej o najlepszych praktykach HTML? Sprawdź inne artykuły:
- Najlepsze praktykiHTML
- Standardy kodu Front-end &Najlepsze praktyki
- Pisanie najlepszego kodu
Nie chcesz robić tego sam lub potrzebujesz pomocy?
TBH Creative zawsze stara się być na bieżąco z najlepszymi praktykami w tworzeniu stron internetowych.
Przykłady.