Przejdź do treści

HTML5

Szablon strony w HTML5

Mając do dyspozycji język HTML 4.01, jedyną możliwością zbudowania prawidłowego szkieletu strony, było wykorzystanie bloków DIV. Sekcje szkieletu zwykle były potem formatowane przy pomocy CSS, a więc takie użycie znaczników mogło być prawidłowe. Bardzo dawno temu, gdy nie było innej możliwości, używało się do tego tabel, ale takie podejście jest dziś uznawane za bardzo poważny błąd semantyczny.

W HTML5 zostały jednak wprowadzone zupełnie nowe znaczniki, dzięki którym możemy zbudować szablon strony w sposób jeszcze bardziej semantyczny. Spróbujmy to wykonać, przekształcając kod podany w rozdziale: Szablon strony na DIV-ach. W tym celu przypomnijmy sobie, że element BODY jest korzeniem sekcji (zobacz: "Sekcje / Nagłówki sekcji" w rozdziale "Nowe elementy HTML5"). Wynika z tego, że wszystkie sekcje w nim umieszczone odnoszą się tak naprawdę nie do konkretnego artykułu zamieszczonego w pojedynczym dokumencie, ale do witryny jako całości.

<!doctype html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>...</title>
	</head>
	<body>
		<div id="top">
			<header id="NAGLOWEK">Nagłówek szablonu</header>
			<nav id="MENU">Menu nawigacyjne</nav>
			<aside id="INFORMACJE">Dodatkowe informacje</aside>
			<article id="TRESC">Treść strony</article>
			<footer id="STOPKA">Stopka serwisu</footer>
		</div>
	</body>
</html>

Znaczenie wyróżnionych fragmentów kodu zostało objaśnione w rozdziale: Szablon strony na DIV-ach. Tam również znajdziesz praktyczne przykłady sposobów układania poszczególnych sekcji szkieletu na stronie.

Objęcie całego szkieletu elementem DIV, jest poprawne, ponieważ w tym miejscu ma on na celu przygotowanie pojemnika, koniecznego do zmiany wyglądu całej strony (przy pomocy CSS). Właśnie do tego został przeznaczony ten element. Zwykle objęcie całej zawartości ciała dokumentu znacznikiem ARTICLE, nie jest najlepszym rozwiązaniem. Został on przewidziany po to, aby zaznaczyć, że objęta nim treść może być opublikowana oddzielnie. Ale przecież tutaj nie mielibyśmy do czynienia z fragmentem dokumentu, lecz jego całością. Podobnie wstawienie w tym miejscu znacznika SECTION raczej wydaje się bezcelowe, skoro element BODY jest już korzeniem sekcji.

Zobacz także

Komentarze

Zobacz więcej komentarzy