Strona g│≤wna - HTML dla bardzo pocz▒tkuj▒cych - Etykieta webmastera - Struktura dokumentu - Czcionki - Bloki - Odsy│acze - Wykazy - Grafika i multimedia - Tabele - Style - Ramki - P│ywaj▒ce ramki - Formularze - Response-O-Matic - TopNet Mailer - Liczniki wizyt - KsiΩga go╢ci - Kana│y informacyjne - NarzΩdzia - S│owniczek - Znaki specjalne - Ankieta



Istota odsy│aczy | Etykieta | Odsy│acze



Odsy│acze


[hand]Istota odsy│aczy

Odsy│acze (hiper│▒cza, │▒cza hipertekstowe, odno╢niki) s▒ chyba najbardziej charakterystycznym elementem dokument≤w w ╢wiatowej sieci World Wide Web. Bez odsy│aczy nie istnia│yby powi▒zania miΩdzy dokumentami na tym samym serwerze, w tym samym mie╢cie, kraju czy kontynencie.DziΩki odsy│aczom mo┐na wi▒zaµ ze sob▒ poszczeg≤lne strony, a doskona│ym przyk│adem ich roli jest choµby niniejszy kurs, kt≤ry zosta│ opracowany na wielu, powi▒zanych ze sob▒ stronach. Gdyby nie by│o odsy│aczy, ca│a tre╢µ kursu musia│aby zostaµ przedstawiona na jednej stronie, kt≤ra by│aby do╢µ uci▒┐liwa w czytaniu.

Odsy│acz jest niczym innym, jak wskazaniem jakiego╢ innego miejsca. KlikniΩcie na takim wskazaniu przenosi u┐ytkownika do docelowego miejsca, przy czym mo┐e to byµ z powodzeniem miejsce na tej samej stronie, inna strona w ramach tego samego, z│o┐onego dokumentu, a nawet strona na drugim ko±cu ╢wiata. U┐ytkownik nie musi nawet w gruncie rzeczy wiedzieµ, ┐e powi▒zane ze sob▒ tematycznie informacje znajduj▒ siΩ w miejscach oddalonych od siebie nawet o tysi▒ce kilometr≤w. Najwa┐niejsze jest ich tematyczne powi▒zanie, a nie lokalizacja. Gdy na przyk│ad czytamy stronΩ zawieraj▒c▒ opis jakiej╢ choroby, mo┐emy siΩgn▒µ do ca│kiem innego miejsca w poszukiwaniu jej etiologii, a do jeszcze innego, gdy bΩdziemy chcieli przeczytaµ o jej ogniskach.

Hipertekstowe odsy│acze w World Wide Web mo┐na por≤wnaµ ze spisem tre╢ci czy odsy│aczami w ksi▒┐ce. Informacja, ┐e na stronie 154 znajduje siΩ rozdzia│ pod jakim╢ tytu│em, a na stronie 87 tabela, na kt≤r▒ powo│ujemy siΩ w jakim╢ miejscu ksi▒┐ki, jest de facto odsy│aczem, choµ czytelnik musi wykonaµ "skok" samodzielnie, wertuj▒c po prostu kartki. Elektroniczne odsy│acze s▒ znacznie wygodniejsze w obs│udze, a do╢µ znanym przyk│adem zastosowania jest edytor WordPerfect czy programy do tworzenia elektronicznych publikacji - Adobe Acrobat czy Novell Envoy. Odsy│acz mo┐na te┐ potraktowaµ jako swoist▒ dygresjΩ. Warto jednak zwr≤ciµ uwagΩ, ┐e zbyt du┐a liczba odsy│aczy, zw│aszcza w tek╢cie o charakterze na po│y "beletrystycznym", mo┐e rozpraszaµ czytelnika, chyba ┐e strona zawiera po prostu z za│o┐enia odsy│acze do jakich╢ ╝r≤de│. Warto je jednak stosowaµ z umiarem.


[hand]Etykieta

Mo┐na wyr≤┐niµ dwa rodzaje konstrukcji odsy│aczowych: do etykiet i do stron.

Etykieta (zwana te┐ zak│adk▒ lub kotwic▒ - ang. anchor) jest znakiem, swoist▒ elektroniczn▒ zak│adk▒, podobn▒ do zak│adek w ksi▒┐ce, kt≤ra zaznacza jakie╢ miejsce w tek╢cie. Gdy utworzymy etykietΩ, bΩdziemy mogli siΩ odwo│ywaµ nie tylko do zawieraj▒cej j▒ strony, ale i do konkretnego miejsca na stronie. W ten spos≤b czytelnik bΩdzie m≤g│ natychmiast skoczyµ do wskazanego punktu. Jej konstrukcja jest nastΩpuj▒ca:

<A NAME="nazwa_etykiety"> </A>

Zauwa┐my, ┐e w taki w│a╢nie spos≤b zosta│y utworzone etykiety na stronach kursu. Umo┐liwi│o to zbudowanie czego╢ w rodzaju spis≤w tre╢ci na poszczeg≤lnych stronach, kt≤re pozwalaj▒ szybko skoczyµ do opisu wybranego zagadnienia.

Mo┐emy utworzyµ w dokumencie dowoln▒ liczbΩ etykiet, kt≤re bΩd▒ s│u┐yµ jako punkty docelowe dla r≤┐nych odsy│aczy. Jest to szczeg≤lnie wygodne w przypadku du┐ych objΩto╢ciowo stron, wymagaj▒cych podzielenia na pewne logiczne fragmenty, aby by│y │atwiejsze w czytaniu. Spis zagadnie± z wykorzystaniem odsy│aczy do etykiet-zak│adek jest bardzo czΩsto stosowany w Internecie.

Dobrym obyczajem jest stosowanie cudzys│owu obejmuj▒cego etykiety, podobnie jak i adres≤w w odsy│aczach. Gdy etykieta zawiera kilka wyraz≤w, ich u┐ycie jest wrΩcz konieczne, aby definicja by│a poprawna. Nale┐y te┐ zwracaµ uwagΩ na wielko╢µ liter, gdy┐ s▒ one na og≤│ rozr≤┐niane. Mo┐na zalecaµ u┐ywanie ma│ych liter zar≤wno w etykietach, jak i odsy│aczach do nich.

Uwaga: wielowyrazowe zak│adki, nawet ujΩte w cudzys│owy, s▒ ignorowane przez niekt≤re przegl▒darki, np. Lynx. Mo┐na temu zaradziµ, │▒cz▒c wyrazy, np. "to_jest_zak│adka_dla_pewnego_tematu".


[hand]Odsy│acze

[zielona kropka] Odsy│aczem jest konstrukcja, kt≤ra wskazuje pewne miejsce w Internecie i pozwala skoczyµ do niego za pomoc▒ klikniΩcia na niej myszk▒. Jej konstrukcjΩ mo┐na obrazowo przedstawiµ w postaci:

<A HREF="miejsce_docelowe">Tekst, na kt≤rym nale┐y klikn▒µ</A>

Gdy utworzymy odsy│acz, ci▒g znak≤w "tekst, na kt≤rym nale┐y klikn▒µ" bΩdzie zaznaczony innym kolorem, zazwyczaj niebieskim, i podkre╢lony. Na przyk│ad odsy│acz do elektronicznego magazynu online, po╢wiΩconego WordPerfectowi, mo┐e mieµ postaµ:

Tutaj znajdziesz WordPerfect Magazine

Gdy przesuniesz kursor myszki nad odsy│acz, kursor przyjmie postaµ r▒czki, natomiast w wierszu statusu przegl▒darki powinna siΩ pojawiµ informacja http://www.wpmag.com. KlikniΩcie spowoduje natychmiastowy skok do wskazanego miejsca ("natychmiastowo╢µ" jest pojΩciem wzglΩdnym - niekiedy trwa to koszmarnie d│ugo!).

Do jakich miejsc mo┐emy siΩ odwo│ywaµ?

[zielona kropka] Oczywi╢cie najczΩ╢ciej stosujemy odsy│acze do stron WWW, kt≤rych charakterystycznym elementem jest ci▒g http://. Konstrukcja mo┐e wiΩc mieµ postaµ:

<A HREF="http://host.domena>Tekst</A>.

W pokazanym wy┐ej przyk│adzie WordPerfect Magazine pos│u┐yli╢my siΩ adresem http://www.wpmag.com, gdzie host=www, a domena=wpmag.com. Konieczne jest oczywi╢cie u┐ycie w adresie na pocz▒tku http://.

Zauwa┐my od razu, ┐e taki adres powoduje wywo│anie g│≤wnej (domy╢lnej) strony WWW. Nazwy strony nie podawali╢my. Dlatego zaleca siΩ, aby strona g│≤wna serwisu by│a plikiem o nazwie index.htm lub index.html.

Gdy zamieszczamy w naszym dokumencie jaki╢ odsy│acz do strony znajduj▒cej siΩ gdzie╢ w ╢wiecie, nale┐y po prostu przepisaµ ten adres w trakcie sesji w Internecie. CzΩsto jednak bΩdziemy siΩ odwo│ywali do stron samodzielnie sporz▒dzonych i wtedy wystarczy po prostu podawaµ ich nazwy, bez konieczno╢ci definiowania adresu http. Najwygodniej jest w≤wczas oczywi╢cie ulokowaµ wszystkie strony i niezbΩdne pliki graficzne, kt≤rymi upstrzyli╢my nasz dokument, w jednym katalogu. Znacznie upro╢ci to ┐ycie w trakcie konstruowania dokumentu. Je╢li jednak prowadzimy wiΩkszy serwis, lepiej jest utworzyµ w naszym komputerze i na serwerze odrΩbne katalogi tematyczne, a dla grafiki wyznaczyµ nawet osobny folder, dziΩki czemu bΩdziemy siΩ mogli do nich wygodnie odwo│ywaµ, je╢li zajdzie taka potrzeba.

Praktyczna uwaga: gdy chcemy wstawiµ do dokumentu jaki╢ adres, kt≤ry znale╝li╢my w Internecie, nie jest konieczne rΩczne przepisywanie adresu. Mo┐na post▒piµ w nastΩpuj▒cy spos≤b:

[zielona kropka] W dokumencie mo┐emy zamieszczaµ odsy│acze do r≤┐nych typ≤w plik≤w. NajczΩ╢ciej jest to dokument HTML, choµ r≤wnie dobrze mo┐e to byµ plik tekstowy (TXT), obrazek GIF lub JPG, plik d╝wiΩkowy WAV, MID, AU czu AIFF, dokument Worda, plik Acrobata lub Envoya. Przegl▒darki s▒ uwra┐liwione na pewne typy plik≤w, zawieraj▒c wbudowane wewnΩtrzne przegl▒darki (odtwarzacze) danych plik≤w. Na przyk│ad w Navigatorze i Internet Explorerze zostanie bez k│opotu zaprezentowany obrazek GIF czy plik tekstowy. Poniewa┐ jednak coraz czΩ╢ciej w dokumentach internetowych s▒ umieszczane odsy│acze do innych plik≤w, konieczne siΩ sta│o zaanga┐owanie do ich obs│ugi albo zewnΩtrznych aplikacji, albo specjalnych wtyczek (plug-ins), kt≤re pozwalaj▒ obejrzeµ dany dokument bezpo╢rednio z poziomu przegl▒darki, z u┐yciem pojawiaj▒cego siΩ dodatkowego menu (na ekranie lub pod prawym klawiszem myszki). Doczekali╢my siΩ ju┐ wielu "wtyczek" - VR, VRML, EVY, PDF, CMX itd. S▒ one bezp│atnie dostΩpne w Internecie, a ich przegl▒d mo┐na znale╝µ m.in. na internetowej stronie Netscape Communications albo Windows95.com Web Browser Plug-ins

Warto te┐ zagl▒daµ na strony:
The Ultimate Collection of Winsock Software
The SlaughterHouse

Je╢li przegl▒darka nie zawiera wbudowanej obs│ugi pliku danego typu ani nie istnieje stosowny plug-in, mo┐emy siΩ tak┐e pos│u┐yµ aplikacj▒ w naszym komputerze. Na przyk│ad plik Worda mo┐na obejrzeµ za pomoc▒ Worda lub Word Viewera, a nowsze wersje Internet Explorera potrafi▒ bezpo╢rednio wczytaµ plik Worda, je╢li edytor jest obecny na dysku. Przegl▒darkΩ mo┐na nauczyµ reagowania na okre╢lone typy plik≤w - Netscape Navigator pozwala to zrobiµ w okienku dialogowym Preferences (Options / General Preferences) na stronie Helpers.

Warto wiedzieµ, ┐e rozr≤┐niamy odsy│acze absolutne i wzglΩdne (relatywne). Pierwsze zawieraj▒ pe│ny adres internetowy strony, natomiast drugie jedynie fragment ╢cie┐ki dostΩpu.

Adresem absolutnym jest np. strona naszego wydawnictwa:

http://www.polbox.com.pl/lupus/index.html

Adresem relatywnym jest adres numeru 12 PCkuriera, zamieszczony na stronie g│≤wnej PCkuriera:

pckurier/pcq12.html

Adres relatywny korzysta z pe│nego adresu strony, na kt≤rej siΩ znajduje. Skoro strona g│≤wna PCkuriera ma adres:

http://www.polbox.com.pl/lupus/pcq.html

to automatycznie odsy│acz relatywny numeru 12 jest interpretowany jako:

http://www.polbox.com.pl/lupus/pckurier/pcq12.html

Strona 12 numeru PCkuriera jest po│o┐ona o jeden szczebel "ni┐ej" w hierarchii katalog≤w.

Stosowanie odsy│aczy relatywnych jest charakterystyczne dla danego serwisu. Autor nie musi siΩ troszczyµ o podawanie pe│nego adresu - wystarczy, je╢li poda tylko niezbΩdny fragment, gdy┐ resztΩ przegl▒darka doda sama. Odsy│acze absolutne s▒ (absolutnie :-)) konieczne, gdy wskazujemy miejsca na innych serwerach.

Przypomnijmy sobie w tym miejscu uwagi dotycz▒ce polecenia <BASE> w nag│≤wku strony <HEAD>. Konsekwentne wpisywanie adresu strony bazowej w nag│≤wku mo┐e nas uchroniµ od konieczno╢ci przepisywania wszystkich adres≤w relatywnych, gdy z jakich╢ powod≤w przenosimy stronΩ w inne miejsce i grozi nam utrata aktualno╢ci odsy│aczy wzglΩdnych.

Kilka prostych przyk│ad≤w:

Odsy│acz do innej strony HTML (w tym samym katalogu):

<A HREF="nazwa_strony.html">Edytor Paj▒czek</A>

Odsy│acz do innej strony w katalogu podrzΩdnym

<A HREF="katalog_podrzΩdny/nazwa_strony.html">Inna strona</A>

Odsy│acz do strony w innym katalogu, r≤wnorzΩdnym w hierarchii:

<A HREF="../katalog_r≤wnorzΩdny/nazwa_strony.html">Jeszcze inna strona</A>

Dwie kropki w adresie nakazuj▒ przegl▒darce "zajrzeµ wy┐ej" w hierarchii katalog≤w, "zej╢µ" do nowego katalogu i przywo│aµ ┐▒dan▒ stronΩ.

Odsy│acz do pliku tekstowego TXT
<A HREF="plik_tekstowy.txt">Plik tekstowy TXT</A>
Plik tekstowy TXT

Odsy│acz do pliku graficznego GIF
<A HREF="plik_graficzny.gif">Plik graficzny GIF</A>
Plik graficzny GIF

Odsy│acz do pliku d╝wiΩkowego
<a href="../multimed/pinkpant.mid">Plik d╝wiΩkowy</a>
Plik d╝wiΩkowy

Obszerniejsze informacje o sposobach do│▒czania plik≤w multimedialnych do dokument≤w WWW s▒ zawarte na stronie Grafika i multimedia.

Powiedzieli╢my wy┐ej, jak tworzyµ odsy│acze do innych dokument≤w. Ale nieco wcze╢niej m≤wili╢my tak┐e o etykietach, wiΩc warto teraz powiedzieµ, jak tworzyµ odsy│acze do etykiet.

Konstrukcja jest bardzo prosta:

<A HREF="strona.htm#etykieta">Tekst</A>

Je╢li tworzymy odsy│acz do etykiety na tej samej stronie, wystarczy u┐yµ samej nazwy etykiety, czyli:

<A HREF="#etykieta">Tekst, na kt≤rym nale┐y klikn▒µ</A>

Uwaga: nale┐y zwr≤ciµ uwagΩ na wielko╢µ liter w etykiecie. Gdy etykieta rozpoczyna siΩ z wielkiej litery, tak┐e odsy│acz powinien zawieraµ nazwΩ etykiety pisan▒ z wielkiej litery.

Poni┐szy przyk│ad pozwoli skoczyµ do punktu po╢wiΩconego istocie odsy│aczy, na pocz▒tku tej strony. U┐yto tu odwo│ania do etykiety #istota , umieszczonej wcze╢niej przy punkcie Istota odsy│aczy.

Przeczytaj uwagi o istocie odsy│aczy

Informacje o odsy│aczach w dokumencie zawieraj▒cym ramki s▒ podane na stronie po╢wiΩconej ramkom.

[zielona kropka] CzΩsto stosowanym odsy│aczem jest konstrukcja pozwalaj▒ca czytelnikowi strony wys│aµ do jej autora (lub jakiejkolwiek innej osoby) pocztΩ elektroniczn▒. Jej konstrukcja wygl▒da nastΩpuj▒co:

<A HREF=mailto:imie_nazwisko@adres>Tutaj kliknij</A>

Przyk│adowa zachΩta do wys│ania listu mog│aby wygl▒daµ nastΩpuj▒co:

<A HREF=mailto:pawel.wimmer@lupus.waw.pl>Je╢li chcesz mi nawrzucaµ, kliknij w tym miejscu</A>

co w praktyce przybra│oby postaµ:

Je╢li chcesz mi nawrzucaµ, kliknij w tym miejscu

albo, w bardziej stonowanej formie:

Wy╢lij list do autora strony

Oczywi╢cie w miejscu, gdzie nale┐y klikn▒µ, mo┐na te┐ po prostu podaµ adres poczty, aby by│ widoczny bezpo╢rednio na ekranie przegl▒darki.

Mo┐emy jeszcze dodatkowo opatrzyµ odsy│acz stosownym obrazkiem. W tym miejscu zastosujemy obrazek POCZTA.GIF, wstawiaj▒c definicjΩ przed adresem.

[poczta] Wy╢lij list do autora strony

Zauwa┐, ┐e gdy przesuniesz kursor nad odsy│acz, w wierszu statusu przegl▒darki pojawi siΩ kontrolna informacja
mailto:pawel.wimmer@lupus.waw.pl (Netscape Navigator) lub
Wysy│a pocztΩ do: mailto:pawel.wimmer@lupus.waw.pl (Internet Explorer PL)

Gdyby╢my sobie za┐yczyli, aby w momencie wysy│ania poczty przez czytelnika strony w polu tematu listu pojawi│a siΩ jaka╢ domy╢lna tre╢µ, mo┐emy zdefiniowaµ odsy│acz na przyk│ad tak:

<a href="mailto:pawel.wimmer@lupus.waw.pl?subject=Panie Wimmer, mam tak▒ sprawΩ:">

Przy definiowaniu adresu poczty (a nawet szerzej, pe│nego adresu) mo┐esz siΩ tak┐e pos│u┐yµ znacznikiem logicznym <ADDRESS></ADDRESS>, kt≤ry automatycznie nada odpowiedni atrybut (zazwyczaj interpretowany przez przegl▒darki jako kursywa), a ca│o╢µ umie╢ciµ w gustownej ramce (definicja tabeli)

Pawe│ Wimmer
Redaktor
Wydawnictwo Lupus
Warszawa, ul. StΩpi±ska 22/30, 00-739 Warszawa
Tel: 41-00-31 w. 128 lub 154, 41-51-21
Fax: 41-03-74
E-mail: pawel.wimmer@lupus.waw.pl

[zielona kropka] R≤wnie czΩsto stosowan▒ us│ug▒ jest FTP, kt≤ry pozwala siΩgn▒µ do serwera FTP w poszukiwaniu jakich╢ plik≤w - mo┐na w ten spos≤b wskazaµ po│o┐enie jakiego╢ shareware'owego programu. Nasze wydawnictwo posiada sw≤j w│asny serwer, z kt≤rego mo┐na skopiowaµ np. listingi zamieszczane w dziale Dla Praktyk≤w w PCkurierze, publikacje elektroniczne czy oprogramowanie. Korzystamy tutaj z protoko│u File Transfer Protocol - st▒d nazwa FTP.

Odpowiednia konstrukcja wskazuj▒ca na FTP ma postaµ:

<A HREF=ftp://ftp.adres>Jaki╢ tekst</A>

Gdyby╢my chcieli siΩgn▒µ do serwera Wydawnictwa Lupus, mo┐emy podaµ odsy│acz:

<A HREF=ftp://ftp.polbox.com.pl/library/!lupus>Tutaj znajdziesz listingi Dla Praktyk≤w</A>

Tutaj znajdziesz listingi Dla Praktyk≤w

Mo┐emy tak┐e daµ bezpo╢redni odsy│acz do pliku:

<a href="ftp://ftp.polbox.com.pl/library/!lupus/hpauthor.zip">PodrΩcznik Home Page Author</a>

PodrΩcznik Home Page Author - ok. 800 KB.

Zauwa┐, ┐e na ko±cu adresu znalaz│ siΩ ci▒g HPAUTHOR.ZIP. Jest to nazwa pliku, kt≤ry zawiera podrΩcznik. W ten spos≤b mo┐na od razu siΩgn▒µ do konkretnego pliku, a nie tylko do katalogu z plikami. Przegl▒darka WWW zapyta w≤wczas, co zrobiµ z plikiem. Wystarczy wybraµ opcjΩ Save to disk (Netscape Navigator), aby program przyst▒pi│ do ╢ci▒gania pliku na dysk naszego komputera.

Dobrym (bardzo dobrym!) obyczajem jest podawanie przy odsy│aczu do pliku wielko╢ci pobieranego materia│u. Czytelnik strony nie powinien byµ zaskakiwany du┐ymi plikami, a przede wszystkim ma prawo wiedzieµ, jak d│ugo bΩdzie trwaµ jego kopiowanie. TΩ sam▒ zasadΩ warto zreszt▒ stosowaµ, gdy podajemy odsy│acz do strony, kt≤rej wczytanie trwa do╢µ d│ugo, gdy┐ zawiera du┐o tekstu i/lub obrazk≤w. Mo┐na tu przyj▒µ granicΩ 50-100 KB.

W tym miejscu warto wspomnieµ, ┐e je╢li u┐ytkownik dysponuje pakietem do kompresji plik≤w WinZip 6.3, kt≤ry mo┐na zintegrowaµ z przegl▒darkami Netscape'a i Microsoftu, program przyst▒pi do kopiowania plik≤w w formacie zip, do domy╢lnego folderu, bez pytania, co zrobiµ z plikiem. Tym bardziej nale┐y podawaµ wielko╢µ pliku.

[zielona kropka] Konstrukcje odsy│aczowe pozwalaj▒ wstawiµ odwo│ania do kilku innych us│ug, jak np. do:

pliku na dysku lokalnym <A HREF=file:///╢cie┐ka/plik></A>,

gophera <A HREF=gopher://...></A>,

telnetu <A HREF=telnet://...></A>,

WAIS <A HREF=wais://...></A>

grup dyskusyjnych <A HREF=news://...></A>,

Je╢li podasz np. nazwΩ konkretnej grupy dyskusyjnej, klikniΩcie na odsy│aczy do niej spowoduje uruchomienie domy╢lnego programu obs│ugi grup (Collabra w Navigatorze, Outlook Express w Internet Explorerze) i ustawienie kursora na na danej grupie. Na przyk│ad:

<A HREF=news:pl.comp.www></A>

Odsy│acz do grupy dyskusyjnej pl.comp.www

Zauwa┐my, ┐e uruchamiany jest domy╢lny serwer news≤w.

Nigdy nie wiemy, kt≤ry serwer news≤w zaabonowa│ nasz czytelnik. Je╢li chcemy skierowaµ naszego go╢cia do ╢ci╢le okre╢lonego serwera, mo┐emy podaµ w odsy│aczu adres, np.:

<A HREF="news://news.fuw.edu.pl">news.fuw.edu.pl</a>

Odsy│acz do serwera news.fuw.edu.pl (Netscape mo┐e mieµ k│opoty).

Ma│o tego; mo┐emy tak┐e skierowaµ od razu do wskazanej grupy:

<A HREF="news://news.fuw.edu.pl/pl.comp.www">grupa dyskusyjna pl.comp.www</a>

grupa dyskusyjna pl.comp.www

[zielona kropka] Na zako±czenie warto jeszcze podaµ spos≤b definiowania odsy│aczy na obrazkach. Jest to o tyle przydatne, ┐e mo┐emy w ten spos≤b wykorzystaµ grafikΩ. Taki spos≤b definiowania odsy│aczy jest ju┐ powszechnie spotykany w World Wide Web, aczkolwiek warto tak┐e stosowaµ r≤wnoleg│e odsy│acze tekstowe, gdy┐ nie wszyscy stosuj▒ przegl▒darki graficzne i byliby w ten spos≤b pozbawieni mo┐liwo╢ci wykonania skoku.

W tym miejscu poka┐emy tzw. mapowanie po stronie klienta, a wiΩc nowocze╢niejszy spos≤b, akceptowany przez r≤┐ne wersje Navigatora i Internet Explorera.

Wyobra╝my sobie, ┐e mamy obrazek, na kt≤ry chcieliby╢my na│o┐yµ mapΩ odsy│aczy (niech Czytelnik │askawie przymknie oko na brak precyzji). Zaznaczone prostok▒ty maj▒ ilustrowaµ zakres map.

[Odsy│acz]

Na razie jest to grafika bez odsy│aczy.

Poni┐ej widaµ obrazek z map▒ odsy│aczy. Gdy Czytelnik przesunie kursor myszki nad zaznaczone prostok▒ty, kursor przyjmie postaµ "r▒czki", sygnalizuj▒cej istnienie odsy│acza. W wierszu statusu przegl▒darki pojawi▒ siΩ adresy stron. S▒ to adresy fikcyjne, wiΩc klikniΩcie nie spowoduje skoku do tak nazwanej strony.

[Odsy│acz]

A oto pe│na tre╢µ polecenia:

<IMG SRC="odsylacz.gif " USEMAP="#mapa1">
<MAP NAME ="mapa1">
<AREA SHAPE=RECT COORDS="1, 1, 50, 50" HREF="1.html">
<AREA SHAPE=RECT COORDS="51, 1, 100, 50" HREF="2.html">
<AREA SHAPE=RECT COORDS="1, 51, 51, 100" HREF="3.html">
<AREA SHAPE=RECT COORDS="51, 51, 100, 100" HREF="4.html">
</MAP>

Pierwszy wiersz polecenia przywo│uje obrazek. USEMAP informuje przegl▒darkΩ, ┐e obrazek "odsylacz.gif" jest mapowany, i ┐e mapa nosi nazwΩ "mapa1".
Drugi wiersz zapocz▒tkowuje definicjΩ mapy.
Wiersze 3-6 wprowadzaj▒ cztery kolejne fragmenty mapy odsy│aczy, odpowiadaj▒ce prostok▒tom na rysunku. SHAPE=RECT m≤wi, ┐e chodzi tutaj o prostok▒ty (RECT=rectangle). COORDS informuje o wsp≤│rzΩdnych, przy czym pierwsze dwie liczby w wierszu podaj▒ lewy g≤rny r≤g prostok▒ta, a nastΩpne dwa - prawy dolny. Warto unikaµ nak│adania na siebie obszar≤w map, choµ przegl▒darka akceptuje nak│adanie. HREF= stanowi przywo│anie jakiego╢ dokumentu HTML.
Ostatni wiersz stanowi zako±czenie definicji mapy.

Opr≤cz prostok▒t≤w (kwadrat≤w) mo┐emy tworzyµ mapy z u┐yciem okrΩg≤w i obszar≤w nieregularnych.

W przypadku okrΩgu stosujemy polecenie:

<AREA SHAPE=CIRCLE COORDS=" 25, 25, 19" HREF="dokument.html">

ProszΩ zwr≤ciµ uwagΩ na SHAPE=CIRCLE oraz przyk│adowe liczby 25,25,19. Pierwsze dwie liczby informuj▒ o po│o┐eniu ╢rodka okrΩgu, ostatnia - o d│ugo╢ci promienia.

Gdyby╢my chcieli u┐yµ obszaru nieregularnego, musieliby╢my podaµ przyk│adowe polecenie, zawieraj▒ce przynajmniej trzy pary wsp≤│rzΩdnych, definiuj▒cych "rogi" obszaru:

<AREA SHAPE=POLYGON COORDS=" 23, 33, 82, 16, 82, 80" HREF="dokument.html">