Rozdział 16.
Tworzenie i stosowanie
map odsyłaczy

Mapy odsyłaczy są specjalnym rodzajem obrazów czułych na klikanie. Zazwyczaj, gdy osadzasz obraz wewnątrz połączenia, kliknięcie w jakimkolwiek miejscu obrazu zawsze prowadzi pod ten sam adres. W przypadku map odsyłaczy, w zależności od obszaru obrazu, w którym nastąpiło kliknięcie, adres docelowy będzie inny. W tym rozdziale poznasz mapy odsyłaczy i dowiesz się, jak je tworzyć. Oto szczegółowe tematy.

• czym są mapy odsyłaczy,

• tworzenie map odsyłaczy działających po stronie serwera,

• tworzenie map odsyłaczy działających po stronie klienta,

• obsługa obu typów map odsyłaczy.

Czym są mapy odsyłaczy

W rozdziale 7. — „Wykorzystywanie obrazów, koloru i tła” nauczyłeś się tworzyć obraz spełniający funkcje połączenia poprzez umieszczenie znacznika <IMG> w obrębie znacz­nika <A>. W ten sposób cały obraz staje się połączeniem. Klikając w obraz, w obszarze jego obramowania lub tła, uzyskasz ten sam efekt.

W mapach odsyłaczy różne części obrazu aktywują różne połączenia. Stosując takie obiekty, możesz tworzyć wizualną mapę hiperpołączeń, które prowadzą Cię do stron przypisanych odpowiednim obszarom (patrz rysunek 16.1). Możesz też stworzyć wizualną metaforę dla prezentowanych informacji, półkę z książkami lub fotografię, na której każdej z osób przyporządkowany jest opis.

Mapy odsyłaczy są to specjalne obrazy, podzielone na obszary stowarzyszone z osobnymi połączeniami. Adres, pod który dotrzesz, klikając taki obraz, zależy od wybranego miejsca.

Istnieją dwa rodzaje map odsyłaczy: działające po stronie serwera oraz działające po stronie przeglądarki. Mapy odsyłaczy działające po stronie serwera były używane we wczesnym okresie istnienia WWW, jednak przysparzały pewnych problemów autorom

Rysunek 16.1. Istota map odsyłaczy — różne miejsca obrazu to różne połączenia

stron WWW. Zagadnienia te przedstawię w dalszej części tego rozdziału. Aktualnie znacznie częściej są wykorzystywane mapy odsyłaczy działające po stronie przeglądarki. Wykazują one wiele zalet w porównaniu ze starszymi mapami odsyłaczy działającymi po stronie serwera.

Mapy odsyłaczy działające po stronie serwera są implementowane za pomocą obrazu wyświetlanego przez klienta, natomiast program działa na serwerze.

Mapy odsyłaczy działające po stronie klienta pracują w ten sam sposób co poprzednia wersja. Różnica polega jedynie na tym, że nie ma w tym wypadku programu działającego na serwerze. Obróbka współrzędnych i kojarzenie adresów odbywa się w przeglądarce.

Choć mapy odsyłaczy działające po stronie serwera nie są już wykorzystywane tak często jak niegdyś, to jednak poznanie zasad działania i sposobów używania obu typów map odsyłaczy może dać duże korzyści. Jeśli chcesz zapewnić zgodność witryny z wcześniejszym typem map odsyłaczy, to będziesz musiał poznać metody wykorzystania map obu typów. Wszystkie konieczne informacje znajdziesz w tym rozdziale.

Mapy odsyłaczy działające po stronie serwera

Gdy mapy odsyłaczy pojawiły się na WWW, były tworzone przy użyciu specjalnych programów działających na serwerach. Mapy tego typu nazywane są mapami odsyłaczy działającymi na serwerze.

Gdy przeglądarka aktywuje połączenie na mapach odsyłaczy, wywoływany jest specjalny program przechowywany na serwerze WWW. Przeglądarka przekazuje mu współrzędne x oraz y miejsca obrazu, w którym użytkownik kliknął. Program obsługi map odsyłaczy wyszukuje specjalny plik definicji map, który dopasowuje obszary obrazu do adresów URL, wykonuje pewne obliczenia, aby określić, którą ze stron załadować. Następnie ją ładuje.

Mapy odsyłaczy działające po stronie serwera były jedną z najwcześniejszych opcji siecio­wych i są obsługiwane przez większość graficznych przeglądarek, o ile nie przez wszystkie. Mapy tego typu nastręczają jednak pewnych problemów, które przedstawiłam poniżej:

• zazwyczaj, gdy przesuwasz wskaźnik myszy nad połączeniem, adres URL, do którego prowadzi połączenie, jest wyświetlany na pasku stanu okna przeglądarki. Ponieważ jednak przeglądarka WWW nie ma pojęcia, gdzie prowadzą poszczególne części map odsyłaczy, to, umieszczając wskaźnik myszy nad obrazem, zobaczysz albo URL samego programu obsługującego mapy odsyłaczy (co nie jest bardzo pomocne), albo ten sam URL i współrzędne x i y (równie mało pomocne);

• nie możesz używać ani testować takich map odsyłaczy z wykorzystaniem plików lokalnych. Mapy odsyłaczy wymagają kontaktu z serwerem, by uruchomić program obsługi i przeprowadzić analizę współrzędnych x i y;

• Ponieważ każde kliknięcie w obrębie map odsyłaczy wymaga uruchomienia przez serwer specjalnego programu, są one znacznie wolniejsze niż zwykłe połączenia klasyczne czy też w postaci obrazów. W konsekwencji, jeśli prośba o nową stronę jest realizowana za pośrednictwem map odsyłaczy, będzie to trwało wieki.

Mapy odsyłaczy działające po stronie klienta

Chociaż mapy odsyłaczy działające po stronie serwera są powszechnie używane od dłuższe­go już czasu, problemy z nimi związane doprowadziły do stworzenia nowego typu map odsyłaczy — są to mapy odsyłaczy działające po stronie klienta. Mapy odsyłaczy działające po stronie przeglądarki eliminują wszelkie problemy występujące przy wykorzystaniu map odsyłaczy działających po stronie serwera, gdyż w ich przypadku nie ma potrzeby korzystania z programu do obsługi map działającego na serwerze. Przetwarzanie map jest w całości wykonywane lokalnie w samej przeglądarce. W rezultacie przeważająca ilość projektantów witryn WWW korzysta dziś właśnie z tego rodzaju map odsyłaczy.

Mapy odsyłaczy działające po stronie przeglądarki są obecnie obsługiwane przez najnowsze wersje przeglądarek sieciowych, w tym Netscape (2.0 i wersje nowsze) oraz Internet Explorer (3.0 i wersje późniejsze). Propozycja takiego rozwiązania została zawarta w specyfikacji HTML 3.2 oraz 4.0.

Mapy odsyłaczy a przeglądarki tekstowe

Ze względu na swoją naturę, mapy odsyłaczy mogą działać wyłącznie w przeglądarkach graficznych. W rzeczywistości, gdy próbujesz oglądać dokument zawierający takie obiekty w przeglądarce tekstowej, takiej jak, na przykład, Lynx, nie pojawi się nawet ślad istnienia obrazu, chyba że do obrazu dołączony jest atrybut ALT. Ale nawet wówczas nie będziesz mógł wykorzystać obrazu do nawigacji. Jeśli decydujesz się na umieszczenie map odsyłaczy w swoich dokumentach, jest niezwykle istotne, abyś utworzył także tekstowy ekwiwalent obrazu, wówczas czytelnicy posługujący się przeglądarkami tekstowymi będą mogli korzystać z Twojej strony. Zastosowanie map odsyłaczy ograniczy możliwości tych użytkowników, bądź więc miłosierny i pozwól im przynajmniej pooglądać zawartość strony.

Tworzenie map odsyłaczy działających
po stronie serwera

Choć mapy odsyłaczy działające po stronie serwera mają swoje wady, wciąż jednak warto znać sposoby ich wykorzystania. Niestety, serwery WWW w różny sposób tworzą mapy odsyłaczy, co sprawia, że wyjaśnienie sposobów ich tworzenia przysparza pewnych trudności. Nawet w przypadku tej samej platformy mogą być stosowane inne metody. I tak serwery: W3C CERN i HTTPD NCSA stosują odmienne metody implementacji plików. Identyczne są nato­miast elementy składowe map odsyłaczy:

• specjalny kod HTML wskazujący, że obraz jest mapą,

• plik definicji mapy umieszczony na serwerze, który zawiera przyporządkowanie obszarów obrazu odpowiednim połączeniom do stron WWW,

• skrypt CGI łączący wszystko w jedną całość.

• Ten podrozdział wyjaśnia ogólne zasady konstrukcji map odsyłaczy, ale przykłady zostały przygotowane z myślą o takich serwerach, jak NCSA i Apache. Jeśli w przypadku Twojego serwera konieczne są dodatkowe informacje, spójrz do jego dokumentacji lub zwróć się do administratora.

Wybór obrazu

Aby utworzyć mapy odsyłaczy, potrzebny Ci będzie obraz (to oczywiste). Obraz, który ma być zastosowany do przygotowania mapy powinien zawierać odrębne wizualnie obszary, aby można było łatwo je wybierać. Takie wymagania spełniają obrazy zawierające fragmenty symboliczne lub dające się łatwo podzielić na wielokąty. Dość trudno tworzy się mapy odsyłaczy w oparciu o fotografie, bowiem ich elementy mają tendencję do zlewania się ze sobą lub też mają nietypowe kształty. Rysunki 16.2 i 16.3 pokazują przykłady odpo­wiednich i nieodpowiednich na mapy obrazów.

Definiowanie koordynat

Sercem działających po stronie serwera map odsyłaczy jest plik zawierający definicję mapy. Stworzenie tego pliku wymaga nakreślenia na obrazie obszarów, w których będzie można klikać, określenia współrzędnych definiujących te obszary i wybrania stron HTML, do których prowadzić będą połączenia.

Rysunek 16.2. Ten obraz nadaje się na mapy
Rysunek 16.3. Piękny obrazek, ale nie nadaje się na mapy odsyłaczy
	Format pliku zawierającego definicje mapy zależy od programu obsługi map odsyłaczy działającej na serwerze. W tym rozdziale omawiać będę serwer NCSA HTTPD i jego domyślny plik definicji mapy. Jeżeli korzystasz z innego serwera, możesz mieć do dyspozycji kilka programów obsługi map odsyłaczy oferujących różne formaty. W takiej sytuacji zawsze możesz zwrócić się do administratora sieci o pomoc lub wybrać sam, po uważnym przeczytaniu dokumentacji.

Tworzenie pliku mapy możesz rozpocząć od ręcznego naszkicowania obszarów i zanotowania ich współrzędnych. Dostępne są także programy do przygotowywania map odsyłaczy. Zastosowanie takiego programu ułatwi Ci życie, bowiem generuje on plik definicji mapy automatycznie, za podstawę biorąc obszary nakreślone za pomocą myszy.

Programy Mapedit dla systemu Windows oraz WebMap dla komputerów Macintosh pomogą Ci w tworzeniu plików definicji mapy w formacie NCSA. Jeśli korzystasz z systemu Unix, to będziesz mógł skopiować odpowiednią wersję programu Mapedit z serwera FTP. (Pełną listę adresów serwerów FTP zawierających zasoby związane z tworzeniem map odsyłaczy i nie tyko, znajdziesz w dodatku A, pt.: „Inne źródła informacji”). Wiele z najnowszych WYSIWIG edytorów stron WWW również umożliwia generowanie map odsyłaczy.

W tabeli 16.1 przedstawiona jest lista dostępnych obecnie narzędzi przeznaczonych do generowania map odsyłaczy.

Tabela 16.1.

Oprogramowanie wspomagające tworzenie map odsyłaczy

Nazwa	Platforma	URL
Web HotSpots	Windows	http://www.1automata.com/hotspots/index.html
Imaptool	Linux/ X-Windows	http://www.sspitzer.org/imaptool/
LiveImage	Windows	http://www.mediatec.com
Mapedit	Windows/Unix	http://www.boutell.com/mapedit
Poor Person's Image Mapper	X-Window	http://www.pangloss.com/seidel/ClrHlpr/imagemap.html

Za pomocą tych programów możesz konwertować współrzędne do formatu właściwego dla Twojego serwera.

Jeśli jesteś zmuszony ręcznie przygotowywać pliki zawierające definicję mapy, w tym miejscu znajdziesz odpowiedni przepis. Najpierw zrób szkic obszarów, które chcesz uaktywnić w swoim obrazie. Rysunek 16.4 przedstawia trzy typy obszarów, które można definiować w mapach odsyłaczy: koło, prostokąt oraz wielobok.

Rysunek 16.4. Szkicowanie obszarów

W kolejnym kroku musisz określić współrzędne krańcowych punktów tych obszarów. Ten proces jest taki sam, niezależnie od tego czy tworzysz mapę odsyłaczy działającą po stronie serwera, czy po stronie przeglądarki. Większość programów do edycji obrazów wyświetla współrzędne wskaźnika myszy — skorzystaj z tej opcji i zanotuj odpowiednie współrzędne (wspomniane wyżej pro­gramy zrobią to za Ciebie, ale samodzielne wykonanie tych operacji pomoże Ci zrozumieć cały proces).

Definiowanie obszarów wielobocznych

Na rysunku 16.5 zostały przedstawione współrzędne obszaru wielobocznego. Wartości te liczone są względem lewego, górnego wierzchołka obrazu, który ma współrzędne (0,0). Pierwsza liczba w każdej parze oznacza współrzędną x i definiuje ilość pikseli od lewej krawędzi obrazu. Druga liczba oznacza współrzędną y i definiuje ilość pikseli od górnej krawędzi obrazu.

Rysunek 16.5. Określanie współrzędnych obszaru wielobocznego
	Początek układu współrzędnych, czyli punkt (0,0), znajduje się w lewym, górnym wierzchołku obrazu, a wartości współrzędnych y rosną ku dołowi.

Definiowanie obszaru w kształcie koła

Rysunek 16.6 przedstawia sposób określania współrzędnych obszaru w kształcie koła. W tym przypadku należy zapisać współrzędne środka koła oraz długość jego promienia, wyrażoną w pikselach. Środek koła jest określany jako para współrzędnych (x,y) liczonych względem lewego, górnego wierzchołka obrazu.

Rysunek 16.6. Określanie współrzędnych obszaru o kształcie koła

Definiowanie obszaru prostokątnego

Rysunek 16.7 pokazuje, jak określić współrzędne obszaru prostokątnego. W tym przypadku należy zanotować współrzędne (x,y) lewego górnego oraz prawego dolnego wierzchołka prostokąta.

Rysunek 16.7. Określanie współrzędnych obszaru prostokątnego

Definiowanie punktu

Starsze przeglądarki dają także możliwość definiowania punktów na mapie odnośników. Jeśli podczas kliknięcia wskaźnik myszy nie znajdzie się w zakresie działania żadnego ze zdefiniowanych obszarów, to zostanie uaktywniony najbliżej położony punkt. Punkty są przydatne w przypadku fotografii i innych obrazów, których elementy zlewają się ze sobą. Wprowadzają one pewną ziarnistość, dzięki której użytkownik nie musi klikać w dokładnie wyznaczonych rejonach. W przypadku definiowania punktów wystarczy zanotować parę współrzędnych (x,y) liczonych względem lewego, górnego wierzchołka obrazu.

Tworzenie i zapisywanie pliku mapy odsyłaczy

Kiedy już zaznaczysz współrzędne obszarów na obrazie, który będzie mapą odsyłaczy, to wykonałeś połowę pracy. Następnym etapem jest przyporządkowanie obszarom lub punktom adresów URL, odpowiadających połączeniom. Ten sam adres może wskazywać wiele obszarów, ale każdy obszar może mieć tylko jedno połączenie.

Mając obszary, współrzędne i adresy URL, możesz przystąpić do napisania definicji mapy przeznaczonej dla Twojego serwera. Plik definicji dla serwera NCSA HTTPD wygląda w ten sposób:

default URL
circle URL x,y promień

rect URL x,y x,y

poly URL x1,y1 x2,y2 ... xN,yN

point URL x,y

Pliki definicji mapy dla programu obsługującego na Twoim serwerze mapy odsyłaczy mogą wyglądać inaczej, ale podstawowe elementy są takie same. Dla każdej z kolejnych pozycji x i y podstaw wartości zanotowanych uprzednio współrzędnych. Zauważ, że promien (w wierszu circle) jest promieniem obszaru o kształcie koła.

Porządek obszarów w pliku jest istotny, wyższa pozycja obszaru oznacza pierwszeństwo w przejmowaniu kliknięć. Jeśli obszary pokrywają się, kliknięcie w miejscu pokrywania spowoduje aktywację obszaru wcześniej wymienianego w pliku.

Definicja mapy zawiera także obszar „domyślny” — nie ma on współrzędnych i jest po prostu adresem URL. Wykorzystywany jest, gdy kliknięcia wypadają poza wyspecyfikowa­nymi obszarami. Stanowi pokrycie dla reszty obrazu, z którą nie jest powiązane żadne połączenie (jeśli korzystasz z serwera NCSA HTTPD i umieszczasz w pliku definicji mapy default, nie powinieneś korzystać z punktów; ich obecność wyklucza default).

Jeśli chciałbyś wykorzystać współrzędne podane na rysunkach 16.5 do 16.7 i zapisać je w pliku mapy dla serwera NCSA HTTPD, to mógłby on przybrać następującą postać:

poly http://serwer.pl/witryna/muzyka.html 229,66 276,19 332,19 333,94 263,94

circle http://serwer.pl/witryna/linki.html 121,79 66

rect http://serwer.pl/witryna/dosciagniecia.html 342,19 440,318

Niezależnie od formatu pliku, podawane adresy URL muszą być albo pełnymi adresami (roz­poczynającymi się od http, ftp lub nazwy innego protokołu), albo pełnymi ścieżkami dostępu do plików, do których się odwołujesz, w tym wypadku podajesz wszystko, co znajduje się w adresie za nazwą komputera. Nie wolno stosować w plikach definicji ścieżek relatywnych.

Oto przykład pliku definicji mapy dla serwera NCSA HTTPD:

circle /www/mapping.html 10,15 20
circle /www/mapping.html 346,23 59
poly /www/test/orange.html 192,3 192,170 115,217
rect /www/pencil.html 57,57 100,210
point /www/pencil.html 100,100
point /www/orange.html 200,200

Tworzenie pliku definicji mapy jest najtrudniejszą częścią tworzenia mapy odsyłaczy. Gdy już to zrobisz, będziesz musiał zainstalować ten plik na serwerze. Zapisując plik definicji mapy odsyłaczy, warto nadać mu opisową nazwę, na przykład, mojamapa.map. Miejsce, w którym zapiszesz te pliki nie ma większego znaczenia, ja osobiście lubię umieszczać je w jednym miejscu, w centralnym katalogu maps, na najwyższym poziomie udostępnianej przez sieć struktury katalogów.

Instalowanie programu obsługi map odsyłaczy

Oprócz pliku definicji mapy, o którym pisałam przed chwilą, będziesz musiał zainstalować także specjalny program służący do obsługi map. Programy tego typu są zazwyczaj umieszczane w katalogu o nazwie cgi-bin, odpowiednio skonfigurowanym w celu przechowywania programów i skryptów na serwerze. Większość serwerów domyślnie zaopatrzona jest w program obsługi map odsyłaczy i jeśli korzystasz z takiego, którym nie administrujesz, będziesz prawdopodobnie miał możliwość użycia takiego programu. Zazwyczaj występuje on pod nazwą htimage lub imagemap.

Bądź ostrożny, korzystając z programu imagemap dla serwera NCSA. Starsze wersje tego programu były trudne w obsłudze i wymagały dodatkowego pliku konfiguracyjnego. W wersji 1.5 serwera program działa znacznie lepiej. Jeśli nie korzystasz z najnowszej wersji serwera, nową wersję programu możesz znaleźć pod adresem: http://hoohoo.ncsa.uiuc.edu/docs/tutorials/imagemap.txt.

Łączenie wszystkiego razem

A zatem masz już obraz, plik definicji mapy opisujący obszary, w jakie można klikać, ich miejsca docelowe oraz program obsługi map odsyłaczy. Teraz powinieneś połączyć ze sobą wszystkie te elementy.

W kodzie HTML strony, która zawiera mapy odsyłaczy, musisz umieścić znaczniki <A> i <IMG>, by wykreować żądany efekt. Oto przykład fragmentu kodu, w którym zastoso­wano program dla serwera NCSA:

<a href="/cgi-bin/imagemap/maps/mojamapa.map">

<img src="image.gif" ismap></a>

Przeanalizuj to połączenie. Po pierwsze, połączenie do skryptu map odsyłaczy (mojamapa) wskazywane jest w sposób, którego mógłbyś się spodziewać, ale zaraz za nim pojawia się ścieżka dostępu do pliku definicji mapy. Ścieżka ta powinna mieć pełną postać, rozpoczy­ając się od Twojego głównego katalogu WWW (podajesz wszystko, co występuje w adresie URL po nazwie komputera), w tym przypadku jest to /maps/moja-mapa.map. Ta dziwaczna forma adresu zostanie wyjaśniona w rozdziale 19., w którym zajmiemy się skryptami CGI.

W drugim wierszu kodu HTML, w znaczniku <IMG>, pojawia się atrybut ISMAP. Jest to prosty atrybut nie posiadający wartości, który informuje przeglądarkę, by przekazywała współrzędne poszczególnych kliknięć programowi obsługi map odsyłaczy na serwerze.

Mając wszystkie trzy elementy map odsyłaczy działających po stronie serwera — plik defi­nicji mapy, program obsługi map odsyłaczy i specjalny kod HTML — możesz wypróbować swoje mapy odsyłaczy. Po załadowaniu zawierającego je pliku HTML do przeglądarki, możesz udawać się do różnych miejsc na serwerze i wybierać różne fragmenty mapy.

Jeśli działasz na serwerze NCSA HTTPD i nie masz najnowszej wersji programu imagemap, gdy klikniesz na swoich mapach odsyłaczy, wyświetlony zostanie błąd Cannot Open Configuration file (nie mogę otworzyć pliku konfiguracyjnego). W takim przypadku skontaktuj się z administratorem.

Ćwiczenie 16.1: Mapa odsyłaczy w formie szafy grającej

Mapy odsyłaczy mogą być dosyć niebezpieczne. Jeśli ich obszary nie zostaną rozmieszczone w poprawny sposób, a wszystkie dodatkowe narzędzia nie będą poprawnie zainstalowane, to wykorzystanie map odsyłaczy może być powodem występowania licznych błędów. W tym przykładzie użyjesz obrazu (patrz rysunek 16.8) i na jego pod-stawie stworzysz plik mapy odsyłaczy, wykorzystując format pliku map odsyłaczy serwera NCSA. Dzięki temu będziesz się mógł przekonać, jak wyglądają pliki map odsyłaczy i jak należy je tworzyć.

Rysunek 16.8. Obraz szafy grającej

W pierwszej kolejności należy zdefiniować obszary obrazu, w które użytkownik będzie mógł klikać. Zapewne zauważyłeś, że na obrazie znajduje się sześć prostokątnych „przycisków” z nazwami rodzajów muzyki, obszar centralny przypominający kształtem

domek (który doskonale się nadaje do stworzenia obszaru wielobocznego) oraz wyświetlone z boku koło ze znakiem zapytania. Na rysunku 16.9 przedstawione zostały przykłady typów regionów, których utworzenie jest najbardziej logiczne.

Rysunek 16.9. Szafa grająca ze zdefiniowanymi obszarami.

Teraz, kiedy już wiesz, w jakich miejscach obrazu powinny się znaleźć poszczególne obszary, będziesz musiał określić ich dokładne współrzędne. Możesz to zrobić ręcznie lub posłużyć się specjalnym programem do tworzenia map odsyłaczy, takim jak Mapedit lub WebMap (to rozwiązanie jest bardzo zalecane). Jeśli chcesz spróbować określać współrzędne obszarów ręcznie, także możesz wykorzystać programy do edycji map odsyłaczy, gdyż większość z nich podczas przesuwania wskaźnika myszy po obrazie wyświetla współrzędne jego położenia.

PhotoImpact 6.0, o którym wspominałam w rozdziale 9. — „Tworzenie animowanych obrazów”, wyświetla położenie wskaźnika myszy na pasku stanu, w lewym dolnym wierzchołku okna programu. Program ten został także wyposażony w narzędzie ułatwiające tworzenie map odsyłaczy. Wystarczy, że użyjesz odpowiedniego narzędzia wyboru: Rectangle, Circle lub Polygon, aby oznaczyć prostokątny, okrągły lub wieloboczny obszar, który chcesz zdefiniować. Następnie wybierz opcję Web/mage Map, a będziesz mógł zdobyć informacje o współrzędnych obszaru, określić skojarzony z nim adres URL oraz wybrać typ mapy odsyłaczy, którą chcesz stworzyć. Program PhotoImpact wyświetla poprawny kod map odsyłaczy serwerów NCSA oraz CERN, jak również map obsługiwanych po stronie przeglądarki. Okno dialogowe narzędzia ułatwiającego tworzenie map odsyłaczy zostało przedstawione na rysunku 16.10.

Rysunek 16.10. Okno dialogowe Image Map Tag programu PhotoImpact 4.0.

Czy potrzebujesz programu graficznego? Oto sztuczka, którą możesz zastosować, jeśli używasz przeglądarki Netscape Navigator. Utwórz dokument HTML zawierający obraz umieszczony wewnątrz połączenia wskazującego na nieistniejący plik, a wewnątrz znacznika <IMG> umieść atrybut ISMAP. Nie potrzebujesz w tym celu poprawnego połączenia, możesz stworzyć dowolne, nawet takie, które nie będzie działać. Kod HTML tego połączenia może, przykładowo, wyglądać w następujący sposób:

<a href="costam"><img srd="obraz.gif" ismap></a>

Jeśli teraz wyświetlisz ten dokument HTML w przeglądarce, to obraz zostanie wyświetlony jako mapa odsyłaczy i podczas przesuwania po nim wskaźnika myszy, na pasku stanu przeglądarki będą wyświetlane współrzędne położenia tego wskaźnika. Używając tej sztuczki, możesz określić współrzędne dowolnego punktu obrazu i wykorzystać je przy tworzeniu pliku mapy odsyłaczy.

Dysponujesz już listą współrzędnych, będą Ci jeszcze potrzebne jedynie adresy stron WWW, do których użytkownik zostanie przeniesiony po kliknięciu odpowiedniego obszaru. Mogą to być adresy dowolnych dokumentów lub skryptów, dowolne adresy, których możesz użyć w przeglądarce. W tym przykładzie, stworzysz kilka dokumentów i zapiszesz je w katalogu muzyka serwera WWW. Są to strony, których następnie użyjesz jako punktów docelowych obszarów zdefiniowanych na mapie odsyłaczy. Na rysunku 16.11 przedstawiłam każdy z ośmiu obszarów mapy odsyłaczy. W tabeli 16.2 zostały podane typy, współrzędne oraz adresy stron, które przeglądarka wyświetli po kliknięciu każdego z obszarów mapy.

Rysunek 16.11. Osiem obszarów mapy ponumerowanych zgodnie z zawartością tabeli 16.2

Teraz stwórz element pliku mapy dla prostokątnego obszaru Klasyka, podając w nim współrzędne obszaru oraz dokument, jaki ma zostać wyświetlony po jego kliknięciu. W przypadku pliku mapy serwera NCSA informacje te mają następującą postać:

rect /muzyka/klasyka.html 101,113,165,134

Zwróć uwagę, iż adresy podawane w pliku mapy muszą być ścieżkami bezwzględnymi, rozpoczynającymi się od głównego poziomu witryny (a nie od głównego katalogu systemu plików). Nie mogą to być adresy względne, określane na podstawie położenia pliku mapy odsyłaczy — mapy odsyłaczy nie działają w ten sposób. W tym przypadku katalog muzyka znajduje się na głównym poziomie witryny WWW, a plik klasyka.html jest umieszczony w tym katalogu, a zatem adres, jaki będzie można umieścić w pliku mapy odsyłaczy ma postać /muzyka/klasyka.html.

Tabela 16.2.

Obszary wyróżnione na obrazie przedstawiającym szafę graficzną

Numer	Typ	URL	Współrzędne
1	Rect	muzyka/klasyka.html	101,113 165,134
2	Rect	muzyka/country.html	101,139 165,159
3	rect	muzyka/rockpop.html	101,163 165,183
4	poly	Muzyka/glowna.html	175,152 203,118 220,118 247,152 237,153 237,181 186,181 186,153
5	rect	Muzyka/swing.html	259,113 323,134
6	rect	Muzyka/jazz.html	259,139 323,159
7	rect	Muzyka/gospel.html	259,163 323,183
8	circle	Muzyka/pomoc.html	379,152 21

Teraz będziesz mógł stworzyć identyczne elementy dla pozostałych obszarów mapy (Country, Rock/Pop, Home, Swing, Jazz, Gospel i Help). Nie zapomnij umieścić w pliku mapy elementu default, obsługującego wszystkie miejsca mapy leżące poza zdefiniowanymi obszarami (w naszym przypadku spowoduje to wyświetlenie strony notaspot.html). Po zakończeniu pracy, plik mapy odsyłaczy powinien mieć następującą postać:

default /muzyka/notaspot.html

rect /muzyka/klasyka.html 101,113 165,134

rect /muzyka/country.html 101,139 165,159

rect /muzyka/rockpop.html 101,163 165,183

poly /muzyka/glowna.html 175,152 203,118 220,118 247,152 237,153

237,181 186,181 186,153

rect /muzyka/swing.html 259,113 323,134

rect /muzyka/jazz.html 259,139 323,159

rect /muzyka/gospel.html 259,163 323,183

circle /muzyka/pomoc.html 379,152 21

Zapisz plik mapy pod nazwą jukebox.map i umieść w katalogu serwera służącego do przechowywania map lub do dowolnego innego katalogu, w którym przechowujesz mapy odsyłaczy. Ostatnim zadaniem będzie stworzenie strony WWW zawierającej obraz szafy grającej, znacznik <IMG> z atrybutem ISMAP oraz połączenie z programem służącym do obsługi map odsyłaczy. Poniższy przykład demonstruje sposób wykorzystania programu do obsługi map odsyłaczy na moim serwerze:

<a href="http://www.lne.com/cgi-bin/imagemap/maps/jukebox.map">

<img src="jukebox.gif" ismap></a>

I to wszystko! Teraz, gdy wszystkie elementy mapy zostały stworzone i podłączone, kliknięcie jakiegoś punktu obrazu powinno spowodować wyświetlenie odpowiedniej strony.

Kompletna strona WWW została przedstawiona na rysunku 16.12. Zwróć uwagę, iż poniżej mapy odnośników zostały umieszczone połączenia tekstowe, przeznaczone dla osób, które będą oglądały stronę, korzystając z przeglądarki tekstowej lub które w swoich przeglądarkach wyłączą wyświetlanie obrazów. Oto kompletny kod strony:

	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/transitional.dtd"> <html> <head> <title>Super strona muzyczna</title> </head> <body bgcolor="#ffffff"> <div align="center"> <h1>Superstrona muzyczna</h1> <p>Wybierz gatunek muzyki, której chcesz posłuchać.<br /> W przeglądarce pojawi się lista piosenek, które możesz wybrać.</p> <p> <a href="http://www.lne.com/cgi-bin/imagemap/maps/jukebox.map"> <img src="jukebox.gif" alt="Juke Box" ismap="ismap" width="425" height="242" /> </a></p> <p><a href="code/muzyka/glowna.html">Strona główna</a> | <a href="code/muzyka/klasyka.html">Klasyka</a> | <a href="code/muzyka/country.html">Country</a> | <a href="code/muzyka/rockpop.html">Rock/Pop</a> | <a href="code/muzyka/swing.html">Swing</a> | <a href="code/muzyka/jazz.html">Jazz</a> | <a href="code/muzyka/gospel.html">Gospel</a> | <a href="code/muzyka/pomoc.html">Pomoc</a></p> </div> </body> </html>
Rysunek 16.12. Końcowa wersja strony muzycznej zawierająca mapę odsyłaczy obsługiwaną po stronie serwera

Tworzenie map odsyłaczy
obsługiwanych po stronie przeglądarki

Teraz, gdy już znasz starszy sposób tworzenia map odsyłaczy, nadszedł czas, aby przedstawić nowy. Jak już wcześniej wspominałam, mapy odsyłaczy działające po stronie przeglądarki mają kilka zalet i usprawnień w porównaniu z mapami odsyłaczy działającymi po stronie serwera. Podstawową zaletą i ułatwieniem jest fakt, iż nie trzeba już umieszczać na serwerze specjalnego programu służącego do obsługi map. Nowoczesne przeglądarki obsługują mapy odsyłaczy lokalnie, na komputerach użytkowników.

W procesie tworzenia map odsyłaczy działających po stronie klienta etap znajdowania współrzędnych każdego z obszarów jest dokładnie taki sam, jak w poprzednim przypadku. Jednakże współrzędne i odwołania do plików stanowią w tym wypadku integralną część dokumentu HTML, a nie osobny plik.

Znaczniki <MAP> i <AREA>

Mapy odsyłaczy działające po stronie klienta są umieszczane w dokumencie HTML za po­mocą znacznika <MAP>. Jego składnia wygląda w ten sposób:

<map name="nazwamapy"> współrzędne i adresy </map>

Wartością atrybutu NAME jest nazwa definicji mapy. Nazwa ta będzie wykorzystywana później w celu stowarzyszenia obrazu z odpowiadającymi mu współrzędnymi i odwołaniami, jeśli więc na jednej stronie umieszczonych jest kilka takich obrazów, pojawi się kilka znaczników <MAP> z różnymi nazwami.

Między znacznikami <MAP> i </MAP> wprowadzane są współrzędne każdego z obszarów map odsyłaczy oraz adresy URL punktów przeznaczenia, do których obszary prowadzą. Stosowane są tu te same wartości i połączenia, którymi posługiwałeś się w podrozdziale poświęconym mapom odsyłaczy, działającym po stronie serwera. Tym razem jednak współrzędne definiowane są w obrębie kolejnego nowego znacznika — <AREA>. I tak, aby tą metodą zdefiniować wielokątny obszar z ćwiczenia 16.1, postać znacznika <AREA> byłaby następująca:

<area shape="POLY" coords="175,152, 203,118, 220,118, 247,152, 237,153, 237,181, 186,181, 186,153" href="/muzyka/glowna.html">

Typ zastosowanego kształtu obszaru jest deklarowany za pomocą atrybutu SHAPE, który może przyjmować wartości RECT (prostokąt), POLY (wielokąt) lub CIRCLE (okrąg). Współ­rzędne obszaru podawane są jako wartość atrybutu COORDS. Tak więc w przypadku kształtu POLY atrybut COORDS ma postać przedstawioną poniżej, gdzie pary x,y reprezentują wierzchołki wielokąta:

<area shape="POLY" coords="x1,y1,x2,y2,x3,y3,...,xN,yN" href="URL">

W przypadku kształtu RECT, współrzędne x1,y1 są współrzędnymi lewego górnego narożnika prostokąta, a x2,y2, jego prawego dolnego narożnika:

<area shape="RECT" coords="x1,y1,x2,y2" href="URL">

Dla wartości CIRCLE para x,y reprezentuje środek okręgu o określonym promieniu:

<area shape="CIRCLE" coords="x,y,promień" href="URL">

Ostatnim atrybutem, który należy podać w znaczniku <AREA> jest atrybut HREF. Atrybu­towi HREF może być przypisany dowolny adres URL, z którego zazwyczaj korzystasz, definiując element <A>, w tym także względne ścieżki dostępu. Możesz także przypisać mu wartość NOHREF, aby zdefiniować obszary obrazu, które nie zawierają połączeń do nowej strony.

Jeśli umieszczasz mapy odsyłaczy działające po stronie klienta w ramkach, warto dołączyć wewnątrz znacznika <AREA> dodatkowy atrybut TARGET, aby otwierać nową stronę w wybranym oknie. Oto pełny kod: <AREA SHAPE="RECT" COORDS="x1,y1,x2,y2" HREF="URL" TARGET="nazwa_okna">

W HTML-u 4.0 będziesz musiał podać jeszcze jeden atrybut. W rozdziale 7. dowiedziałeś się, w jaki sposób określać alternatywny tekst dla obrazu. W HTML-u 4.0 atrybut ALT znacznika <AREA> jest obowiązkowy. Atrybut ten zawiera tekst stanowiący krótki opis obszaru mapy odsyłaczy, który jest wyświetlany w momencie umieszczenia na nim wskaźnika myszy. Wykorzystując przykład wielobocznego obszaru z poprzedniego ćwiczenia, atrybut ALT został przedstawiony w ostatniej linii poniższego fragmentu kodu:

<area shape="poly" coords="175, 152, 203,118, 220,118, 247,152 237, 153, 237,181, 186,181, 186,153"

href="muzyka/glowna.html"

alt="Strona domowa mojej witryny muzycznej">

Atrybut USEMAP

Po zdefiniowaniu map odsyłaczy działających po stronie klienta za pomocą znacznika <MAP>, pozostaje jedynie umieścić obraz na stronie WWW. W tym celu do znacznika <IMG> należy dołączyć atrybut USEMAP (różni się on od atrybutu ISMAP stosowanego dla map odsyłaczy działających po stronie serwera). Poniżej przedstawiona jest postać znacznika z zastosowa­nym atrybutem USEMAP:

<img src="image.gif" usemap="#nazwamapy">

nazwamapy to nazwa mapy zdefiniowanej za pomocą znacznika <MAP NAME="nazwamapy">.

W przeciwieństwie do map odsyłaczy działających po stronie serwera, nie jest konieczne umieszczanie znacznika <IMG> w obrębie znacznika <A>. Atrybut USEMAP informuje bowiem przeglądarkę, że znacznik <IMG> zawiera mapy odsyłaczy.

Wartością atrybutu USEMAP jest standardowy adres URL. Dlatego właśnie przed wartością nazwamapy pojawia się znak #. Tak jak w przypadku połączeń prowadzących do umieszczonych na stronie WWW zakotwiczeń, symbol ten stanowi dla przeglądarki wskazanie, by szukała mapy o nazwie nazwamapy na bieżącej stronie. Jeśli jednak mapy odsyłaczy mają bardzo skomplikowaną postać, może być on zapisany w osobnym pliku HTML, do którego odwołania będą realizowane za pomocą standardowego URL.

Ćwiczenie 16.2: Zmodyfikowana szafa grająca

Aby zakończyć dyskusję na temat map odsyłaczy, spróbujmy teraz przekształcić mapy od­syłaczy z ćwiczenia 16.1 w mapy odsyłaczy działające po stronie klienta. Znamy już współrzędne i mamy adresy wywoływanych stron. Wszystko, co trzeba zrobić, to zapisać te dane w odpowiedniej postaci.

Dla obrazu przedstawiającego szafę grającą postacie znacznika <MAP> i stowarzyszonego z nim znacznika <AREA> są następujące:

<map name="jukebox">.

<area shape="RECT" coords="101,113, 165,134"

href="/muzyka/klasyka.html" alt="Muzyka klasyczna">

</map>

Inna jest także postać znacznika <IMG>. Zamiast atrybutu ISMAP pojawia się atrybut USEMAP, a sam znacznik nie jest zawarty w obrębie definicji połączenia:

<img src="jukebox.gif" usemap="#jukebox">

Teraz połącz wszystko razem i przetestuj. Oto przykład pliku HTML, który zawiera zarów­no znacznik <MAP>, jak i obraz, który z niego korzysta. Rezultat pokazany jest na rysunku 16.13.

	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/transitional.dtd"> <html> <head> <title>Super strona muzyczna</title> </head> <body bgcolor="#ffffff"> <div align="center"> <h1>Super strona muzyczna</h1> <p>Wybierz gatunek muzyki, której chcesz posłuchać.<br /> W przeglądarce pojawi się lista piosenek, które możesz wybrać.</p> <p> <img src="jukebox.gif" alt="Juke Box" usemap="#jukebox" width="425" height="242" /> <map name="jukebox"> <area shape="RECT" coords="101,113, 165,134" href="/muzyka/klasyka.html" alt="Muzyka klasyczna" /> <area shape="RECT" coords="101,139, 165,159" href="/muzyka/country.html" alt="Muzyka country" /> <area shape="RECT" coords="101,163, 165,183" href="/muzyka/rockpop.htmk" alt="Muzyka rock i pop" /> <area shape="POLY" coords="175,152, 203,118, 220,118, 247,152, 237,153, 237,181, 186,181, 186,153" href="/muzyka/glowna.html" alt="Strona domowa mojej witryny muzycznej" /> <area shape="RECT" coords="259,113, 323,134" href="/muzyka/swing.html" alt="Swing" /> <area shape="RECT" coords="259,139, 323,159" href="/muzyka/jazz.html" alt="Jazz" /> <area shape="RECT" coords="259,163, 323,183" href="/muzyka/gospel.html" alt="Muzyka gospel" /> <area shape="CIRCLE" coords="379,152, 21" href="/muzyka/pomoc.html" alt="Pomoc" /> </map> </p> <p> <a href="code/muzyka/glowna.html">Strona główna</a> | <a href="code/muzyka/klasyka.html">Klasyka</a> | <a href="code/muzyka/country.html">Country</a> | <a href="code/muzyka/rockpop.html">Rock/Pop</a> | <a href="code/muzyka/swing.html">Swing</a> | <a href="code/muzyka/jazz.html">Jazz</a> | <a href="code/muzyka/gospel.html">Gospel</a> | <a href="code/muzyka/pomoc.html">Pomoc</a></p> </div> </body> </html>
Rysunek 16.13. Ukończona Superstrona muzczna z mapą odsyłaczy

Tworzenie stron WWW
obsługujących oba typy map odsyłaczy

Choć mapy odsyłaczy działające po stronie przeglądarki są szybsze w działaniu i łatwiejsze w implementacji, niż ich odpowiedniki działające po stronie serwera, to jednak nie wszystkie przeglądarki są w stanie je obsługiwać. Wciąż używanych jest kilka starszych typów przeglądarek, które nie dysponują odpowiednimi możliwościami. Powoli jednak ich ilość staje się coraz mniejsza. Jeśli nie chcesz ryzykować, możesz stworzyć mapy odnośników działające zarówno w starszych, jak i nowszych przeglądarkach. Jak na razie, warto przygotować ich serwerowy ekwiwalent, a następnie tak zmodyfikować pliki HTML, aby współdziałały z obiema formami map odsyłaczy. W ten sposób Twoje strony będą równie dobrze działały w obu wypadkach.

Aby stworzyć mapy odsyłaczy, które, tam gdzie to możliwe, korzystają z obsługi po stronie klienta, ale powracają do obsługi przez serwer, gdy to konieczne, wykorzystaj następującą definicję:

<a href="http://www.lne.com/cgi-bin/imagemap/maps/jukebox.map">

<img src="jukebox.gif" ismap>

</a>

Jako część znacznika <IMG SRC="jukebox.gif" ISMAP> dodaj elementy typowe dla map odsyłaczy działających po stronie klienta:

<a href="http://www.lne.com/cgi-bin/imagemap/maps/jukebox.map">

<img src="jukebox.gif" usemap="#jukebox" ismap>

</a>

Oczywiście, plik myimage.map powinien być zainstalowany na serwerze, a definicja obrazu, przedstawiającego półkę z książkami w postaci znacznika <MAP>, musi się znaleźć gdzieś w dokumencie HTML.

Podsumowanie

W tym rozdziale nauczyłeś się dodawać mapy odsyłaczy do swoich stron WWW. Poznałeś różnice między mapami odsyłaczy działającymi po stronie serwera, a ich odpowiednikami działającymi po stronie klienta, w tym także te, które dotyczą możliwości obsługi przez różne przeglądarki. Potrafisz projektować obszary i wyznaczać ich współrzędne oraz tworzyć definicje mapy dla map odsyłaczy działających po stronie klienta. Powinieneś też bez trudu poradzić sobie z połączeniem map odsyłaczy, plików definicji map i programów obsługi dzia­łających na odpowiednim serwerze.

Rozdział zawiera mnóstwo informacji, więc, aby Ci pomóc w ich zapamiętaniu tabela 16.3 podsumowuje wszystkie znaczniki i atrybuty, które tu poznałeś.

Tabela 16.3.

Znaczniki HTML zaprezentowane w tym rozdziale

Znacznik	Atrybut	Opis zastosowania
<MAP>		Definiuje mapę dla map odsyłaczy działających po stronie klienta.
	NAME	Atrybut znacznika <MAP> definiujący nazwę mapy.
	USEMAP	Atrybut znacznika <IMG> stowarzyszający obraz z mapami odsyłaczy zdefiniowanymi za pomocą wyrażenia <MAP NAME="nazwamapy">, a działającymi po stronie klienta.
<AREA>		Pojedynczy obszar w obrębie elementu <MAP>.
	SHAPE	Określa typ obszaru.
	COORDS	Atrybut znacznika <AREA> określający punkty definiujące obszar.
	HREF	Atrybut znacznika <AREA> określający adres URL stowarzyszony z obszarem.
	NOHREF	Ten atrybut znacznika <AREA> określa region, którego kliknięcie nie spowoduje wykonania żadnych czynności (lub obszar, z którym nie jest skojarzony żaden adres URL).
	ALT	Wyświetla tekst alternatywny skojarzony z danym obszarem. (W HTML-u 4.0 atrybut ten jest obowiązkowy.)

Warsztat

Pod koniec tego rozdziału, podobnie jak wszystkich pozostałych, umieściłam Warsztat, stanowiący podsumowanie wszystkiego, czego się w tym rozdziale nauczyłeś. A w tym rozdziale dowiedziałeś się bardzo wiele! Na początku tego fragmentu znajdziesz kilka najczęściej zadawanych pytań dotyczących map odnośników (działających po stronie serwera oraz klienta) oraz odpowiedzi na nie. Pytania w części Quiz pozwolą Ci zapamiętać zalety i wady obu typów map odsyłaczy. Wreszcie na końcu zamieściłam dwa ćwiczenia, które mają za zadanie pomóc Ci w samodzielnym poeksperymentowaniu z mapami odsyłaczy.

Pytania i odpowiedzi

P. Czy do tworzenia map odsyłaczy będę potrzebował serwera? Chciałbym stworzyć mapy i przetestować je bez połączenia z Internetem, w taki sam sposób, w jaki tworzę i testuję zwyczajne pliki HTML.

O. Jeśli używasz map odsyłaczy działających po stronie przeglądarki, to będziesz mógł je stworzyć i przetestować lokalnie (oczywiście zakładając, że strony docelowe obszarów tej mapy także są stronami lokalnymi, wchodzącymi w skład tworzonej prezentacji). Jeśli jednak używasz map odsyłaczy działających po stronie serwera, to całą pracę związaną z tworzeniem i testowaniem mapy, będziesz musiał wykonywać na serwerze, a zatem, będziesz potrzebował połączenia z nim.

P. Moje mapy odsyłaczy działające po stronie serwera nie chcą funkcjonować poprawnie. Co się dzieje?

O. Oto kilka rzeczy, które powinieneś sprawdzić:

• upewnij się, że adresy URL podane w pliku mapy są bezwzględnymi ścieżkami dostępu, rozpoczynającymi się od głównego poziomu witryny i kończącymi wybranym plikiem docelowym obszaru. W pliku mapy nie można umieszczać adresów względnych. Jeśli, po podaniu bezwzględnych ścieżek dostępu, mapa dalej nie chce działać poprawnie, zastosuj pełne adresy URL (rozpoczynające się od określenia protokołu — http://),

• Upewnij się, że dołączając ścieżkę dostępu do pliku mapy do programu obsługującego mapy odsyłaczy, podałeś bezwzględną ścieżkę dostępu
  (taką jak w URL-u),

• Jeśli używasz NCSA, upewnij się, że korzystasz z najnowszej wersji skryptu imagemap. Żądania przesyłane do tego skryptu nie powinny powodować poszukiwania plików konfiguracyjnych.

P. Moje mapy odsyłaczy działające po stronie przeglądarki nie funkcjonują poprawnie. Co się dzieje?

O. Oto kilka sugestii.

• upewnij się, że ścieżki dostępu lub adresy URL podane w znacznikach <AREA> wskazują na istniejące pliki,

• upewnij się, że nazwa mapy podana w znaczniku <MAP> oraz nazwa podana w atrybucie USEMAP znacznika <IMG> odpowiadają sobie. Tylko nazwa podana w atrybucie USEMAP powinna się rozpoczynać znakiem „#”.

Quiz

1. Co to jest mapa odsyłaczy?

2. Jakie są dwa rodzaje map odsyłaczy i jakie są zalety i wady każdego z nich?

3. Dlaczego warto umieszczać na stronie tekstowe wersje połączeń zdefiniowanych na mapie odsyłaczy?

4. Prawda czy fałsz? Podając docelowe adresy URL w pliku mapy odsyłaczy, można podać względne adresy URL.

5. Jakie są trzy elementy konieczne do stworzenia mapy odsyłaczy działającej po stronie przeglądarki? Które z nich są także potrzebne przy tworzeniu mapy odsyłaczy działającej po stronie klienta.

Odpowiedzi

1. Mapa odsyłaczy to specjalny obraz zawierający specjalne obszary wskazujące na różne strony WWW.

6. Przeważająca większość serwerów umożliwia korzystanie z map odsyłaczy obsługiwanych na serwerach. W tym przypadku przeglądarka nie zna stron docelowych zdefiniowanych obszarów. Map odsyłaczy tego typu nie można testować lokalnie. Poza tym, czas reakcji takiej mapy na kliknięcie jest znacznie dłuższy.

7. Mapy odsyłaczy działające po stronie przeglądarki nie stwarzają konieczności użycia specjalnego programu i działają szybciej, gdyż całe przetwarzanie mapy jest wykonywane przez przeglądarkę. Ten rodzaj map jest aktualnie wykorzystywany przez przeważającą większość projektantów. Nie wszystkie przeglądarki są w stanie obsługiwać mapy odsyłaczy tego typu (choć wraz ze spadkiem ilości osób korzystających ze starych wersji przeglądarek, staje się to coraz mniejszym problemem).

8. Warto umieszczać na stronie WWW tekstowe wersje łączy zdefiniowanych na mapie odsyłaczy, na wypadek gdyby stronę odwiedziły osoby posługujące się przeglądarkami tekstowymi lub osoby, które w przeglądarce wyłączyły pobieranie obrazów. Dzięki temu, osoby te wciąż będą mogły skorzystać z połączeń umieszczonych na stronie i odwiedzić inne części witryny.

9. Fałsz. URL-e umieszczane w pliku mapy muszą być bezwzględnymi ścieżkami dostępu rozpoczynającymi się od głównego poziomu witryny. Nie mogą być to adresy względne, podawane względem pliku mapy.

10. Aby stworzyć mapę odsyłaczy działającą po stronie serwera, będzie Ci potrzebny obraz, plik mapy odsyłaczy oraz program obsługi map przechowywany i wykonywany na serwerze. W przypadku wykorzystania map odsyłaczy działających po stronie przeglądarki ani plik mapy, ani program obsługi map nie będą potrzebne. W tym przypadku wszystkie informacje konieczne do poprawnego działania mapy odsyłaczy są umieszczane bezpośrednio w dokumencie HTML i przetwarzane przez przeglądarkę dysponującą odpowiednimi możliwościami.

Ćwiczenia

1. Utwórz i przetestuj prostą mapę odsyłaczy zawierającą łącza do stron znajdujących się w różnych katalogach witryny lub do zupełnie innych witryn WWW.

2. Utwórz i przetestuj mapę odsyłaczy działającą po stronie przeglądarki, którą możesz umieścić na swojej stronie domowej lub na stronie początkowej którejś z głównych części swojej witryny. Pamiętaj, aby udostępnić alternatywny sposób nawigacji dla osób korzystających z przeglądarek tekstowych lub ze starszych modeli przeglądarek, które nie obsługują map odsyłaczy. Jeśli lubisz wyzwania, to utwórz drugą wersję mapy odsyłaczy działającą po stronie serwera.

476 Część 6. Mapy odsyłaczy i formularze

Rozdział 16. Tworzenie i stosowanie map odsyłaczy 475

washington.html

minnesota.html

ohio.html

california.html

alaska.html

texas.html

floryda.html

punkt

Obszar wieloboczny

Obszar prostokątny

Obszar o kształcie koła

Obszar prostokątny

(0,0)

(229,66)

(276,19)

(332,19)

(263,94

(332,94

Obszar o kształcie koła

Obszar wieloboczny

punkt

Promień koła = 66 pikseli

Środek

Okrąg

Prawy, dolny (440,318)

Prostokąt

Lewy, górny (342,19)

Prostokąt

(0,0)

Wielobok

1

2

3 4 7 6

5

8

---