Wybór między div, article, section i main bywa źródłem niepotrzebnych dyskusji. Każdy z tych elementów ma jasno określoną rolę, a ich niewłaściwe użycie psuje strukturę dokumentu bardziej niż brak jakiegokolwiek podziału. div to neutralny pojemnik, który nie niesie ze sobą żadnego znaczenia semantycznego. Stosuje się go do grupowania elementów wyłącznie w celach stylistycznych lub skryptowych, kiedy żaden inny znacznik nie pasuje. article opisuje samodzielną treść, która mogłaby funkcjonować poza kontekstem strony, na przykład wpis na blogu, komentarz czy karta produktu. section grupuje tematycznie powiązane fragmenty, zwykle z własnym nagłówkiem, ale bez gwarancji niezależności. main wyznacza główną treść dokumentu i może wystąpić tylko raz na stronie.

W praktyce najwięcej wątpliwości budzi rozróżnienie między article i section. Jeśli fragment tekstu mógłby zostać opublikowany osobno i nadal miałby sens, sięgnij po article. Jeśli stanowi jedynie część większej całości i bez niej traci kontekst, lepszym wyborem będzie section. Warto pamiętać, że elementy można zagnieżdżać: section może zawierać kilka artykułów, a article może mieć własne sekcje. Jeżeli chcesz uporządkować tę wiedzę, zerknij na omówienie Article i section, które rozróżnia dwa pojemniki na treść, zanim zaczniesz przepisywać szablon. main rezerwuj wyłącznie dla głównej zawartości strony, pomijając nawigację, stopkę i pasek boczny, bo te elementy powtarzają się na każdym widoku.

Praktyczna zasada jest prosta: najpierw zastanów się, jaką rolę pełni dany fragment, dopiero potem wybieraj znacznik. div zostaw na sytuacje, w których potrzebujesz kontenera bez znaczenia, na przykład do siatki CSS. article stosuj do treści niezależnych, section do grupowania tematycznego, a main do wyodrębnienia najważniejszej części dokumentu. Taki układ poprawia dostępność, ułatwia nawigację czytnikom ekranu i porządkuje kod na tyle, że po powrocie do projektu po miesiącach od razu wiadomo, co jest czym. Zamiast mnożyć divy, lepiej poświęcić chwilę na przemyślenie struktury, bo semantyczny HTML to nie ozdoba, lecz realne wsparcie dla użytkowników i wyszukiwarek.