HTML #2 – Szablon dokumentu

Sty 19
2010

Aby poinformować przeglądarkę, że ma do czynienia z dokumentem typu HTML należy na samym początku wstawić znacznik <html> – jednocześnie na samym końcu powinno się go zamknąć odpowiednim znacznikiem zamykającym jakim jest </html>. Tak oto utworzyliśmy ramę dokumentu.

 

 

Szablon dokumentu

Jednakże oprócz <html> należy zadbać o pojawienie się kilku innych niezbędnych elementów. Przyjrzyjmy się poniższemu podstawowemu szablonowi dokumentu typu (x)HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<head>
<title>Tytuł strony</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="Description" content="Nazwa" />
<meta name="Keywords" content="slowa,kluczowe" />
</head>
<body bgcolor="white" text="black">
<span>
Treść...
<!-- KOMENTARZ -->
</span>
</body>
</html>

Dla osoby, która pierwszy raz ma styczność z HTML’em powyższy zapis może być całkowicie niezrozumiały. Jednakże jest to szablon pliku HTML, który używany jest na każdej stronie. Teraz krótkie omówienie każdej z linii.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Deklaracja DTD – informuje ona przeglądarkę w jakim języku została napisana strona. W tym przypadku XHTML 1.0 Strict, jest to obecny standard tworzenia stron. Nie trzeba zapamiętywać tego zapisu, jednakże należy go umieścić na początku każdego dokumentu.

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">

Otwarcie znacznika <html> wraz z informacją o języku w jakim jest napisana strona.

 <head>
<title>Tytuł strony</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="Description" content="Nazwa" />
<meta name="Keywords" content="slowa,kluczowe" />
</head>

Wszystko co znajduje się pomiędzy <head>, a </head> to nagłówek dokumentu.

<title>Tytuł strony</title>

Znacznik <title> to tytuł strony, który znajduje się na górnym pasku przeglądarki.

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

Deklaracja strony kodowej. Czyli informacja o kodowaniu w jakim został zapisany dokument. Na Windowsie, aby w przeglądarce pojawiły się polskie znaki trzeba będzie najprawdopodobniej zamienić utf-8 na iso-8859-2.

<meta name="Description" content="Nazwa" />

Gdzie nazwa wpisujemy opis naszej strony. Zostanie on wyświetlona w wyszukiwarce internetowej.

<meta name="Keywords" content="slowa,kluczowe" />

Gdzie slowa,kluczowe wpisujemy po przecinku słowa kluczowe, które najtrafniej pasują do tematyki naszego serwisu.
Znaczników <meta> jest oczywiście o wiele więcej jednakże nie są wymagane do prawidłowego funkcjonowania strony, tym bardziej do nauki podstaw HTML’a.

 <body bgcolor="white" text="black">
<span>
Treść...
</span>
</body>

Nadszedł czas na właściwą cześć strony, czyli jej ciało. Atrybut bgcolor określa kolor tła strony, natomiast text kolor tekstu. Wszystko co znajduje się pomiędzy znacznikami <body>, a </body>pojawi się w oknie przeglądarki. W tym przypadku na ekranie zostanie wyświetlony napis „Treść…”.

<!-- KOMENTARZ -->

Słowa objęte w <!– –> to komentarz, to co jest wewnątrz zostanie pominięte przez przeglądarkę i nie zostanie wyświetlone.

Zostaliśmy zapoznani z podstawowym szablonem języka HTML. Czas na umówienie podstawowych znaczników formatujących tego języka.

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *