Struktura dokumentu HTML

Wtorek, 23 Grudzień 2008 22:19

Dokumenty HTML są zwykłymi plikami tekstowymi z rozszerzeniem html lub htm. Do tworzenia plików tekstowych można więc użyć dowolnego edytora, który umożliwia utworzenie pliku tekstowego ASCII. Oczywiście istnieje szereg wyspecjalizowanych programów ułatwiających tworzenie tego typu dokumentów. Do najważniejszych ich cech należy kolorowanie składni, automatyczne zamykanie znaczników, wyświetlanie podpowiedzi oraz inne funkcje ułatwiające wydajne wprowadzanie kodu.

Niezależnie od wybranego edytora, dokument powinien posiadać odpowiednią strukturę, na którą składa się nagłówek oraz cześć główna dokumentu. W najprostszej formie szkielet dokumentu HTML może wyglądać następująco:

 
<html>
<head>
</head>
<body>
</body>
</html>

Jest to bardzo uproszczona struktura składająca się z trzech znaczników <html>, <head> i <body>. Znacznik <html> obejmuje wszystkie znaczniki i wyznacza ramy dokumentu html. Wewnątrz elementu <head> znajduje się nagłówek dokumentu, w którym powinny się znaleźć znaczniki opisujące dokument. Para znaczników <body> wyznacza z kolei cześć główną dokumentu tzw ciało (ang. body - ciało).

Przedstawiona strukturę należy rozbudować o dodatkowe elementy, wymagane przez obowiązujące obecnie standardy. Pierwszym z takich elementów jest definicja typu dokumentu DTD.

 
<!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">
<head>
<title>Tytuł strony</title>
</head>
<body>
</body>
</html>

Drugim jest atrybut xmlns elementu <html> informujący, że jest to dokument XHTML.

Deklaracja typu dokumentu informuje przeglądarkę internetową wg. jakich reguł był tworzony dany dokument HTML. Na stronie organizacji W3C, zajmującej się opracowywaniem standardów sieciowych, znajduje się lista rekomendowanych typów dokumentów. Element <title> odpowiada za tytuł dokumentu. W przypadku strony internetowej tytuł zostanie wyświetlony na na pasku tytułu okna przeglądarki internetowej.

Wewnątrz sekcji nagłówka umieszcza się elementy meta, które definiują właściwości dokumentu HTML m.in. sposób kodowania dokumentu, opis zawartości, określić autora lub zamieścić inne dodatkowe informacje.

 
<!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">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
  <meta http-equiv="Content-Language" content="pl" />
  <meta http-equiv="Reply-To" content="adres_email[malpa]serwer.pl" />
  <meta http-equiv="Creation-Date" content="Thu, 25 Dec 2008 10:36:53 GMT" />
  <meta name="Description" content="opis zawartości" />
  <meta name="Keywords" content="słowa, kluczowe" />
  <meta name="Author" content="q3d" />
  <meta name="Robots" content="all" />
  <title>Tytuł strony</title>
</head>
<body>

Prosta pierwotnie struktura została rozbudowana o kilka dodatkowych elementów . Do kluczowych należy:

 
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />

określający użyte kodowanie znaków w edytorze tekstu, który posłużył do przygotowania dokumentu.

Fragment nagłówka:

 
  <meta http-equiv="Content-Language" content="pl" />
  <meta http-equiv="Reply-To" content="adres_email[malpa]serwer.pl" />
  <meta http-equiv="Creation-Date" content="Thu, 25 Dec 2008 10:36:53 GMT" />

informuje odpowiednio o: języku dokumentu, adresie e-mail autora i dacie utworzenia.

Elementy:

 
  <meta name="Description" content="opis zawartości" />
  <meta name="Keywords" content="słowa, kluczowe" />

dawniej były wykorzystywane przez wyszukiwarki internetowe do zindeksowania strony www, obecnie jednak mają mniejsze znaczenie. Dodatkowo element:

 
  <meta name="Robots" content="all" />

zezwala robotom sieciowym na indeksowanie dokumentu.

Dokumenty HTML często korzystają z zewnętrznych plików m.in. przechowujących informacje o formatowaniu wyglądu dokumentu oraz ikonę symbolizującą dokument. Pliki te są załączane poprzez użycie elementu <title> z odpowiednią wartością argumentu rel.
Poniższy przykład, dokonując wymaganych modyfikacji, można wykorzystać przy tworzeniu kolejnych dokumentów 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">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
  <meta name="Description" content="opis zawartości" />
  <meta name="Keywords" content="słowa, kluczowe" />
  <meta http-equiv="Content-Language" content="pl" />
  <meta name="Author" content="q3d" />
  <meta http-equiv="Reply-To" content="adres_email[malpa]serwer.pl" />
  <meta http-equiv="Creation-Date" content="Thu, 25 Dec 2008 10:36:53 GMT" />
  <meta name="Robots" content="all" />
  <title>Tytuł strony</title>
  <link rel="Shortcut icon" href="ikona_strony.ico" />
  <link rel="Stylesheet" type="text/css" href="style.css" />
</head>
<body>

Komentarze

vwdppfylhto

Poniedziałek 31 Maj 2010, 09:55

GfF0MM vzacojuvxmka, [url=http://wilfrjgdvnrg.com/]wilfrjgdvnrg[/url], [link=http://axysxsuajwbq.com/]axysxsuajwbq[/link], http://qfjqfkbbxups.com/

Odpowiedź

cdmmvdilowt

Poniedziałek 07 Czerwiec 2010, 15:53

Atze0T ceybupkjexyj, [url=http://ggsrpmzyuuku.com/]ggsrpmzyuuku[/url], [link=http://iayhweirwmah.com/]iayhweirwmah[/link], http://nflvolajzhqu.com/

Odpowiedź

jioquwelfl

Czwartek 17 Czerwiec 2010, 07:52

CIBZWu yykxmgcmbzxb, [url=http://uvqoszypjhrq.com/]uvqoszypjhrq[/url], [link=http://jivblkldphoc.com/]jivblkldphoc[/link], http://yjhzpqepgmzm.com/

Odpowiedź

mwcubs

Niedziela 20 Czerwiec 2010, 11:04

JUTRGC lyagklheudrr, [url=http://xdxrjhydxcap.com/]xdxrjhydxcap[/url], [link=http://pmuhesckfehz.com/]pmuhesckfehz[/link], http://ojikteklfiaw.com/

Odpowiedź

ksxeckho

Sobota 10 Lipiec 2010, 10:13

gtxleobq qhlasvnl http://rhmhtpwq.com rvqcqcuw vvfwiwre [URL=http://tcslbges.com]vttpmcas[/URL]

Struktura dokumentu HTML

Komentarze

Kategorie

Ostatnio dodane

Login