Gdy użytkownik wchodzi na stronę WWW przeglądarka potrzebuje informacji, jakiego rodzaju jest to dokument, aby go poprawnie wyświetlić. Informację tę uzyskuje dzięki znacznikowi !DOCTYPE; identyfikuje on wersję języka, w którym dokument został napisany. Jeśli dokument jest zgodny ze specyfikacją HTML 4.0, powinno stosować się prolog:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
Jeśli dokument jest zgodny z wcześniejszą specyfikacją HTML
3.2 to:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
lub
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
Dokument HTML na samym początku powinien zawierać, co najmniej trzy elementy, aby odpowiadał przyjętemu standardowi:
<HTML></HTML>
Znacznik otwierający i zamykający dokumentu, między którymi umieszczana jest cała treść dokumentu. Element
<html>
identyfikuje dokument jako zawierający elementy języka HTML. Znacznik nie jest
bezpośrednio widoczny w przeglądarce.
<HEAD></HEAD>
Element <head> nie ma bezpośredniego wpływu na wygląd
dokumentu w przeglądarce. Jest stosowany w celu dołączenia informacji o dokumencie HTML.
Umieszczany jest wewnątrz znaczników HTML. W ramach HEAD znajduje się część nagłówkowa
dokumentu.
Najważniejsze polecenia umieszczane pomiędzy <HEAD></HEAD> to:
<TITLE> Określa tytuł dokumentu.
<LINK> Odnośnik do innego dokumentu.
<STYLE> Tworzy arkusz stylu dla dokumentu.
<META> Przekazuje informacje serwerom i użytkownikom.
<BODY></BODY>
Jest to znacznik umieszczany wewnątrz znaczników HTML, za znacznikami HEAD. Zawiera konkretną treść dokumentu. Chociaż interpretacja tego znacznika nie ma
bezpośredniego wpływu na wygląd dokumentu, to jego obecność jest obowiązkowa.
Przykład:
<HTML>
<HEAD>
Informacje o dokumencie, łącznie z tytułem
</HEAD>
<BODY>
Treść dokumentu - tekst, grafika, odsyłacze itp.
</BODY>
</HTML>
Więcej szczegółów o HEAD
Znacznik HEAD odpowiada za określenie podstawowych właściwości dokumentu HTML tj. strona kodowa, tytuł, informacji o autorze oraz słów kluczowych i opisu strony. Definiując <tHEAD> możemy wstawić kilka dalszych parametrów, dzięki którym uzupełnimy informacje o stronie. Są to:
<TITLE></TITLE>
Znacznik TITLE to najczęściej pierwszy element nagłówka <HEAD>, po nim występują polecenia META i inne znaczniki. Służy on do wyświetlenia tytułu strony na pasku zadań przeglądarki. Tytułu nie należy mylić z pierwszym nagłówkiem strony. Ważne jest też, że tytuły są używane przez wyszukiwarki takie jak Yahoo, AltaVista czy polski Onet. Tytuł pojawia się w wynikach wyszukiwania wszystkich wyszukiwarek, dlatego jego atrakcyjność zwiększa szanse wejścia na stronę. Znacznik TITLE jest najistotniejszym elementem nagłówka dokumentu dla wyszukiwarek.
Przykład:
<HEAD>
<TITLE>Tutaj wpisujemy tutuł strony</TITLE>
</HEAD>
LINK
W celu przyłączenia zewnętrznego opisu wyglądu dokumentu można wykorzystać znacznik LINK.
Przykład:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<HTML>
<HEAD>
<TITLE>Tytuł</TITLE>
<LINK rel="stylesheet" href="przyklad.css"
type="text/css">
</HEAD>
<BODY>
<H1>Przyklad 1</H1>
To jest tekst na stronie.
</BODY>
</HTML>
Znacznik LINK zawiera:
- typ: "stylesheet";
- nazwę i położenie opisu wyglądu wewnątrz atrybutu "href";
- typ opisu wyglądu określonego przez: "text/css".
Ustawienia META
Znaczniki Meta są niezbędnymi elementami nagłówka dokumentu HTML. Dzięki nim informujemy, kto jest autorem strony, jaki jest jej temat, kiedy została stworzona, jaki jest standard czcionek i wiele innych. Znaczniki META pełnią decydującą rolę w uzyskaniu wysokiego miejsca w wynikach wyszukiwania, w wyszukiwarkach internetowych.
Usytuowanie znaczników META
Znaczniki META powinny być usytuowane w nagłówku dokumentu pomiędzy znacznikami HEAD
a przed znacznikiem BODY. Zalecane jest umieszczenie w nagłówku jako pierwszej informacji o tytule strony TITLE, a następnie znaczników Meta. Należy pamiętać o umieszczaniu znaczników we wszystkich ramkach FRAMES tworzących serwis internetowy.
Znaczniki meta mają dwa zadania:
- Interakcja z Web serwerem - atrybut HTTP-EQUIV
- Dostarczenie dodatkowych informacji na temat strony WWW - atrybut NAME
Atrybut HTTP-EQUIV
Aby zrozumieć składnię nagłówka HEAD dokumentów HTML należy zrozumieć, co się dzieje, kiedy przeglądarka internetowa otwiera stronę WWW. Po wpisaniu w przeglądarce adresu strony, Web Serwer otrzymuje pytanie Twojej przeglądarki przez HTTP. Jeżeli strona, o którą się pytamy rzeczywiście znajduje się na serwerze, generowana jest odpowiedź przez HTTP. Dane wysyłane w odpowiedzi nazywane są "HTTP header block" - blok nagłówka http.
Nagłówek instruuje przeglądarkę internetową, w jaki sposób ma być pokazany dokument. Web Serwer automatyczne tłumaczy znaczniki Meta HTTP-EQUIV na nagłówki HTTP tak, aby przeglądarka użytkownika widziała je jak zwykłe elementy nagłówka. Znaczniki Meta HTTP-EQUIV sterują zachowaniem się przeglądarek internetowych oraz dostarczaniem dodatkowych informacji.
- <META HTTP-EQUIV=Expires CONTENT="data"> - informuje o dacie ważności dokumentu.
- <META HTTP-EQUIV="Content-Script-Type" CONTENT="text/javascript"> - ustawia po stronie klienta język skryptów na
JavaScript.
- <META HTTP-EQUIV="Content-Style-Type" CONTENT="text/css"> - ustawia styl wyświetlania zawartości strony na
CSS.
- <META HTTP-EQUIV="Content Type" CONTENT="text/html;charset=iso-8859-2"> - ustawia sposób kodowania czcionek na polski standard iso-8859-2.
- <META HTTP-EQUIV=Refresh CONTENT="30; URL=http://adres strony WWW/">
-
przekierowuje na podaną stronę WWW, 30 sekund po załadowaniu bieżącej strony..
- <META HTTP-EQUIV="Content-Language" CONTENT="pl"> - określa język dokumentu.
- <META HTTP-EQUIV="Window-target" CONTENT="_top"> - zapobiega
umieszczeniu bieżącej strony w ramce innego dokumentu.
Atrybut NAME
Atrybut znacznika Meta NAME zastępuje HTTP-EQUIV wtedy, gdy informacja zawarta w
poleceniu jest nagłówkiem HTTP. Wszystkie przeglądarki internetowe prawidłowo interpretują atrybut NAME, dzięki któremu można umieścić niezbędne dla wyszukiwarek informacje dotyczące serwisu. Najczęściej używane znaczniki Meta z atrybutem NAME to:
- <META NAME=KEYWORDS CONTENT="słowa kluczowe"> - lista
słów kluczowych oraz fraz charakterystycznych dla dokumentu.
- <META NAME=DESCRIPTION CONTENT="opis strony WWW"> - krótka charakterystyka dokumentu.
- <META NAME=ROBOTS CONTENT="noindex,follow"> - informacja dla robotów
wyszukiwarek, czy mają indeksować strony, katalogi serwisu.
- <META NAME= "author" CONTENT= "autor"> - informacja o autorze strony.
- <META NAME= "reply-to" CONTENT= "adres e-mail"> - adres e-mail autora.
Poprawnie zbudowana strona WWW:
Przykład:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-type" CONTENT="text/html; charset=iso-8859-2">
<META HTTP-EQUIV="Replay to" CONTENT="adres e-mail autora">
<META NAME="Description" CONTENT="Krótki opis strony">
<META NAME="Keywords" CONTENT="słowa kluczowe">
<META NAME="Autor" CONTENT="Autor dokumentu">
<META NAME="Generator"" CONTENT="program w ktorym stworzona została strona">
<META HTTP-EQUIV="Content-Language" CONTENT="pl">
<META HTTP-EQUIV="Creation-date" CONTENT="2002-02-20 T20:17:17Z">
<TITLE>Tytuł</TITLE>
</HEAD>
<BODY BGCOLOR=#FFFF99>
Zawartość strony WWW.
</BODY>
</HTML>
