Rozdział 6. Połączenia
Uniform Resource Locator
Co to jest URL?
Uniform Resource Locator (URL) to adres dokumentu (lub innych zasobów) w sieci WWW.
Ogólna postać adresu WWW, na przykład: http://www.mojastrona.com/html/strona.htm
spełnia następujące reguły składni:
protokół://host.domena:port/ścieżka/nazwa_pliku
Co oznaczają poszczególne elementy adresu URL?
Nazwa protokołu określa typ usługi internetowej w przypadku stron WWW jest to
http. Inne nazwy to na przykład file, ftp, gopher, news, telnet.
Domena to nazwa domeny internetowej, na przykład microsoft.com.
Host to oczywiście host domeny. Domyślnym hostem dla http jest www.
:port definiuje numer portu hosta zazwyczaj go pomijamy. Domyślny numer dla
serwerów http to 80.
Ścieżka określa ścieżkę dostępu na serwerze. Jeśli nie jest podana, dokument musi
znajdować się w katalogu głównym witryny WWW.
Nazwa pliku definiuje nazwę dokumentu. Nazwa domyślna to index.html lub
default.asp, co zależy od ustawień serwera sieciowego.
Ulokowanie dokumentu a ścieżka dostępu
Zrozumienie relacji między adresem lokalnym dokumentu, w którym połączenie jest tworzone, a
adresem dokumentu, do którego ono prowadzi, jest niezwykle istotne z punktu widzenia
zrozumienia procesu definiowania połączeń.
Jakie są rodzaje ścieżek dostępu?
Każda strona WWW ma swój unikatowy adres URL (ang. Uniform Resource Locator). Jednak w
przypadku połączeń lokalnych a więc z dokumentu do dokumentu tej samej witryny nie ma
potrzeby wprowadzania całego adresu URL. Wystarczy określić położenie pliku względem
dokumentu bieżącego lub względem katalogu głównego witryny.
Ścieżki dostępu mogą być więc następujące:
bezwzględne (np. http:/www.magsoft.com.pl/~rsokol/nmr/index.html)
względne
o zdefiniowane względem dokumentu (np.katalog/katalog.html)
o zdefiniowane względem foldera głównego (np. /katalog/katalog.html)
Co to jest adres bezwzględny?
Adres bezwzględny to po prostu pełny adres URL, wraz z nazwą protokołu. Jeśli więc odwołujesz
się do dokumentu na innym serwerze, musisz podać pełny adres. Lokalnie nie ma potrzeby
definiowania połączeń absolutnych jest to wręcz szkodliwe.
Kiedy i jak korzystać z adresów względnych definiowanych względem dokumentu?
Adresy zdefiniowane względem dokumentu to najlepsze rozwiązanie dla prezentacji lokalnych.
Szczególnie wówczas, gdy dokumenty bieżący oraz te, których prowadzą połączenia znajdują
się w jednym folderze. Nawet jeśli są w innym, wystarczy wskazać hierarchię folderów startując
od bieżącego dokumentu.
Tak więc, w przypadku odwoływania się do dokumentu w tym samym folderze wystarczy podać
nazwę pliku. Jeśli odwołanie ma prowadzić do dokumentu w folderze podrzędnym, adres składa
się z nazwy foldera podrzędnego i nazwy pliku rozdzielonych prawym ukośnikiem.
Jak definiować adresy względne?
Oto przykłady adresów względnych:
Aby utworzyć połączenie prowadzące od pliku a1.html do pliku a2.html w tym
samym folderze A, wystarczy podać nazwę pliku: a2.html (patrz rysunek 6.1).
Rys. 6.1.
Połączenie z pliku a.html
do pliku b.html
umieszczonego w folderze
podrzędnym B
Aby utworzyć połączenie z pliku a.html do pliku b.html (umieszczonego w folderze
podrzędnym B), zdefiniuj adres względny: B/b.html (patrz rysunek 6.2).
Rys. 6.1.
Połączenie z pliku a.html
do pliku b.html
umieszczonego w folderze
podrzędnym B
Aby utworzyć połączenie od pliku b.html (folder podrzędny B) do pliku a.html (folder
nadrzędny A), zdefiniuj adres jako ../a.html (../ oznacza przejście o poziom wyżej w
hierarchii folderów).
Rys. 6.2.
Połączenie z pliku b.html
do pliku a.html
umieszczonego w folderze
nadrzędnym A
Aby utworzyć połączenie z pliku c.html (folder podrzędny C) do pliku b.html (w
innym folderze podrzędnym, o nazwie B), zdefiniuj adres jako ../B/b.html (../
spowoduje przejście do foldera nadrzędnego, a / przejście w dół hierarchii, do foldera
podrzędnego B).
Rys. 6.3.
Połączenie z pliku c.html
do pliku b.html oba w
folderach podrzędnych
względem A
W przypadku przesuwania całej grupy plików, bez naruszania powiązań między nimi, połączenia
względne nie wymagają aktualizacji. Przesunięcie pojedynczych plików taką konieczność
spowoduje.
Co to są adresy względne definiowane względem foldera nadrzędnego?
W tym przypadku adres pliku to ścieżka dostępu od foldera nadrzędnego witryny do dokumentu.
Adres rozpoczyna się od ukośnika, który oznacza folder witryny. Adres tego rodzaju: /A/a.html
jest adresem pliku a.html z foldera A, który jest folderem podrzędnym foldera całej witryny.
Korzystanie z tego typu adresów jest trudniejsze. Jeśli sprawia Ci ono kłopot, stosuj adresowanie
względem dokumentu.
Ten typ adresowania sprawdza się najlepiej, gdy pliki witryny są często przemieszczane. Jeśli
połączenia zostały zdefiniowane względem foldera prezentacji, zachowają swoją poprawność.
Połączenia definiowane względem foldera nadrzędnego są interpretowane przez serwery, a nie
przeglądarki.
Definiowanie połączeń
Połączenie to narzędzie nawigacji, które możesz wbudować w swoje strony, aby umożliwić
czytelnikom przemieszczanie się do innych miejsc na tej samej stronie, do innych stron w obrębie
prezentacji lub do zupełnie obcych, lecz ciekawych stron w sieci. Funkcję połączenia może pełnić
wyraz, fraza, a nawet obraz.
Jaki znacznik HTML umożliwia utworzenie połączenia?
Znacznik HTML, za pomocą którego tworzone jest połączenie nosi nazwę znacznika
zakotwiczenia i ma taką postać:
Tekst połączeniaZnacznik ten oprócz atrybutu href może mieć także inne atrybuty.
Co umożliwiają połączenia?
Zanim zabierzemy się za definiowane połączeń, jeszcze kilka istotnych informacji na temat
połączeń. Ich możliwości są ogromne:
Połączenia mogą prowadzić do innych dokumentów, w tym również do obrazów, plików
dzwiękowych, sekwencji wideo.
Zakotwiczenia można definiować także w obrębie tej samej strony WWW (jeśli
oznaczysz w dokumencie cele, będziesz mógł sterować sposobem odbioru strony).
Dzięki połączeniom e-mail (które już poznałeś), ułatwisz użytkownikom nawiązanie
kontaktu.
Listy menu to nic innego jak listy połączeń stanowiące ciekawy element strony.
Połączenia skryptowe pozwalają przypisać obiektom określone zachowanie. Powodują
one wykonanie określonego kodu języka JavaScript.
Jak wygląda połączenie?
Wiesz to na pewno. Połączenia mają postać niebieskiego podkreślonego tekstu (w przypadku, gdy
są tekstowe), którego kliknięcie wywołuje określoną akcję przejście do wskazanego miejsca.
Strona WWW, do której prowadzi kliknięte połączenie zostanie wyświetlona w bieżącym oknie
przeglądarki, chyba że ustawienia dodatkowe stanowią inaczej.
Na rysunku 6.4 pokazany jest przykład strony, która z racji funkcji zbudowana jest w znacznej
mierze z połączeń.
Rys. 6.4.
Oto portal
internetowy, w
którym połączenia
pełnią dominującą
rolę
Do tworzenia połączeń służy, jak się już dowiedziałeś, para znaczników
. Element a
nazywa się zakotwiczeniem. Podstawowym jego atrybutem jest href Hypertext REFerence.
Jak definiować atrybut href?
Wartością atrybutu href jest adres URL (Uniform Resource Locator). W najprostszej sytuacji,
gdy obie łączone strony znajdują się w tym samym katalogu, stosuje się tylko nazwę pliku.
Na przykład:
Wyświetl
dodatkowe informacje na ten temat.
Znacznik
definiuje też styl powoduje podkreślenie tekstu i zmianę jego koloru na niebieski.
Można go umieszczać w dowolnym elemencie HTML. Z oczywistych względów nie można
zagnieżdżać znaczników w sobie.
Struktura adresu URL zgodna jest z formatami systemu UNIX. Oznacza to, że wszystkie nazwy i
ścieżki dostępu są czułe na wielkość znaku (za wyjątkiem nazw komputerów i adresów e-mail).
Aby utworzyć połączenie do pliku w katalogu podrzędnym bieżącego pliku, należy skorzystać z
prawego ukośnika, /, który umieszczany jest między nazwą katalogu a nazwą pliku. Oto przykład:
Lista
moich publikacji wydanych w 1999r.
Aby odwołać się do pliku w katalogu nadrzędnym, zastosujesz taką oto składnię:
Powrót do
Spisu treści.
W tym przypadku wykorzystywane są ścieżki względne. Ścieżki bezwzględne zawsze
rozpoczynają się od ukośnika, co różni je od ścieżek względnych. Po ukośniku pojawiają się
nazwy wszystkich katalogów, od katalogu najwyższego poziomu po nazwę pliku, do którego
tworzone jest łącze.
Adresowanie względne jest wygodniejsze i bezpieczniejsze umożliwia swobodne przenoszenie
stron między katalogami i systemami.
Jeśli w adresie URL na końcu nie pojawia się nazwa pliku (a jedynie nazwa katalogu), serwer
będzie szukał pliku o nazwie domyślnej najczęściej jest to plik index.html. Jeśli nie znajdzie
takiego pliku, zwróci listę plików w katalogu.
Do czego służy atrybut name?
Innym ważnym atrybutem elementu a jest atrybut name. Stosowany jest on do zdefiniowania
odnośnika:
Terminy i definicjeWartością tego atrybutu jest słowo kluczowe. W przeciwieństwie do połączeń, odnośniki nie są
widoczne na stronie. Żeby skierować połączenie na wybrany odnośnik, skorzystamy z elementu
o podobnej składni jak w przypadku zwykłych połączeń. Przed nazwą należy jednak dodać
znak #:
Patrz Dodatek A.
Zakotwiczenia o zdefiniowanych nazwach są często stosowane do utworzenia czegoś w rodzaju
spisu treści strony WWW w poszczególnych sekcjach dokumentu umieszczane są
zakotwiczenia o zdefiniowanych nazwach, a na początku strony pojawiają się połączenia do
oznaczonych nazwami fragmentów.
Co to jest połączenie e-mail?
Specjalne połączenie także je już poznałeś umożliwia czytelnikowi przesłanie listu e-mail do
autora strony. Składnia jest tutaj następująca:
Wyślij do mnie listCzy można wskazać miejsce otwieranego połączeniem dokumentu?
Kliknięcie połączenia poprowadzi Cię do dokumentu, który jest dostępny pod adresem
wskazanym przez atrybut href. Dokument ten wyświetlony zostanie w bieżącym oknie Twojej
przeglądarki, zastępując wcześniejszą zawartość. Czy możemy to zmienić? Jak najbardziej. Służy
do tego atrybut target.
Atrybut ten może przyjmować jedną z czterech wartości: _blank, _parent, _self (jest to
wartość domyślna) lub _top. Szczegółowy opis wpływu poszczególnych ustawień znajdziesz w
dodatku A. Najczęściej wykorzystuje się wartość _blank, która pozwala otwierać nową stronę w
nowym oknie.
Jeśli chcesz otworzyć stronę w nowym oknie, postać kodu html jest następująca:
Odwiedz tę
stronę!W dalszej części rozdziału poświęcimy atrybutom znacznika
więcej miejsca. Sprawdzimy
różne sposoby jego wykorzystania w dokumentach html.
Definiowanie połączenia do innej strony
Zaopatrzony we wstępne informacje na temat tworzenia połączeń możesz spróbować utworzyć
połączenie prowadzące ze strony głównej do innego dokumentu html.
Jak zdefiniować połączenie do innej strony tej samej witryny?
Witryna to zestaw kilku stron powiązanych ze sobą połączeniami. Jedna ze stron pełni w niej rolę
centrum dowodzenia nazywamy ją stroną główną, ale wielu użytkowników stosuje też określenie
strona domowa. Zazwyczaj strona główna zawiera informacje ogólne, które rozwijane są na
stronach podrzędnych.
Aby zdefiniować połączenie spinające dwie strony, musimy więc zacząć od przygotowania dwóch
plików html. Wykorzystamy w naszych eksperymentach z połączeniami stronę o zwierzakach, z
poprzedniego rozdziału. To będzie strona główna. Strona podrzędna będzie zawierała dodatkowe
informacje na temat określony tekstem połączenia.
Przyjrzyj się postaci strony WWW i zastanów się, w jakich miejscach chciałbyś umieścić
połączenia (patrz rysunek 6.5).
Rys. 6.5.
Przekształcimy
w połączenia
nazwy
gatunków kotów
będą
prowadziły do
stron
poświęconych
im konkretnie
Wybierz fragmenty tekstu, które w najbardziej reprezentatywny sposób będą charakteryzowały
punkt docelowy. W przykładzie przekształcimy w połączenia nazwy gatunków kotów, na razie
wyróżnione czcionką pogrubioną połączenia te poprowadzą do stron poświęconych im
tematycznie.
Wyświetl w oknie edytora kod zródłowy swojej strony głównej kod tego przykładowego
dokumentu znajdziesz w rozdziale 5., na wydruku 5.2. Zamień w nim wszystkie elementy b na
elementy a, zgodnie ze składnią:
Tekst połączeniaOczywiście jeśli w swoim pliku nie stosowałeś znaczników
, obejmij znacznikami
żądany tekst.
Wartościami atrybutu href będą nazwy poszczególnych plików html, do których wiodą
połączenia (tak będzie, jeśli wszystkie podrzędne pliki html umieścisz w tym samym folderze, w
którym znajduje się plik strony głównej patrz rozważania na temat adresowania, na początku
rozdziału). Przygotuj pliki html w taki sam sposób jak plik strony głównej i zapisz.
Zapisz kod strony głównej i sprawdz działanie połączeń wczytując stronę główną do przeglądarki i
klikając je (patrz wydruk 6.1 oraz rysunki 6.6 i 6.7).
Wydruk 6.1. Połączenia prowadzące ze strony głównej do stron podrzędnych
Zwierzaki
height="100">Koty duże
Lwa, tygrysa,
panterę, geparda i
jaguara nazywamy wielkimi kotami.
Należą do gromady ssaków, rzędu drapieżnych, rodziny kotowatych
(Felidae). Do tej rodziny należą też małe koty: ryś, ocelot,
serwal. W sumie rodzina kotowatych obejmuje 40
gatunków zwierząt. Samce są większe od samic. Wszystkie mruczą, gdy są
zadowolone. Rozzłoszczone - powarkują, prychają. Tylko wielkie koty
potrafią ryczeć.
height="75"> Koty małe
Kot domowy najprawdopodobniej pochodzi
od dwóch gatunków: od
kota nubijskiego (Felis silvestris
lybica) i od
azjatyckiego kota stepowego (Felis
silvestris ornata).
Do dziś nie wiadomo dokładnie kiedy i jak kot stał się zwierzęciem
domowym. Jednak najczęściej wymienia się okres około 5000 lat temu. Miało
to miejsce w dolinie Nilu.
Rys. 6.6.
Wszystkie
nazwy zostały
przekształcone
w połączenia do
innych
dokumentów
html tej samej
witryny
Rys. 6.7.
Kliknięcie
połączenia
powoduje
wyświetlenie w
oknie
przeglądarki
pliku
kot_domowy.ht
ml
Jak zdefiniować połączenie do zewnętrznej strony?
Połączenia do stron WWW znajdujących się na innych serwerach definiuje się korzystając z tego
samego elementu a. Cała tajemnica tkwi w adresie url, który musi być w tym przypadku pełny.
Jeśli więc chcesz umieścić na swojej stronie połączenie prowadzące do innej interesującej strony,
spoza Twojej witryny, musisz jako wartość atrybutu href podać adres bezwzględny witryny. Na
wydruku znajdziesz proste porównanie kodu html definiującego połączenie lokalne z
odpowiednim kodem dla połączenia zewnętrznego. Zwróć uwagę, że na ekranie nie ma różnicy
(patrz rysunek 6.8).
Wydruk 6.2. Połączenia lokalne i zewnętrzne
Połączenia lokalne i zewnętrzne
Ten fragment tekstu to połączenie do innej strony tej samej witryny.
Ten fragment tekstu to połączenie prowadzące do witryny Microsoft.
Rys. 6.8.
Połączenia
lokalne nie
różnią się
wyglądem od
zewnętrznych
Czy można dowiedzieć się pod jaki adres URL prowadzą połączenia?
Podglądając postać zródłową strony WWW dowiesz się jak zdefiniowano na niej połączenia. Jest
jednak prostsza metoda. Wystarczy spojrzeć na pasek stanu, z lewej strony (patrz rysunek 6.9).
Rys. 6.9.
Na pasku stanu
wyświetlany jest
adres URL
wskazywanego
myszką
połączenia
Jak wrócić do strony głównej?
Element a pozwala zdefiniować połączenie, które poprowadzi Cię do innego dokumentu html
Twojej witryny. A jak z niego wrócić?
Jeśli chcesz tworzyć poprawne technicznie strony WWW, nie możesz skazywać czytelnika
Twoich stron na korzystanie z przycisków nawigacyjnych przeglądarki. Zaplanowanie
odpowiedniego systemu nawigacji między stronami jest tym ważniejsze, że daje Ci on możliwość
sterowania sposobem przeglądania stron, co zwiększa prawdopodobieństwo skutecznego przekazu
informacji.
Co to oznacza? Oznacza mianowicie, że na wszystkich stronach witryny powinieneś wstawić
połączenia prowadzące do strony głównej, a w idealnym przypadku także do pozostałych stron.
Czy obraz może być połączeniem?
Jak wiesz, nie tylko tekst może zostać przekształcony w połączenie. Równie dobrze nadają się do
tego celu obrazy. Ikony nawigacyjne zamiast zwykłych połączeń na pewno uatrakcyjnią Twoje
strony. Mogą one mieć na przykład postać przycisków lub niewielkich obrazków jest to kwestia
Twojej inwencji. Odpowiednie ikony znajdziesz wśród rysunków dołączonych do pakietu
Microsoft Office lub możesz je sam przygotować.
Posłużmy się takim obrazkiem, aby utworzyć graficzne połączenie pozwalające powrócić do
strony głównej.
Składnia wyrażenia przekształcającego obraz w połączenie jest podobna jak w przypadku tekstu:
Element a obejmuje tym razem znacznik
a nie tekst.
Przygotuj lub wybierz plik .GIF lub .JPG, który chcesz zastosować jako ikonę nawigacyjną.
Otwórz plik. Oddziel treść strony od menu ikon nawigacyjnych linią poziomą (użyj w tym celu
znacznika
).
Dodaj na początku lub na końcu strony połączenie do strony głównej. Oto odpowiedni kod (patrz
wydruk 6.3):
Wydruk 6.3. Ikona nawigacyjna
Kot domowyKOT DOMOWY (Felis domestica) pochodzi od dzikich gatunków kotów (m.in.
od żbika). Istnieje wiele ras i odmian barwnych kotów, a główne rasy to:
kot syjamski krótkowłosy o długiej, proporcjonalnej głowie z dużymi,
szeroko rozstawionymi uszami i skośnymi, niebieskimi oczami, oraz kot
perski długowłosy o okrągłej, masywnej głowie z małymi, zaokrąglonymi
na końcach uszami i dużymi, okrągłymi, zwykle pomarańczowymi oczami.
Długość ciała kota to 70 80 cm, ogona 25 35 cm, masa ciała ok. 3 5 kg
(wyjątkowo nawet do 20 kg). Koty osiągają dojrzałość płciową w 6 10
miesiącu życia. Ruja występuje u kotek 2 3 razy w roku, a ciąża trwa ok.
60 dni. Zazwyczaj rodzi się od 4 8 młodych.
Oto obraz, który pełni rolę połączenia powrotnego:
strony głównej >
W tym przypadku kod został dodany na końcu strony. Zwróć uwagę, że obok ikony umieszczono
też tekst opisujący dokąd prowadzi obraz-połączenie. Taki tekst można także przekształcić w
połączenie. W naszym przykładzie ma on jedynie aspekt informacyjny. Ponieważ skorzystaliśmy z
obrazu, możemy też dołączyć dodatkowe informacje definiując za pomocą atrybutu alt tekst
alternatywny (patrz rysunek 6.10).
Rys. 6.10.
Ikona dodana na
końcu strony
pozwala powrócić
do strony głównej
bez konieczności
korzystania z
przycisków
nawigacyjnych
przeglądarki
Odnośniki
Jak już wspominałam, odnośniki zakotwiczenia o zdefiniowanych nazwach tworzy się przy
użyciu tego samego znacznika
, który poznaliśmy przy okazji połączeń. Zamiast atrybutu
href stosowany jest tu atrybut name. Atrybut ten zawiera słowa kluczowe, które będą stanowiły
nazwę odnośnika:
tekstŻeby skierować połączenie na wybrany odnośnik, musimy utworzyć zwykłe połączenie, z tym
że wartością atrybutu href jest w tym przypadku nazwa odnośnika poprzedzona znakiem #.
inny tekst Jakie może być zastosowanie odnośników?
Zdarza się, że strona zawiera omówienie jakiegoś zagadnienia (jest na przykład instrukcją obsługi
lub zawiera wybrane fragmenty literackie). W takich obszernych tekstowo stronach przydatna jest
komunikacja wewnętrzna, która umożliwi czytelnikowi przechodzenie do wybranych tematów
oraz powrót.
W przełożeniu na język praktyki chodzi tu o umieszczenie na początku dokumentu czegoś w
rodzaju spisu treści strony, którego pozycje będą prowadziły do kolejnych fragmentów. Z tej
samej opcji można skorzystać definiując połączenie prowadzące na początek strony.
Jak zdefiniować odnośniki?
Utworzymy prosty plik, w którym zbudujemy spis treści strony. Na początku dokumentu pojawią
się połączenia prowadzące do umieszczonych gdzieś w tekście zakotwiczeń o zdefiniowanych
nazwach. Po przeanalizowaniu wydruku 6.4, bez trudu złapiesz, o co w tego typu konstrukcji
chodzi. Zapisz swój plik, wczytaj stronę do przeglądarki i sprawdz działanie odnośników (patrz
rysunek 6.11).
Wydruk 6.4. Definiujemy odnośniki
Spis treści
Do rozdziału 1.
Do rozdziału 2.
Do Rozdziału 3.
Do rozdziału 4.
Do rozdziału 5.
Do rozdziału 6.
Do rozdziału 7.
Rozdział 1
Ten rozdział zawiera bla bla bla bla
Rozdział 2
Ten rozdział zawiera bla bla bla bla
Rozdział 3
Ten rozdział zawiera bla bla bla bla
Rozdział 4
Ten rozdział zawiera bla bla bla bla
Rozdział 5
Ten rozdział zawiera bla bla bla bla
Rozdział 6
Ten rozdział zawiera bla bla bla bla
Rozdział 7
Ten rozdział zawiera bla bla bla bla
Rys. 6.11.
Strona, na której utworzony
został spis treści kliknięcie
pozycji spisu przeniesie Cię
do odpowiedniego rozdziału
Jak wykorzystać odnośniki do przechodzenia na początek strony?
Oczywiście w tym przypadku obowiązuje ten sam mechanizm. Spróbujmy jednak troszeczkę
utrudnić sobie życie i przygotujmy obraz-połączenie.
Scenariusz jest następujący: gdzieś na początku strony, na przykład w elemencie h1 (w
przykładowym pliku jest on pierwszym elementem zawartości) umieścimy zakotwiczenie o
zdefiniowanej nazwie; na końcu strony wstawimy element a, w którym atrybut href ma wartość
odpowiadającą nazwie zakotwiczenia ze znakiem #. I to wszystko. Wydruk 6.5 zawiera przekład
tego, co powiedzieliśmy na język HTML. Odpowiednie fragmenty kodu zostały wyróżnione
czcionką pogrubioną. Pamiętaj, aby umieścić obraz stanowiący połączenie na początek strony w
odpowiednim folderze!
Wydruk 6.5. Powrót na początek strony
Kot domowyPochodzi od dzikich gatunków kotów (m.in. od żbika). Istnieje wiele
ras i odmian barwnych kotów, a główne rasy to: kot syjamski - krótkowłosy
o długiej, proporcjonalnej głowie z dużymi, szeroko rozstawionymi uszami
i skośnymi, niebieskimi oczami, oraz kot perski - długowłosy o okrągłej,
masywnej głowie z małymi, zaokrąglonymi na końcach uszami i dużymi,
okrągłymi, zwykle pomarańczowymi oczami.
Długość ciała kota to 70-80 cm, ogona 25-35 cm, masa ciała ok. 3-5 kg
(wyjątkowo nawet do 20 kg). Koty osiągają dojrzałość płciową w 6-10
miesiącu życia. Ruja występuje u kotek 2-3 razy w roku, a ciąża trwa ok.
60 dni. Zazwyczaj rodzi się od 4-8 młodych.
Oto obraz, który jest połączeniem powrotnym:
Oto obraz, który prowadzi na początek strony:
Rysunek 6.12 prezentuje nasz nowy element nawigacji w obszarze strony.
Rys. 6.12.
Strona, na której utworzony
został spis treści kliknięcie
pozycji spisu przeniesie Cię
do odpowiedniego rozdziału
Więcej o obrazach pełniących funkcję
połączeń
Ja wykorzystać ikony do prezentacji obrazów?
Często na stronie umieszcza się ikonę obrazu obrazek o niewielkich rozmiarach, i konfiguruje ją
jako połączenie prowadzące do zewnętrznego pliku zawierającego obraz. Zmniejsza to rozmiar
strony, skraca czas jej ładowania i daje czytelnikowi swobodę w podejmowaniu decyzji odnośnie
ściągania pliku.
Jeśli chciałbyś skorzystać z tego sposobu, przygotuj miniaturę obrazu i zapisz rozmiar takiego
pliku jest o jeden rząd wielkości mniejszy od pliku obrazu. Umieść ikonę na stronie i przekształć
ją w połączenie prowadzące do pliku zawierającego obraz w pełnych wymiarach. Można tu
wykorzystać w połączeniu atrybut target znacznika
, aby obraz oryginalny był wyświetlany w
nowym oknie. Kod strony przedstawiony jest na wydruku 6.6, a efekt jego działania na rysunku
6.13.
Wydruk 6.6. Stosowanie pomniejszonych obrazów jako połączeń do większych odpowiedników
Koty
Kot w worku
Rys. 6.13.
Ikona jest tu połączeniem
prowadzącym do
zewnętrznego pliku obrazu;
dzięki użyciu atrybutu target
z wartością _blank obraz jest
wyświetlany w nowym oknie
Jak dodać do ikon informacje o wielkości plików?
Do ikon zapraszających użytkownika do ściągnięcia obrazu można dołączyć informację o
wielkości pliku. Ta sama metoda może posłużyć do podłączania także innych plików,
niekoniecznie graficznych.
Wydruk 6.7. Informacja o plikach
KotyKot w worku
Rys. 6.14.
Miniatura może zachęcać do
wyświetlenia obrazu;
informacja o rozmiarze pliku
będzie cenna dla tych, którzy
chcą obraz ściągnąć
Co to są mapy odsyłaczy?
Mapy odsyłaczy to obrazy, które pełnią funkcje wielu połączeń jednocześnie. Kliknięcie zwykłego
połączenia tekstowego czy też w postaci obrazu prowadzi pod konkretny adres URL z nim
stowarzyszony. W przypadku obrazu zdefiniowanego jako mapa odsyłaczy, adres docelowy
będzie zależny od obszaru obrazu, w którym nastąpiło kliknięcie.
Mapy odsyłaczy działające po stronie klienta stanowią element specyfikacji HTML 3.2. Ze
względu na swoją naturę działają tylko w przeglądarkach graficznych. W tekstowych, na przykład
w przeglądarce Lynx, nie będzie ani obrazu, ani jego funkcji nawigacyjnych. Musisz więc
utworzyć ekwiwalent tekstowy obrazu, dzięki któremu użytkownicy przeglądarek tekstowych nie
stracą dostępu do strony.
Mapy odsyłaczy mogą z powodzeniem być stosowane jako centra nawigacji na stronach
głównych.
Jak przygotować mapę odsyłaczy?
Proces przygotowania mapy odsyłaczy działającej po stronie klienta składa się z następujących
etapów:
1. Wybór obrazu obraz powinien zawierać odrębne wizualnie obszary, aby
definicje połączeń mogły być jednoznaczne.
2. Przygotowanie definicji mapy:
Naszkicuj obraz i podziel go ręcznie na obszary (obszar może być prostokątem,
wielokątem lub okręgiem).
Wyświetl obraz w oknie programu do obróbki grafiki (np. może być to program Paint
Shop Pro) i zanotuj współrzędne wskaznika myszki w punktach krańcowych obszarów.
W przypadku prostokąta, będą to współrzędne lewego górnego wierzchołka i prawego
dolnego; w przypadku okręgu współrzędne jego środka i długość promienia. Jeśli
obszar jest wielokątem, zanotuj współrzędne wszystkich wierzchołków.
Przygotuj adresy URL (lub odsyłacze działające w obrębie strony), z którymi
stowarzyszysz poszczególne obszary.
3. Umieszczenie mapy odsyłaczy w dokumencie HTML służy do tego znacznik