Nowy HTML5
SEKCJA element może być nieco mylący. Jeśli tworzyłeś dokumenty HTML przed HTML5, prawdopodobnie już używasz tego elementu do tworzenia podziałów strukturalnych na twoich stronach, a następnie stylizowania stron za ich pomocą. Więc może wydawać się naturalną rzeczą po prostu zastąpienie istniejącego
DIV elementy z
SEKCJA elementy. Ale jest to technicznie niepoprawne. Więc jeśli nie tylko zastąpisz
DIV elementy z
SEKCJA elementy, jak z nich korzystać poprawnie?
Element SEKCJI to element semantyczny
Pierwszą rzeczą do zrozumienia jest to, że
SEKCJA element jest elementem semantycznym. Oznacza to, że nadaje on zarówno agentom użytkownika, jak i ludziom znaczenie zawartości załączonej - w szczególności sekcji dokumentu.
Może się to wydawać bardzo ogólnym semantycznym opisem, a to dlatego, że tak jest. Istnieją inne elementy HTML5, które zapewniają więcej semantycznych rozróżnień treści, których powinieneś użyć przed użyciem
SEKCJA element:
-
ARTYKUŁ
-
NA BOK
-
NAV
Kiedy używać elementu SECTION
Użyj
ARTYKUŁ element, gdy treść jest niezależną częścią witryny, która może działać samodzielnie i być dystrybuowana jak artykuł lub blog. Użyj
NA BOK element, gdy zawartość jest stycznie powiązana z treścią strony lub samą witryną, na przykład z pasków bocznych, adnotacji, przypisów dolnych lub powiązanych informacji o witrynie. Użyj
NAV element dla treści nawigacyjnych.
The
SEKCJA element jest generycznym elementem semantycznym. Używa się go, gdy żaden z pozostałych semantycznych elementów kontenera nie jest odpowiedni. Używa się go do łączenia części dokumentu w odrębne jednostki, które można opisać jako powiązane w jakiś sposób. Jeśli nie możesz opisać elementów w sekcji w jednym lub dwóch zdaniach, to prawdopodobnie nie powinieneś używać tego elementu.
Zamiast tego powinieneś użyć
DIV element. The
DIV element w HTML5 jest niesemantycznym elementem kontenera. Jeśli treść, którą próbujesz połączyć, nie ma znaczenia semantycznego, ale musisz ją jeszcze połączyć w styl, a następnie
DIV element jest odpowiednim elementem do użycia.
Jak działa element SEKCJI
Część dokumentu może być zewnętrznym kontenerem artykułów i
NA BOK elementy. Może również zawierać treści, które nie są częścią
ARTYKUŁ lub
NA BOK. ZA
SEKCJA element można również znaleźć wewnątrz
ARTYKUŁ,
NAV, lub
NA BOK. Można nawet zagnieżdżać sekcje, aby wskazać, że jedna grupa treści jest sekcją innej grupy treści, która jest sekcją artykułu lub strony jako całości.
The
SEKCJA element tworzy elementy wewnątrz obrysu dokumentu. I jako taki, zawsze powinieneś mieć element nagłówka (
H1 przez
H6) jako część sekcji. Jeśli nie możesz wymyślić tytułu sekcji, a następnie ponownie
DIV element jest prawdopodobnie bardziej odpowiedni. Pamiętaj, jeśli nie chcesz, aby tytuł sekcji pojawiał się na stronie, możesz zawsze zamaskować go za pomocą CSS.
Kiedy nie używać elementu SEKCJI
Poza powyższymi wskazówkami, aby najpierw użyć bardziej szczegółowych elementów semantycznych, istnieje jeden określony obszar, którego nie powinieneś używać
SEKCJA element: tylko w stylu.
Innymi słowy, jeśli jedynym powodem, dla którego umieszczasz element w tym miejscu, jest dołączenie właściwości stylu CSS, nie powinieneś używać a
SEKCJA element. Znajdź element semantyczny lub użyj
W końcu może nie mieć znaczenia
Trudność z pisaniem semantycznego HTML polega na tym, że to, co dla mnie jest semantyczne, może być dla ciebie kompletnym nonsensem. Jeśli uważasz, że możesz usprawiedliwić korzystanie z
SEKCJA element w twoich dokumentach, powinieneś go użyć. Większość programów klienckich nie przejmuje się i wyświetla stronę tak, jak można się tego spodziewać
DIV lub
SEKCJA.
Dla projektantów, którzy lubią semantycznie poprawne, używając
SEKCJA element w semantycznie prawidłowy sposób jest ważny. Dla projektantów, którzy chcą tylko, aby ich strony działały, nie jest to tak ważne. Uważamy, że pisanie semantycznie poprawnego kodu HTML jest dobrą praktyką i zapewnia, że strony będą bardziej odporne na przyszłość. Ale w końcu to zależy od ciebie.
