Kwiecień 2024
P	W	Ś	C	P	S	N
« sty
1	2	3	4	5	6	7
8	9	10	11	12	13	14
15	16	17	18	19	20	21
22	23	24	25	26	27	28
29	30

Dobry i tani polski hosting Hekko

Kup kurs w Stefa Kursów z linku i otrzymaj 30 zł = 3000 pkt Premium

Chcesz otrzymać kupony na Aliexpress 19 dolarów (dla nowego użytkownika 4 kupony) lub podaj kod w podsumowania koszyka INJFWAPD?

Zwrot z zakupów ze sklepach internetowych (Allegro, MediaMarkt, Aliexpress itp.) sprawdź procent

Nie masz jeszcze konta w Revolut? Załóż i ciesz się dobrym przewalutowaniem i nie tylko

Inwestuj na Mintos wpłać 500 euro i otrzymaj bonus 10 euro - bonus wyższy wraz z wpłatą.

kwi/13

1

Znasz najprostszą poprawną strukturę dokumentu HTML5?

Brak komentarzy · Artykuł autorstwa RaVns, kategoria HTML/XHTML, Webmastering
Ilość odsłon wpisu: 9 357

Poniższa porada ma raczej charakter ciekawostkowy. A pytanie brzmi: jaką znasz najprostszą poprawną strukturę dokumentu HTML5?

Przechodząc do sedna najprostsza postać HTML5 może wyglądać tak:

<!DOCTYPE html>
<title>Prosty dokument</title>

Zobacz przykład: Prosty dokument HTML5

Patrząc na ten kod zapewne myślisz sobie, że to brednie lub że jest to bezużyteczne. Tak, więc kod jest jak najbardziej poprawnie walidowany przez walidator W3C.

Prosty dokument HTML5 wymaga podania tylko:

deklaracji typu dokumentu <DOCTYPE>
oraz znacznika tytułowego <title>

Wszelkie inne znaczniki są opcjonalne, a zarazem konieczne do tworzenia rozbudowanych stron.
Dlaczego w walidatorze pojawiły się ostrzeżenia (warnings)? przeczytaj …. (przyszła porada).

Tymczasem, klikając prawym przyciskiem w puste miejsce na tej prostej stronie i wybierając „Zbadaj element” (Google Chrome) w głównym oknie można zauważyć strukturę dokumentu. Jak widać, przeglądarki automatycznie dodają brakujące znaczniki. Zaglądając w źródło strony zobaczymy tylko ten sam kod co napisaliśmy.

Natomiast dokument XHTML, czy HTML 4 musiałby zawierać strukturę typu:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Prosty dokument XHTML</title>
</head>
<body>

Przykładowy akapit dokumentu XHTML

</body>
</html>

Prosty dokument XHTML – tu na przykładzie XHTML, który jest także używany.

Ciekawostki:

Przykładowo Standard HTML5 wcale nie wymaga stosowania zamykającego znacznika , gdyż przeglądarki automatycznie domykają niezamknięte znaczniki (w HTML5 jest to oficjalny mechanizm).

Jak można się domyślić takie działanie nie jest zalecane, ponieważ wprowadza pewnien chaos na stronie i może przyczyniać się do pojawiania się błędów. Postawienie np. znacznika div po niezamknięty p wywoła błąd podczas walidacji;
HTML5 pozwala też na brak użycia znacznika <title>, pod warunkiem, że zawarte w nim informacje dostarczone są w inny sposób.

Np. Wysyłanie dokumentu HTML w wiadomości e-mail, gdzie tytuł można zawrzeć w polu do tego przenaczonym, a w zawartości dokumentu resztę znaczników w tym doctype i treść.

Zobacz przykład: Prosty dokument HTML5 ze znacznikiem akapitu

Jak można zauważyć wszelkie inne znaczniki są nieobowiązkowe. Jednak dla usystematyzowania szkieletu dokumentu HTML5 stosuje się tradycyjne komponenty:
(zbiornik dla całego dokumentu HTML)
(zawiera zbiory informacji: , style CSS, skrypty itp.)
(zawiera treść strony: tekst, obrazki wraz ze wszystkimi innnymi znacznikami i różne dołączane elementy webowe)

<html> (zbiornik dla całego dokumentu HTML)
<head> (zawiera zbiory informacji: , style CSS, skrypty itp.)
<body> (zawiera treść strony: tekst, obrazki wraz ze wszystkimi innnymi znacznikami i różne dołączane elementy webowe)