Kurs HTML - HTML

Transkrypt

Kurs HTML - HTML
Kurs HTML - HTML - BODY i META
Strona 1
BODY i META
W tym rozdziale dowiesz się...
Co to jest nagłówek, a co ciało dokumentu? Jak dodać do dokumentu dodatkowe informacje, mówiące o jego
charakterze?
W jaki sposób zmienić kolor tekstu na stronie WWW?
W jaki sposób zmienić kolor tła strony WWW?
W jaki sposób wstawić obrazek (grafikę, zdjęcie) w tle strony WWW (tapeta)?
Jak zmienić kolor odsyłaczy (hiperłączy, odnośników hipertekstowych, linków) na stronie WWW?
Jak zmienić szerokość marginesów strony WWW?
Jak zmienić kolor suwaków do przewijania?
Jak zmienić tytuł strony, który wyświetla się na górze okna przeglądarki oraz w wyszukiwarkach sieciowych?
O czym nie naleŜy zapominać pisząc stronę WWW po polsku?
W jaki sposób zachęcić internautów aby odwiedzili Twoją stronę? Jak wstawić opis, który wyświetli się w
wyszukiwarkach (Google)?
W jaki sposób podwyŜszyć pozycję strony WWW w wyszukiwarkach (Google)?
Jak określić w jakim języku (mówionym) jest napisana strona WWW?
Gdzie wpisać autora strony WWW?
Jak określić adres e-mail, na który moŜna odpisać na stronie WWW?
Jak ustawić datę utworzenia dokumentu HTML na stronie WWW? Jak utworzyć datę w formacie GMT
(Greenwich Mean Time)?
Jak ustawić datę ostatniej modyfikacji dokumentu HTML na stronie WWW?
Jak przekazać informację o aktualności strony WWW?
Co zrobić, aby strona WWW była automatycznie odświeŜana co określony czas?
Jak wstawić przekierowanie na stronie WWW, czyli automatycznie wczytać inną stronę?
Jak wstawić na stronie WWW efekt specjalny przy wchodzeniu lub wychodzeniu?
Jak wstawić informację o edytorze uŜytym przy tworzeniu strony WWW?
W jaki sposób ułatwić indeksowanie (wyszukanie) strony WWW przez roboty wyszukiwarek sieciowych
(Google) lub sprawić, aby strona nie była odnajdowana przez wyszukiwarki? Jak zablokować indeksowanie
zdjęć lub plików z określonego katalogu?
Jak zmusić przeglądarkę, aby nie zapisywała elementów strony WWW (np. obrazków) na dysku
uŜytkownika?
W jaki sposób wstawić ikonę obok adresu strony WWW?
W jaki sposób ułatwić nawigację na stronie WWW?
Wstęp
Znaczniki <body>...</body> oraz <meta /> określają pewne informacje na temat strony jako całości.
Polecenie BODY powinno wchodzić w skład kaŜdego dokumentu HTML. Stanowi ono właściwą treść, czyli tzw.
ciało, w którym zawierają się wszystkie inne znaczniki, dotyczące formatowania, a takŜe zwykły tekst. Podając
dodatkowe atrybuty dla znacznika BODY, moŜna określić niektóre cechy wyglądu całej strony, takie jak kolor tła
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 2
oraz tekstu lub szerokość marginesów. W jednym dokumencie moŜe się znajdować tylko jeden znacznik <body> zaraz po nagłówku strony (<head>...</head>).
Natomiast znacznik <meta /> stanowi tzw. metainformację, pozwalającą określić pewne ogólne wiadomości,
dotyczące dokumentu, m.in. sposób kodowania znaków, opis zawartości strony, jej autora czy język, w którym
została napisana. Metainformacje nie wpływają bezpośrednio na wygląd dokumentu, lecz cechy które podają, są
równie waŜne. ChociaŜ nie są one wymagane, warto je stosować, poniewaŜ moŜe to np. pomóc w odszukaniu
strony przez wyszukiwarki sieciowe. KaŜdy dokument powinien zawierać obowiązkowo przynajmniej
deklarację strony kodowej, bez której polskie litery na stronie mogą zostać błędnie wyświetlone! W pojedynczym
dokumencie znajduje się zwykle kilka znaczników <meta /> - kaŜdy dotyczy innej wiadomości - wszystkie
muszą znajdować się wewnątrz nagłówka strony (<head>...</head>). Ponadto w tym rozdziale opisane zostaną
równieŜ inne przydatne znaczniki, które moŜna umieścić w nagłówku dokumentu, opisujące sam dokument, a nie
wyświetlające jakieś treści.
Oczywiście nie ma obowiązku stosowania dokładnie wszystkich atrybutów BODY oraz META, które zostały
przedstawione w tym rozdziale. Autor strony powinien sam wybrać te, które mu odpowiadają lub przekazują
według niego waŜne informacje. Jednak nigdy nie naleŜy zapominać o wstawianiu deklaracji strony kodowej,
natomiast podanie tytułu strony jest wręcz obowiązkowe! Zaleca się równieŜ wpisanie opisu zawartości strony oraz
wyrazów kluczowych.
Większość edytorów (X)HTML posiada specjalne generatory sekcji BODY oraz META, w których podaje się
wszystkie atrybuty oraz informacje dotyczące dokumentu, dzięki czemu nie trzeba tego robić ręcznie.
Kolor tekstu strony
<body text="kolor">... </body>
gdzie "kolor" oznacza definicję koloru [zobacz: Kolory].
Polecenie pozwala określić kolor tekstu na Twojej stronie internetowej (domyślnie zwykle jest to czarny). Staraj się
uŜywać barw, które będą się dobrze wyróŜniały na kolorze tła.
Edytory (X)HTML posiadają często specjalny selektor kolorów, za pomocą którego moŜna w prosty sposób
wybrać barwę o dowolnym odcieniu.
Równocześnie z kolorem tekstu strony powinniśmy koniecznie określić odpowiedni kolor tła, nawet jeśli
odpowiada nam domyślny. Pamiętaj, Ŝe uŜytkownik moŜe zmienić domyślny kolor tła w swoim systemie
operacyjnym, a wtedy istnieje prawdopodobieństwo, Ŝe będzie on podobny do koloru tekstu ustalonego na Twojej
stronie, co wywoła brak moŜliwości odczytania treści lub bardzo utrudni czytanie.
Atrybut TEXT jest zdeprecjonowany przez specyfikację HTML 4.01 - zaleca się stosowanie stylów.
Kolor tła strony
<body bgcolor="kolor">... </body>
gdzie "kolor" oznacza definicję koloru [zobacz: Kolory].
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 3
Polecenie pozwala określić kolor tła na Twojej stronie internetowej (domyślnie zwykle jest to biały). Pamiętaj, Ŝe
nie powinno się uŜywać barw bardzo jaskrawych jako kolory tła. Sprawiają one, Ŝe oczy szybko się męczą i
dodatkowo zaciemniają treść strony. Dodatkowo naleŜy pamiętać, aby na ustalonym kolorze tła, tekst był dobrze
widoczny.
Równocześnie z kolorem tła strony powinniśmy określić odpowiedni kolor tekstu, nawet jeśli odpowiada nam
domyślny. Pamiętaj, Ŝe uŜytkownik moŜe zmienić domyślny kolor tekstu w swoim systemie operacyjnym, a wtedy
istnieje prawdopodobieństwo, Ŝe będzie on podobny do koloru tła ustalonego na Twojej stronie, co wywoła brak
moŜliwości odczytania treści lub bardzo utrudni czytanie. To samo dotyczy koloru odsyłaczy hipertekstowych.
Atrybut BGCOLOR jest zdeprecjonowany przez specyfikację HTML 4.01 - zaleca się stosowanie stylów.
Tło obrazkowe
<body background="ścieŜka dostępu do obrazka">... </body>
lub
<body background="ścieŜka dostępu do obrazka" bgproperties="fixed">...</body>
(tło nieruchome - znak wodny - tylko Internet Explorer!)
gdzie jako "ścieŜka dostępu do obrazka" naleŜy podać lokalizację, gdzie znajduje się obrazek, który chcemy
umieścić w tle.
Jeśli znudziły Ci się juŜ strony o jednolitym kolorze, moŜesz umieścić w tle dowolny obrazek. Dzięki temu strona
moŜe wyglądać duŜo lepiej. Ponadto drugie z podanych poleceń pozwala zdefiniować tło obrazkowe które jest
nieruchome, tzn. nie przesuwa się wraz z tekstem, gdy przewijamy zawartość okna (tylko Internet Explorer).
Pamiętaj jednak, Ŝe obrazki o duŜych rozmiarach spowalniają wczytywanie strony. Dlatego staraj się uŜywać pliki
tylko w formacie *.jpg (dla zdjęć wielokolorowych) lub *.gif (dla rysunków). Są to formaty skompresowane,
zajmujące duŜo mniej miejsca niŜ zwykłe mapy bitowe *.bmp. Trzeba równieŜ pamiętać, aby obrazek w tle nie
był zbyt jaskrawy - spowoduje to tylko zaciemnienie zawartości strony i utrudni czytanie.
ZauwaŜ, Ŝe nie ma potrzeby stosowania obrazka tła o rozmiarze takim jak strona, poniewaŜ jego kopie są ustawiane
obok siebie tak, Ŝe zajmują cały obszar strony. Dlatego wystarczy wyciąć mały powtarzający się wzór, który
zostanie następnie powielony przez przeglądarkę.
NaleŜy unikać stosowania w tle duŜych obrazków wyciętych ze zwykłych zdjęć. Tło powinno: mieć łagodne kolory
(pastelowe, blade albo całkiem ciemne, ale nie jaskrawe; szczególnie odradza się jednoczesnego stosowania barw
jasnych oraz ciemnych, poniewaŜ uniemoŜliwia to dobranie odpowiednio czytelnego koloru tekstu), składać się z
powtarzalnych wzorów o niezbyt wielkich rozmiarach oraz być nieco rozmyte - nieostre (moŜna to uzyskać w
dowolnym bardziej rozbudowanym programie graficznym - odpowiedni efekt nazywa się zwykle: Rozmywanie albo
Blur). Dobrym pomysłem są tła imitujące strukturę jakiejś powierzchni.
Jeśli nie masz zacięcia artystycznego, nie musisz samodzielnie rysować obrazków tła. W Internecie na pewno
znajdziesz wiele stron, gdzie moŜesz je darmowo pobrać. Często są one dostępne równieŜ w edytorach HTML (np.:
FrontPage) oraz programach graficznych.
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 4
Równocześnie z atrybutem background="..." często podaje się dodatkowo zwyczajny kolor tła strony. W
takim przypadku, jeśli obrazek będzie niedostępny lub uŜytkownik wyłączy wyświetlanie obrazów, tło przyjmie
podany kolor. Ponadto jeŜeli obrazek posiada przezroczystość (np. format *.gif), zostanie ona zastąpiona
podanym kolorem.
Jeśli ustalimy kolor tekstu strony (text="...") zbliŜony do domyślnego koloru tła (zwykle biały), wskazane jest
podanie dodatkowo takiego koloru tła (bgcolor="..."), aby tekst był na nim czytelny. JeŜeli tego nie zrobimy, a
obrazek nie zostanie wyświetlony, moŜe wystąpić sytuacja typu: "biały tekst na białym tle".
MoŜe się to zdarzyć np. gdy obrazek w tle strony jest dość ciemny. Wtedy określa się zwykle jasny kolor tekstu,
zapominając o ustaleniu równocześnie ciemnego koloru tła - jako zabezpieczenie. Dopóki obrazek jest widoczny,
wszystko jest w porządku, lecz jeśli nie zostanie on wyświetlony, tło przyjmie najczęściej kolor biały (jako
domyślny) i w ten sposób otrzymamy stronę, której nie moŜna przeczytać :-(
Atrybut BACKGROUND jest zdeprecjonowany przez specyfikację HTML 4.01 - zaleca się stosowanie stylów.
Atrybut BGPROPERTIES nie wchodzi w skład specyfikacji HTML 4.01 - zaleca się stosowanie stylów.
Kolor odsyłaczy
<body link="kolor nowych" vlink="kolor odwiedzonych" alink="kolor
aktywnych">...</body>
gdzie "kolor nowych", kolor odwiedzonych" i "kolor aktywnych" oznaczają definicje kolorów [zobacz: Kolory],
przy czym:
kolor nowych
Kolor odsyłaczy które nie zostały jeszcze uŜyte
kolor odwiedzonych
Kolor odsyłaczy, które zostały juŜ uŜyte
kolor aktywnych
Kolor aktywnego odsyłacza, czyli takiego który właśnie został uŜyty
[zobacz: Odsyłacze].
Polecenie pozwala określić kolor odsyłaczy na stronie. Staraj się uŜywać barw, które będą się dobrze wyróŜniały na
kolorze tła oraz odróŜniały od koloru tekstu (aby odsyłacze były dobrze widoczne).
Równocześnie z kolorem odsyłaczy hipertekstowych powinniśmy określić odpowiedni kolor tła, nawet jeśli
odpowiada nam domyślny. Pamiętaj, Ŝe uŜytkownik moŜe zmienić domyślny kolor tła w swoim systemie
operacyjnym, a wtedy istnieje prawdopodobieństwo, Ŝe będzie on podobny do koloru odsyłaczy ustalonego na
Twojej stronie, co wywoła brak moŜliwości odczytania lub bardzo utrudni czytanie.
Atrybuty LINK, VLINK i ALINK są zdeprecjonowane przez specyfikację HTML 4.01 - zaleca się stosowanie
stylów.
Podświetlenie
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 5
Aby bardziej urozmaicić wygląd odnośników tekstowych, moŜna posłuŜyć się poleceniami stylów CSS. Pozwalają
one swobodnie zmieniać kolor i inne cechy odsyłaczy po wskazaniu ich myszką. Jeśli usuniemy wskaźnik myszki
znad takich łączy, zostanie im przywrócony pierwotny wygląd.
Aby wszystkie odsyłacze na stronie zmieniały kolor po wskazaniu myszką, naleŜy w treści nagłówkowej
dokumentu (w ramach <head>...</head>) umieścić następujący tekst:
<style type="text/css">
/* <![CDATA[ */
a:hover { color: kolor }
/* ]]> */
</style>
gdzie "kolor" oznacza definicję koloru.
Aby dodać tło, naleŜy wpisać (tak jak poprzednio w treści nagłówkowej):
<style type="text/css">
/* <![CDATA[ */
a:hover { background-color: kolor }
/* ]]> */
</style>
Aby połączyć powyŜsze efekty:
<style type="text/css">
/* <![CDATA[ */
a:hover { color: kolor1; background-color: kolor2 }
/* ]]> */
</style>
Aby zupełnie usunąć podkreślenie pod odsyłaczami:
<style type="text/css">
/* <![CDATA[ */
a { text-decoration: none }
/* ]]> */
</style>
Aby usunąć podkreślenie pod zwykłymi odsyłaczami i dodać je po wskazaniu myszką:
<style type="text/css">
/* <![CDATA[ */
a { text-decoration: none }
a:hover { text-decoration: underline }
/* ]]> */
</style>
Aby zupełnie usunąć podkreślenie tylko pod niektórymi odsyłaczami - np. w menu serwisu (kod do
wstawienia w wybranym miejscu strony):
<a href="adres.html" style="text-decoration: none">opis</a>
[Zobacz: Odsyłacze]
Aby dowiedzieć się więcej, zobacz: Selektory pseudoklas.
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 6
Szerokość marginesów
1. Internet Explorer (równieŜ Opera 7 i nowsze wersje przeglądarek na silniku Gecko, czyli Netscape/Mozilla/
Firefox):
<body leftmargin="x1 " rightmargin="x2" topmargin="y1"
bottommargin="y2">...</body>
x1
Szerokość lewego marginesu
x2
Szerokość prawego marginesu
y1
Wysokość górnego marginesu
y2
Wysokość dolnego marginesu
(wszystko w pikselach).
2. Netscape/Mozilla/Firefox:
<body marginwidth="x " marginheight="y">...</body>
x
Szerokość poziomego marginesu (lewy = prawy = x)
y
Wysokość pionowego marginesu (górny = dolny = y)
(wszystko w pikselach).
Polecenie to pozwala ustalić szerokości marginesów na stronie, czyli odstępów tekstu od poszczególnych krawędzi
strony.
PoniewaŜ Internet Explorer wprowadza inne atrybuty niŜ Netscape/Mozilla/Firefox, najbezpieczniej jest określić
margines przy uŜyciu obu powyŜszych sposobów jednocześnie!
Atrybuty LEFTMARGIN, RIGHTMARGIN, TOPMARGIN, BOTTOMMARGIN, MARGINWIDTH i
MARGINHEIGHT nie wchodzą w skład specyfikacji HTML 4.01 - zaleca się stosowanie stylów.
Kolor suwaków
(tylko Internet Explorer 5.5 lub nowszy oraz Opera 7 przy niestandardowych ustawieniach!)
<html style="scrollbar-base-color: kolor">...</html>
gdzie "kolor" oznacza definicję koloru.
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 7
W niektórych przypadkach polecenie to moŜna wstawić do znacznika <body>...</body>.
Polecenie to pozwala zmienić kolor suwaków na stronie, na której się znajduje. Dzięki niemu moŜna dopasować
ich barwę do koloru tła strony. Aby dowiedzieć się więcej, zobacz: Suwaki.
UWAGA!
Interpretacja polecenia róŜni się w zaleŜności o zastosowanej deklaracji DTD (łącznie z zupełnym brakiem
interpretacji w pewnych warunkach) - więcej informacji w rozdziale Suwaki.
UWAGA!
Polecenie nie wchodzi w skład specyfikacji stylów CSS 2 i jest wyłącznie rozszerzeniem przeglądarki Internet
Explorer 5.5 lub nowszej (ale nie MSIE 5.0)!
Tytuł strony
<head>
<title> Tytuł strony </title>
</head>
KaŜdy dokument (X)HTML (podstrona serwisu) posiada własny tytuł. MoŜe on zawierać dowolny tekst, zaleca się
jednak, aby nie był zbyt długi (najwyŜej kilka wyrazów). Powinien on równieŜ odnosić się do treści zawartych na
danej stronie. Tytuł pojawia się na belce tytułowej przeglądarki internetowej (na samej górze okna programu), a
takŜe w wyszukiwarkach sieciowych, po odnalezieniu Twojej strony - dlatego właśnie nie moŜe on być zbyt długi.
Trafny tytuł moŜe równieŜ zachęcić internautów do obejrzenia Twojej strony.
Taki sam tytuł na wszystkich podstronach serwisu nie jest dobrym pomysłem, a tytuły w stylu "Strona główna"
czy "Bez tytułu" są juŜ bardzo nietrafne. Oczywiście w tytule wszystkich podstron moŜna umieścić ten sam
fragment z nazwą serwisu, ale oprócz tego kaŜdy dokument powinien zawierać dalszą część tytułu, opisującą jego
zawartość.
Tytuł strony jest znacznikiem obowiązkowym. Pominięcie go stanowi błąd!
Deklaracja strony kodowej
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso8859-2" />
.....
</head>
Polecenie jest deklaracją strony kodowej, czyli sposobu w jaki będą kodowane znaki na naszej stronie WWW.
Zamiast charset=iso-8859-2 moŜna wpisać: charset=windows-1250, ale jest to mocno odradzane,
poniewaŜ polecenie takie deklaruje inną stronę kodową, podczas gdy w całym niemal polskim Internecie przyjęto
standard kodowania iso-8859-2. Stronę kodową Windows obsługują tylko przeglądarki w systemie MS Windows jeśli uŜytkownik będzie posiadał inny system operacyjny, prawie na pewno spowoduje to pojawienie się u niego na
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 8
ekranie zupełnie nieprzewidzianych znaków! Czy chcesz, aby Twoja strona WWW wyglądała nieprofesjonalnie? Z
tego powodu nie jest polecane stosowanie innej strony kodowej jak ISO.
UWAGA!
Absolutnie nie naleŜy pomijać tego wpisu i powinna to być koniecznie deklaracja kodowania ISO a nie
WINDOWS, gdyŜ wtedy mogą wystąpić problemy z wyświetlaniem polskich znaków (nawet jeśli na Twoim
komputerze wszystko jest w porządku)! Wstawienie odpowiedniej deklaracji strony kodowej to nie wszystko!
Trzeba równieŜ stosować właściwy edytor (X)HTML - zobacz: Polskie znaki.
Jeśli Twoja strona WWW ma być napisana w innym języku niŜ polski, musisz zadeklarować odpowiednią inną
stronę kodową (pamiętaj równieŜ o podaniu właściwego skrótu nazwy języka).
Więcej na temat stron kodowych moŜesz dowiedzieć się w rozdziale pt.: Strony kodowe.
Opis zawartości strony
<head>
<meta name="Description" content="Tu podaj opis twojej strony" />
</head>
Polecenie to naleŜy wstawić między znacznikami: <head> oraz </head>. Pozwala ono opisać co znajduje się na
Twojej stronie. Z informacji tej korzystają wyszukiwarki sieciowe, dlatego staraj się tutaj wpisać tekst, który jak
najlepiej opisze zawartość strony i zachęci do jej odwiedzenia. Ciekawy, ale niezbyt długi, opis moŜe zachęcić
internautów do obejrzenia Twojej strony!
UWAGA!
W treści wszystkich atrybutów content="..." nie naleŜy uŜywać znaków cudzysłowu. Jeśli musimy to
zrobić, naleŜy zamiast nich wpisywać: &quot;
Wyrazy kluczowe
<head>
<meta name="Keywords" content="wyraz1, wyraz2, wyraz3..." />
</head>
gdzie "wyraz1, wyraz2, wyraz3..." oznaczają wyrazy, które naleŜy rozdzielać przecinkami. MoŜna oczywiście podać
więcej niŜ trzy wyrazy (w miejsce kropek).
Polecenie to naleŜy wstawić między znacznikami: <head> oraz </head>. Pozwala Ci ono podać wyrazy
kluczowe, z których korzystają wyszukiwarki sieciowe. Dlatego staraj się tutaj wpisać wyrazy, które jak najlepiej
opiszą zawartość Twojej strony. Dobrze dobrane wyrazy kluczowe, pomogą wyszukiwarkom odnaleźć Twoją
stronę!
Język strony
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 9
<head>
<meta http-equiv="Content-Language" content="język" />
</head>
gdzie jako "język" naleŜy podać skrót nazwy wybranego języka.
Polecenie to naleŜy wstawić między znacznikami: <head> oraz </head>. Pozwala ono podać, w jakim języku
jest napisana Twoja strona internetowa, np.: pl - polski, en - angielski, de - niemiecki, fr - francuski, it - włoski, es hiszpański, ru - rosyjski i inne [zobacz: Skróty nazw jezyków].
Nie naleŜy równieŜ zapominać o zadeklarowaniu odpowiedniej dla wybranego języka strony kodowej.
Autor strony
<head>
<meta name="Author" content="Tu wpisz swoje imię i nazwisko" />
</head>
Polecenie to naleŜy wstawić między znacznikami: <head> oraz </head>. Pozwala ono podać informację, kto
jest autorem strony.
Adres zwrotny
<head>
<meta http-equiv="Reply-To" content="twój adres e-mail" />
</head>
gdzie jako "Twój adres e-mail" naleŜy podać swój adres poczty elektronicznej (np.: "jan_kowalski@
jakas.domena.pl").
Pozwala podać zwrotny adres poczty elektronicznej e-mail, na który moŜna odpowiadać. Polecenie moŜe być
wstawione tylko w treści nagłówkowej dokumentu - między znacznikami: <head> oraz </head>.
Bezpośrednie podanie swojego adresu e-mail na stronie WWW moŜe poskutkować zalewem Twojej skrzynki
spamem, czyli niechcianą korespondencją reklamową.
Data utworzenia
<head>
<meta http-equiv="Creation-Date" content="data" />
</head>
gdzie jako "data" naleŜy wpisać datę utworzenia dokumentu w formacie GMT, np.:
"Tue, 20 Aug 1996 14:25:27 GMT".
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 10
Czas w formacie GMT jest określany dla Greenwich (południk "0"). W Polsce strefa czasowa jest przesunięta o
+1 godz. (czas zimowy) lub +2 godz. (czas letni). Dlatego w przypadku tworzenia daty GMT, naleŜy odjąć od czasu
lokalnego odpowiednio: 1 lub 2 godziny.
Komenda wprowadza informację o dacie utworzenia dokumentu, z której mogą korzystać np. sieciowe indeksery.
Polecenie moŜe być wstawione tylko w treści nagłówkowej dokumentu - między znacznikami: <head> oraz </
head>.
Ostatnia modyfikacja
<head>
<meta http-equiv="Last-Modified" content="data" />
</head>
gdzie jako "data" naleŜy wpisać datę, kiedy dokument był ostatni raz modyfikowany, np.:
"Tue, 20 Aug 1996 14:25:27 GMT" (zobacz: Data utworzenia).
Komenda wprowadza informację, kiedy dany dokument był ostatnio zmieniany. MoŜe to być sygnał dla
przeglądarki, Ŝe trzeba wczytać go ponownie. Polecenie moŜe być wstawione tylko w treści nagłówkowej
dokumentu - między znacznikami: <head> oraz </head>.
Utrata waŜności
<head>
<meta http-equiv="Expires" content="data" />
</head>
gdzie jako "data" naleŜy wpisać datę, kiedy dokument traci waŜność, np.:
"Tue, 20 Aug 1996 14:25:27 GMT" (zobacz: Data utworzenia).
Komenda wprowadza informację, kiedy dany dokument traci waŜność. MoŜe to być sygnał dla przeglądarki, Ŝe
trzeba wczytać go ponownie. Polecenie moŜe być wstawione tylko w treści nagłówkowej dokumentu - między
znacznikami: <head> oraz </head>.
Automatyczne odświeŜanie strony
<head>
<meta http-equiv="Refresh" content="s " />
</head>
gdzie jako "s" naleŜy podać liczbę, określającą co jaki przedział czasu (w sekundach) będzie odświeŜana strona,
czyli ponownie wczytywana.
Polecenie to pozwala na automatyczne odświeŜanie strony, co pewien określony przedział czasu (podany w
sekundach). Powinno być wstawione w treści nagłówkowej dokumentu - między znacznikami: <head> oraz </
head>.
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 11
Nie naleŜy przesadzać z odświeŜaniem strony, poniewaŜ irytuje to uŜytkowników, a nawet moŜe uniemoŜliwić
czytanie!
Automatyczne wczytanie strony
<head>
<meta http-equiv="Refresh" content="s ; url=Tu podaj adres strony
lub ścieŜkę dostępu" />
</head>
s
Czas, po którym zostanie załadowana podana strona (w sekundach)
Tu podaj adres strony lub ścieŜkę dostępu
Adres lub ścieŜkę dostępu do strony, która ma być wczytana
Polecenie to pozwala na automatyczne wczytanie podanej strony. Załadowanie nastąpi po określonym przez nas
czasie (podanym w sekundach). Powinno być wstawione w treści nagłówkowej dokumentu.
Polecenie to jest często stosowane, w razie przeniesienia serwisu pod inny adres, w celu automatycznego
przekierowania tam uŜytkownika.
Przejście między stronami
(tylko Internet Explorer 4.01 lub nowszy!)
1. Przejście płynne
<head>
<meta http-equiv="sposób" content="blendTrans(Duration=s )" />
</head>
2. Filtr graficzny
<head>
<meta http-equiv="sposób" content="revealTrans
(Duration= s,Transition=n )" />
</head>
sposób
"Page-Enter" - graficzne przejście nastąpi przy wchodzeniu na stronę
"Page-Exit" - przejście nastąpi przy wyjściu
"Site-Enter" - przejście przy wejściu z innej domeny (adresu)
"Site-Exit" - przejście przy wyjściu do innej domeny
s
czas trwania przejścia (w sekundach)
n
numer filtru graficznego (liczba od 0 do 23):
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 12
0 - Zmniejszający się prostokąt (Box in)
1 - Zwiększający się prostokąt (Box out)
2 - Zmniejszające się koło (Circle in)
3 - Zwiększające się koło (Circle out)
4 - "Wytarcie" w górę (Wipe up)
5 - "Wytarcie" w dół (Wipe down)
6 - "Wytarcie" w prawo (Wipe right)
7 - "Wytarcie" w lewo (Wipe left)
8 - Pionowa zasłona (Vertical blinds)
9 - Pozioma zasłona (Horizontal blinds)
10 - Szachownica w prawo (Checkerboard across)
11 - Szachownica w dół (Checkerboard down)
12 - Losowy rozkład (Random dissolve)
13 - Połączenie w pionie (Split vertical in)
14 - Rozłączenie w pionie (Split vertical out)
15 - Połączenie w poziomie (Split horizontal in)
16 - Rozłączenie w poziomie (Split horizontal out)
17 - "Wytarcie" w lewy-dolny róg (Strips left down)
18 - "Wytarcie" w lewy-górny róg (Strips left up)
19 - "Wytarcie" w prawy-dolny róg (Strips right down)
20 - "Wytarcie" w prawy-górny róg (Strips right up)
21 - Losowe poziome smugi (Random bars horizontal)
22 - Losowe pionowe smugi (Random bars vertical)
23 - Efekt losowy - jeden z powyŜszych (Random)
Polecenie to pozwala na efektowne graficznie przejście między dwiema stronami. Pierwszy sposób (blendTrans)
powoduje płynne przejście. W drugim przypadku (revealTrans) moŜna wybrać odpowiedni rodzaj filtru
graficznego: od 0 do 23 (dla Transition=23 będzie to efekt wybrany losowo).
Jeśli zastosujemy "Page-Enter", nastąpi graficzne przejście do strony, na której znajduje się powyŜsze polecenie
(po jej wczytaniu). Natomiast po wpisaniu "Page-Exit", przejście będzie przy wyjściu z danej strony (kiedy
klikniemy dowolny odsyłacz prowadzący na inną stronę). RóŜnica pomiędzy "Page-Enter/Exit" a "Site-Enter/
Exit" jest taka, Ŝe w drugim przypadku przejście nastąpi tylko podczas wejścia/wyjścia z/do innej domeny
internetowej, czyli innej niŜ nasza strony WWW.
UWAGA!
W Internet Explorerze 6, aby polecenie ("Page-Enter") było realizowane, musi znajdować się bezwzględnie
bezpośrednio po znaczniku <head> (jako pierwsze)! Wpisanie go po jakimkolwiek innym znaczniku, np.
deklaracji strony kodowej, spowoduje, Ŝe nie będzie ono interpretowane.
Edytor
1. Generator
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 13
<head>
<meta name="Generator" content="nazwa edytora" />
</head>
2. Narzędzie autorskie
<head>
<meta name="Authoring_tool" content="nazwa edytora" />
</head>
gdzie jako "nazwa edytora" moŜna wpisać nazwę programu, przy uŜyciu którego została stworzona strona.
Pozwala określić nazwę edytora (X)HTML, który został wykorzystany do utworzenia dokumentu.
Roboty
<head>
<meta name="Robots" content="dyrektywy" />
</head>
gdzie jako "dyrektywy" naleŜy wpisać:
"index" - strona, na której wstawiono polecenie, będzie indeksowana przez roboty sieciowe (indeksery) domyślnie
"noindex" - strona, na której wstawiono polecenie, nie będzie indeksowana
"follow" - przechodzenie do stron, do których odnoszą się odsyłacze, znajdujące się w dokumencie domyślnie
"nofollow" - robot nie przechodzi do stron stron wskazywanych przez odsyłacze wstawione na stronie, ale
moŜe je zaindeksować, jeŜeli istnieją inne linki umieszczone na stronach bez tego zakazu
"index, nofollow" - indeksuje stronę, nie przechodzi do stron wskazywanych przez odsyłacze
"noindex, follow" - nie indeksuje strony, na której wstawiono polecenie, przechodzi do stron
wskazywanych przez odsyłacze
"all" = "index, follow" - indeksuje wszystko (domyślnie)
"none" = "noindex, nofollow" - nie indeksuje nic
Polecenie określa sposób zachowania się robotów-indekserów, czyli specjalnych programów zbierających
informacje o stronach w Internecie, wykorzystywane później przez wyszukiwarki. Stosuj noindex tylko wtedy,
gdy nie chcesz, aby Twoja strona była odnaleziona przez wyszukiwarki (bo np. treści na niej zawarte są ściśle
tajne :-). Niestety całkowitej pewności nie będzie nigdy, poniewaŜ nie wszystkie roboty interpretują to polecenie.
Pamiętaj, Ŝe domyślnym zachowaniem robotów wyszukiwarek sieciowych jest indeksowanie wszystkich
dokumentów. To oznacza, Ŝe dyrektywa "index, follow" moŜe być pominięta, a zamiast wpisywać
"noindex, follow" czy "index, nofollow" zwykle wystarczy wpisać odpowiednio: "noindex" i
"nofollow". W przypadku zupełnego braku znacznika <meta name="Robots" content="..." />
robot zaindeksuje wszystkie strony serwisu, dlatego dodaje się go zwykle tylko, kiedy chcemy zablokować dostęp
robotowi do wybranych stron.
Zwróć uwagę, Ŝe wartość "nofollow" blokuje jedynie podąŜanie za odnośnikami, a to oznacza, Ŝe moŜe nie
zapobiec indeksowaniu stron, do których prowadzą linki umieszczone w dokumencie. JeŜeli na innych stronach -
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 14
moŜliwe, Ŝe w zupełnie innym serwisie - znajdą się linki do tych stron, zostaną one normalnie zaindeksowane. Aby
temu zapobiec, naleŜy wstawić dyrektywę "noindex" na stronach, które nie powinny być zaindeksowane.
Specyfikacja HTML 4.01 wskazuje tylko następujące wartości tego elementu: all, index, nofollow,
noindex. Choć inne specyfikacje jasno wskazują na dodatkowe wartości, to jeśli chcesz mieć największą
pewność, Ŝe dyrektywy zostaną uwzględnione, zamiast "none" moŜesz uŜyć "noindex, nofollow".
Niestandardowe dyrektywy robotów
Roboty mogą interpretować dodatkowe, niestandardowe dyrektywy (wszystkie poniŜsze są rozpoznawane przez
robota wyszukiwarki Google):
"noarchive" - blokada archiwizowania kopii strony w pamięci podręcznej wyszukiwarki
"nosnippet" - blokada wyświetlania opisu strony w wynikach wyszukiwania
"noodp" - opis strony nie zostanie pobrany z katalogu Open Directory Project
Dyrektywa "noarchive" blokuje archiwizowanie dokumentu. Wyszukiwarki sieciowe często zapisują kopię
indeksowanych stron w swojej pamięci podręcznej. UŜytkownicy korzystający z wyszukiwarki mogą otworzyć taką
kopię strony np. kiedy oryginalna witryna jest chwilowo niedostępna. Aby otworzyć stronę z pamięci podręcznej
wyszukiwarki Google, naleŜy na liście wyników wyszukiwania kliknąć link "Kopia".
Aby połączyć dyrektywy standardowe z niestandardowymi, nie naleŜy wpisywać kilku osobnych znaczników
<meta name="Robots" />, ale podać pełną listę po przecinku, np.:
<meta name="Robots" content="nofollow, noarchive" />
Googlebot
Wyszukiwarka Google wprowadziła specjalny znacznik, który pozwala wydać dyrektywy tylko dla robota
Googlebot. Na przykład aby zablokować robotowi Google dostęp do strony, ale jednocześnie pozwolić na to
robotom innych wyszukiwarek, moŜna wpisać:
<meta name="Googlebot" content="noindex, nofollow" />
Blokada indeksowania wybranych odsyłaczy
Element <meta name="Robots" content="nofollow" /> powoduje, Ŝe roboty sieciowe nie będą
podąŜać za Ŝadnymi linkami umieszczonymi w dokumencie. Czasami jednak chcielibyśmy zablokować
uwzględnianie tylko wybranych odsyłaczy. Taka sytuacja najczęściej ma miejsce, kiedy wstawiamy na swojej
stronie system komentarzy. Spammerzy lub spamboty (automaty spamujące) często wpisują komentarze bez Ŝadnej
konkretnej treści, ale za to przeładowane linkami do stron, które chcą zareklamować. Aby uczynić takie linki
nieistotnymi dla robota wyszukiwarki Google, naleŜy dopisać do wszystkich odsyłaczy np. z komentarzy
dodatkowy atrybut:
<a href="http://adres strony" rel="nofollow">...</a>
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 15
Takie linki zostaną zignorowane przez robota wyszukiwarki Google, zatem być moŜe zniechęci to spammera do
umieszczania ich na naszej stronie, a nawet jeśli nie, to przynajmniej nie damy mu satysfakcji i nie przyczynimy się
do nieuczciwego wypromowania kolejnej bezuŜytecznej strony :-)
Plik robots.txt
Znacznik <meta name="Robots" /> jest przydatny w celu określania dostępu przez roboty do pojedynczych
dokumentów HTML. Okazuje się jednak mało praktyczny, jeśli chcielibyśmy zablokować dostęp np. do wszystkich
dokumentów z określonego katalogu serwisu albo wręcz hurtowo do wszystkich plików witryny. Znacznik ten
okazuje się wręcz zupełnie nieprzydatny, jeśli zaleŜy nam na zablokowaniu indeksowania np. zdjęć z naszego
serwisu (większość wyszukiwarek posiada osobne formularze do wyszukiwania plików graficznych).
Istnieje jednak moŜliwość określenia globalnego dostępu do wszystkich plików serwisu - nosi on nazwę: Standard
Wykluczania Robotów (ang. A Standard for Robot Exclusion - Robots Exclusion Protocol). W głównym katalogu
konta WWW - czyli tam, gdzie znajduje się dokument strony głównej serwisu (index.html) - naleŜy umieścić
specjalny plik pod nazwą robots.txt. W pliku tym umieszcza się tzw. rekordy - kaŜdy zawiera grupę linijek w
postaci:
Pole: wartość
Wielkość liter w nazwach pól nie ma znaczenia, natomiast zwykle ma znaczenie w wartościach pola. Oprócz
typowych linijek moŜliwe jest równieŜ umieszczanie komentarzy, czyli tekstu, który nie zostanie wzięty pod uwagę
przez roboty. Komentarz rozpoczyna się znakiem "#", a kończy na końcu linijki.
User-Agent
W jednym pliku robots.txt moŜe się znajdować dowolna liczba rekordów rozdzielonych pustymi linijkami kaŜdy musi się rozpoczynać linią User-Agent, wskazującą do których robotów odnoszą się dalsze linijki danego
rekordu:
# Ten rekord odnosi się tylko do robota "Googlebot":
User-agent: Googlebot
Pojedynczy rekord moŜe zawierać więcej niŜ jedną linię User-Agent:
# Ten rekord odnosi się tylko do robotów "Googlebot" i "MSNBot":
User-agent: Googlebot
User-agent: MSNBot
Specyfikacja HTML 4.01 wyraźnie zabrania umieszczania kilku linii User-Agent jednej pod drugą, jednak
standard (nieopracowany przez W3C) mówi na ten temat zupełnie co innego. Googlebot interpretuje wielokrotne
linijki tego typu.
Wielkość liter w nazwach robotów nie ma znaczenia. Lista istniejących robotów wyszukiwarek sieciowych
znajduje się na stronach:
The Web Robots Database - wersja angielska
Spiders.pl - wersja polska
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 16
Zamiast nazwy robota moŜna wpisać równieŜ znak gwiazdki ("*"), co wskazuje kaŜdego istniejącego robota.
Kiedy robot danej wyszukiwarki odwiedza witrynę, najpierw sprawdza czy istnieje plik robots.txt. Jeśli tak,
szuka w nim rekordu (grupy linii), który pasuje do jego nazwy. Jeśli taki znajdzie, odczytuje linie z wybranego
rekordu i pomija wszystkie inne. JeŜeli nie znajdzie, szuka rekordu z linią User-Agent: *. JeŜeli takiego nie
znajdzie, indeksuje bez ograniczeń wszystkie dokumenty serwisu. Zwracam uwagę, Ŝe jeśli robot znajdzie
przeznaczony specjalnie dla niego rekord, to w ogóle nie zajmuje się rekordem User-Agent: *.
Disallow
W rekordach poniŜej User-Agent musi się znajdować jedna lub więcej linii Disallow, wskazujących ścieŜki
do plików, do których robot nie ma dostępu. KaŜda ścieŜka musi rozpoczynać się od znaku ukośnika ("/") i
powstaje poprzez wycięcie pierwszego członu adresu URL. Na przykład aby zablokować dostęp do pliku http:/
/www.example.org/index.html, naleŜy wpisać:
User-Agent: *
Disallow: /index.html
Pusta wartość Disallow oznacza brak ograniczeń w indeksowaniu dokumentów:
User-Agent: *
# Wszystkie dokumenty serwisu będą normalnie indeksowane:
Disallow:
Aby zablokować dostęp do wszystkich plików z jakiegoś katalogu i ewentualnie wszystkich jego podkatalogów,
wystarczy wpisać samą nazwę tego katalogu, która koniecznie musi kończyć się znakiem ukośnika ("/"):
User-Agent: *
# śaden plik z katalogu "prywatne" nie zostanie zaindeksowany:
Disallow: /prywatne/
Aby zablokować dostęp do wszystkich plików całego serwisu, jako ścieŜkę naleŜy podać sam ukośnik:
# Ten serwis w ogóle nie będzie indeksowany przez roboty:
User-Agent: *
Disallow: /
Allow
Standard Wykluczania Robotów został rozszerzony o dodatkową dyrektywę - Allow, której działanie jest
przeciwne do Disallow, czyli wskazuje ścieŜki, które robot moŜe indeksować:
# Tylko strona główna tego serwisu zostanie zaindeksowana:
User-Agent: *
Disallow: /
Allow: /index.html
Dyrektywa Allow moŜe nie być interpretowana przez niektóre roboty wyszukiwarek (jest rozpoznawana przez
robota Google)
Wzorce dopasowania
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 17
Co zrobić, jeśli chcemy zablokować indeksowanie wszystkich zdjęć serwisu, ale jednocześnie zezwolić na
indeksowanie samych dokumentów HTML? Najlepiej byłoby umieścić wszystkie zdjęcia w osobnym katalogu:
User-Agent: *
Disallow: /zdjecia/
Czasem jednak jest to niemoŜliwe. W takim przypadku pomocne są tzn. wzorce dopasowania, czyli znaki
specjalne, które pozwalają dopasować ścieŜki na podstawie ogólnych warunków. Googlebot rozpoznaje
następujące znaki specjalne w ścieŜkach dyrektyw Disallow oraz Allow:
* - Zastępuję dowolny ciąg znaków (równieŜ pusty)
$ - JeŜeli zostanie postawiony na końcu ścieŜki, oznacza dopasowanie do końca nazwy, dzięki temu nadaje
się szczególnie do określania ścieŜek do plików określonego typu, czyli o wybranym rozszerzeniu nazwy
User-Agent: Googlebot
# Nie indeksuj plików graficznych:
Disallow: /*.jpg$
Disallow: /*.jpeg$
Disallow: /*.gif$
Disallow: /*.png$
# Nie indeksuj dokumentów z identyfikatorami sesji:
Allow: /*?$
Disallow: /*?
RóŜnica pomiędzy /*.gif$ a /*.gif jest taka, Ŝe w drugim przypadku zablokowane zostaną równieŜ pliki: /
nazwa.gift, /nazwa.gif/nazwa.html, co raczej nie było naszym zamiarem.
Wzorce dopasowania są rozszerzeniem standardu i mogą być nieobsługiwane przez wiele robotów sieciowych (są
interpretowane przez robota Google), dlatego zaleca się nie umieszczać ich w rekordzie User-Agent: *.
Cache
<head>
<meta http-equiv="Expires" content="0" />
<meta http-equiv="Cache-Control" content="no-store, no-cache, mustrevalidate" />
<meta http-equiv="Cache-Control" content="post-check=0, precheck=0" />
<meta http-equiv="Pragma" content="no-cache" />
</head>
Polecenia wstawione w treści nagłówkowej dokumentu w większości przypadków teoretycznie zabezpieczają
stronę przed przechowywaniem w tzw. cache-u przeglądarki, czyli pamięci podręcznej. Cache-owanie polega na
zapisywaniu dokumentów HTML, obrazków i innych elementów strony na dysku lokalnym uŜytkownika podczas
pierwszej wizyty. Normalnie, jeśli odwiedzimy taką stronę ponownie, wczyta się duŜo szybciej, poniewaŜ dane
zostaną pobrane z dysku twardego, a nie z Internetu. Lecz w pewnych przypadkach moŜemy chcieć, aby treść
dokumentu nie była w ten sposób przechowywana, lecz za kaŜdym razem wczytywana bezpośrednio z Internetu
(np. jeśli strona jest często aktualizowana lub nie chcemy by była zapisywana na dysku uŜytkownika). Wtedy
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 18
przydatne okazują się te właśnie polecenia. Niestety przegladarki często po prostu ignorują powyŜsze polecenia, a
więc całkowitej pewności nie będzie raczej nigdy :-(
Wiele osób próbuje stosować tą metodę, aby nie dopuścić do zapisania na dysku uŜytkownika kodu źródłowego lub
obrazków ze swojej strony. Często wykorzystuje się to w połączeniu z dodatkowymi metodami
ochrony stron WWW.
Ikona strony
(Internet Explorer, Netscape 7/Mozilla/Firefox, Opera 7)
<head>
<link rel="Shortcut icon" href="adres ikony" />
</head>
gdzie jako "adres ikony" naleŜy podać URL, pod którym znajduje się ikona, np.: http://
www.mojastrona.pl/favicon.ico
Polecenie to pozwala dodać ikonkę (favicon.ico), która będzie widoczna w przeglądarce przy adresie naszej
strony. Typowy rozmiar ikony to 16x16 pikseli. W systemie Windows jest dodatkowa moŜliwość umieszczenia
skrótu na pulpicie - wtedy przydatna moŜe być ikona o rozmiarach 32x32. Format *.ico pozwala zapisać dwie
wersje rozmiaru w jednym pliku. Niektóre przeglądarki - nie MSIE 6 - pozwalając równieŜ uŜywać innych
formatów graficznych, takich jak np. PNG.
Ikona strony moŜe się wyświetlić automatycznie, nawet bez potrzeby wstawiania powyŜszego znacznika, jeśli
będzie nosiła nazwę favicon.ico i zostanie zapisana w głównym katalogu na serwerze WWW, czyli np.
http://www.example.com/favicon.ico (Internet Explorer, Firefox, Opera).
Niestety niektóre przeglądarki pobierają ikonę strony tylko raz, a później rzadko jest ona odświeŜana (albo nawet
wcale). Więc jeśli kiedyś wprowadzimy nową, moŜe to nie dać Ŝadnego efektu, bo np. Internet Explorer zapisuje
ikonę przy dodawaniu strony do ulubionych. Dlatego zanim wprowadzimy taki dodatek, warto go wcześniej dobrze
dopracować.
W Internet Explorerze aby ikona była widoczna, trzeba dodać stronę do ulubionych. Aby odświeŜyć ikonę, naleŜy
usunąć stronę z ulubionych, a następnie dodać ją tam ponownie (ikona będzie widoczna po ponownym
otworzeniu przeglądarki).
Nawigacja
(Mozilla i Opera 7, ale nie Internet Explorer 7 ani Netscape 7)
Nowoczesne przeglądarki pozwalają określić bezpośrednio z poziomu strony WWW dodatkowe punkty
nawigacyjne w serwisie. Są one wyświetlane na specjalnym pasku narzędzi (najczęściej Nawigacja) w postaci
linków do wskazanych stron.
1. Strona główna
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 19
<head>
<link rel="Start" href="adres" />
</head>
lub
<head>
<link rel="Top" href="adres" />
</head>
2. Do góry
<head>
<link rel="Up" href="adres" />
</head>
3. Pierwsza
<head>
<link rel="First" href="adres" />
</head>
4. Poprzednia
<head>
<link rel="Prev" href="adres" />
</head>
lub
<head>
<link rel="Previous" href="adres" />
</head>
5. Następna
<head>
<link rel="Next" href="adres" />
</head>
6. Ostatnia
<head>
<link rel="Last" href="adres">
</head>
7. Zawartość
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 20
<head>
<link rel="Contents" href="adres" />
</head>
lub
<head>
<link rel="Toc" href="adres" />
</head>
8. Rozdział (Mozilla)
<head>
<link rel="Chapter" title="Tytuł" href="adres" />
</head>
9. Dział (Mozilla)
<head>
<link rel="Section" title="Tytuł" href="adres" />
</head>
10. Poddział (Mozilla)
<head>
<link rel="Subsection" title="Tytuł" href="adres" />
</head>
11. Dodatek (Mozilla)
<head>
<link rel="Appendix" title="Tytuł" href="adres" />
</head>
12. Słowniczek
<head>
<link rel="Glossary" href="adres" />
</head>
13. Indeks
<head>
<link rel="Index" href="adres" />
</head>
14. Pomoc
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 21
<head>
<link rel="Help" href="adres" />
</head>
15. Szukaj
<head>
<link rel="Search" href="adres" />
</head>
16. Autor
<head>
<link rel="Author" href="adres" />
</head>
17. Prawa autorskie
<head>
<link rel="Copyright" href="adres" />
</head>
18. Zakładka (Mozilla)
<head>
<link rel="Bookmark" title="Tytuł" href="adres" />
</head>
19. Inne wersje (Mozilla)
<head>
<link rel="Alternate" title="Tytuł" href="adres" />
</head>
lub
<head>
<link rel="Alternate" title="Tytuł" lang="język" href="adres" />
</head>
lub
<head>
<link rel="Alternate" title="Tytuł" media="media" href="adres" /
>
</head>
20. Własne (Mozilla)
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22
Kurs HTML - HTML - BODY i META
Strona 22
<head>
<link rel="Nazwa" title="Tytuł" href="adres" />
</head>
We wszystkich przypadkach odpowiednie wpisy oznaczają:
adres
Lokalizacja punktu nawigacyjnego
Tytuł
Tytuł który pojawi się na pasku nawigacji
język
Język alternatywny
media
Typ(y) mediów alternatywnych
Nazwa
Nazwa własnego punktu nawigacyjnego
Quiz
Sprawdź swoją wiedzę, nabytą w tym rozdziale, rozwiązując testowy QUIZ.
http://www.kurshtml.boo.pl/html/body.print.html
2008-02-07 18:41:22