R-05, ## Documents ##, HTML 4 - Czrna księga WebMastera


Rozdział 5.

Wszystko o połączeniach

Po zakończeniu lektury poprzedniego rozdziału powinieneś mieć już kilka gotowych stron z nagłówkami, jakimś tekstem i listami. Strony te są jak najbardziej poprawnie zbudowane, ale raczej mało interesujące. Prawdziwa zabawa zacznie się wtedy, gdy nauczysz się two­rzyć połączenia hipertekstowe i włączać strony do sieci WWW. W tym rozdziale będziemy uczyć się właśnie tego, a konkretnie:

Tworzenie hiperpołączeń

Do utworzenia połączenia w języku HTML potrzebne są następujące informacje:

Na stronie widoczna będzie tylko ta druga część. Gdy czytelnik wybierze ją za pomocą myszy lub w jakiś inny sposób, przeglądarka odczyta z pierwszej części adres pliku, do którego powinna „przeskoczyć”.

Znacznik <A>

Do kreowania hiperpołączeń na stronach HTML służy znacznik <A>...</A>. Jest często nazywany odnośnikiem, bowiem może być również używany do tworzenia spec­jalnych miejsc wewnątrz stron, do których prowadzą inne połączenia (więcej na ten temat opowiem w dalszej części rozdziału). Jednakże, najpowszechniejszym zastosowaniem tego znacznika są hiperpołączenia i tym tematem zajmiemy się w tej chwili.

W przeciwieństwie do prostych znaczników, o których mówiliśmy w poprzednim rozdziale, możliwości <A> są nieco szersze. Znacznik otwierający <A> oprócz nazwy („A”) zawiera szczegółowe informacje o połączeniu. Te dodatkowe cechy nazywane są atrybutami znacznika (po raz pierwszy zetknąłeś się z atrybutami przy omawianiu list w poprzednim rozdziale „Zaczynamy od podstaw”). Rozszerzony znacznik połączenia <A> wygląda następująco:

<A NAME="Up" HREF="menu.html" TITLE="Dwunastu Cezarów">

Dodatkowe atrybuty (w tym przykładzie są to NAME, HREF i TITLE) stanowią opis połącze­nia. Najczęściej używanym z nich jest HREF, który jest skrótem od ang. Hypertext REFerence (odnośnik hipertekstowy). Służy on do określenia URL pliku, wskazywanego przez dane połączenie.

Podobnie jak większość znaczników HTML, także <A> posiada swój znacznik zamykający </A>. Cały tekst, który znajdzie się pomiędzy nimi, (podświetlony w zależności od przeglądarki może być wyróżniony kolorem niebieskim lub czerwonym i dodatkowo podkreślony), będzie widoczny na stronie jako hiperpołączenie. Na ten tekst czytelnicy będą klikali, aby przeskoczyć do miejsca, opisanego atrybutem HREF.

Na rys. 5.1 widoczne są części typowego hiperpołączenia, zdefiniowanego za pomocą znacznika <A>, czyli HREF, tekst połączenia oraz znacznik zamykający.

0x08 graphic
0x08 graphic
0x08 graphic
0x08 graphic
Rysunek 5.1

Hiperpołączenie z użyciem znacznika <A>

Tekst, który będzie

Plik do wczytania podświetlony

<A HREF="menu.html">Powrót do Menu Głównego</A>

Znacznik otwierający Znacznik

zamykający

Poniższe przykłady demonstrują proste połączenie i jego efekt końcowy w Internet Explorerze (rys. 5.2).

0x01 graphic

Powrót do <a href="../menu.htm">Menu Głównego</a>

0x01 graphic

Rysunek 5.2

Wyniki w Internet Explorerze

0x01 graphic

Ćwiczenie 5.1: Łączenie dwóch stron

0x08 graphic
Spróbujmy stworzyć prosty przykład połączenia dwóch stron HTML na dysku lokalnym. Do wykonania tego ćwiczenia potrzebny będzie edytor tekstu i przeglądarka. Nie jest tu wymagane podłączenie do Internetu, bowiem obydwa łączone pliki znajdują się na dysku lokalnym (do ćwiczeń z siecią przejdziemy w dalszej części rozdziału; bądź cierpliwy).

Na wstępie utwórz dwie strony HTML i zapisz je w osobnych plikach. Oto kod źródłowy dwóch plików, które stworzyłam na potrzeby tego rozdziału: menu.html i klaudiusz.html. To, jak nazwiesz swoje strony i o czym będą one traktowały właściwie nie jest ważne, pamiętaj tylko, że nazwy plików mają tu duże znaczenie.

Pierwszy plik, menu.html, jest następujący:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">

<html>

<head>

<title>Żywoty cezarów</title>

</head>

<body>

<h1>"Żywoty cezarów" według Swetoniusza</u></h1>

<p>Swetoniusz (lub Caius Suetoniusz Tranquillus) urodził się około

70 naszej ery, a zmarło około roku 130. Jest on autorem historii dwunastu

cezarów poczynając od Juliusza a kończąc na Dominicjanie (który zmarł w

roku 96). Jego praca w znacznej mierze przyczyniła się do powstania

bestsellerowej powieści "Ja, Klaudiusz" oraz filumu nakręconego na jej

podstawie. Praca Swetoniusza zawiera biografie następujących władców

Rzymu:</p>

<ul>

<li>Julisz Cezar</li>

<li>August</li>

<li>Tyberiusz</li>

<li>Gajusz (Kaligula)</li>

<li>Klaudiusz</li>

<li>Neron</li>

<li>Galba</li>

<li>Otho</li>

<li>Vitelliusz</li>

<li>Vespazjan</li>

<li>Tytus</li>

<li>Dominicjan</li>

</ul>

</body>

</html>

Elementy listy (Juliusz Cezar, August, itp. ) będą połączeniami do innych stron. Na razie zapisz je jak zwykły tekst, później zamienimy je w hiperpołączenia.

Drugi plik, klaudiusz.html przedstawia się tak:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">

<html>

<head>

<title>Żywoty cezarów: Klaudiusz</title>

</head>

<body>

<h2>Klaudiusz zostaje Cezarem</h2>

<p>Klaudiusz został Cezarem w wieku 50 lat. Obawiając się ataku

morderców Kaliguli, Klaudiusz ukrył się za zasłoną. Gdy strażnicy

odnaleźli go, Klaudiusz padł na podłogę, a w chwilę później został

ogłoszony Cezarem.</p>

<h2>Klaudiusz został otruty</h2>

<p>Większość osób uważa, iż Klaudiusz został otruty. Niektórzy sądzą,

że żona Klaudiusza - Agrypina - zatruła jego ulubione danie - grzyby.

Jego śmierć nastąpiła po tym, gdy ustalono, że syn Agrypiny - Neron -

zostanie kolejnym Cezarem.</p>

<p>Powrót do Menu Głównego.</p>

</body>

</html>

Upewnij się, czy obydwa pliki znajdują się w tym samym katalogu lub folderze. Jeżeli nazwa­łeś je inaczej niż ja, miej to na uwadze, bowiem za chwilę nazwy okażą się bardzo ważne.

Na początek utwórzmy połączenie z pliku menu do pliku z informacjami o cezarze Klaudiuszu --> [Author:MMP] . W tym celu ustaw kursor w poniższej linii:

<li>Klaudiusz</li>

Znaczniki połączeń nie zawierają żadnych informacji o formatowaniu tekstu, tak więc po­zostaw znacznik elementu listy i wstaw połączenie wewnątrz niego. Umieść <A> i </A> przed i za tekstem, który chcesz wykorzystać jako połączenie:

<li><a>Klaudiusz</a></li>

Teraz, korzystając z atrybutu HREF, dodaj nazwę pliku, do którego ma prowadzić połącze­nie. Ujmij ją w cudzysłów (z obu stron cudzysłów górny), a pomiędzy HREF i nazwę wstaw znak równości (=). Pamiętaj, że wielkość liter ma znaczenie w przypadku nazwy pliku, tak więc zwróć na tę kwestię szczególną uwagę (klaudiusz.html to nie to samo co Klaudiusz.html — każda litera musi się dokładnie zgadzać). W moim przykładzie nazwą będzie klaudiusz.html, ale jeżeli utworzyłeś swoje własne pliki, wstaw nazwę jednego z nich.

<li><a href="klaudiusz.html">Klaudiusz</a></li>

W tej chwili możesz już uruchomić przeglądarkę. Wybierz opcję „Otwórz plik” (lub jej odpowiednik w przeglądarce, której używasz) i otwórz plik menu.html. Element listy, który wybrałeś na połączenie, powinien zostać wyświetlony innym kolorem, podkreślony lub wyróżniony w jakiś inny sposób. Rysunek 5.3 pokazuje, jak wyglądała ta strona po jej wyświetleniu w Internet Explorerze dla Windows 98.

Rysunek 5.3

Plik menu.htm z hiperpołączeniem

0x01 graphic

Jeżeli teraz klikniesz wyróżnione połączenie, przeglądarka powinna wczytać i wyświetlić stronę klaudiusz.html, jak pokazano na rys. 5.4.

Rysunek 5.4

Strona klaudiusz.html

0x01 graphic

Jeżeli zdarzy się, że przeglądarka po wybraniu połączenia nie będzie mogła znaleźć pliku, sprawdź, czy na pewno nazwa, wpisana w atrybucie HREF jest w stu procentach zgodna z naz­wą uprzednio utworzonego pliku i czy obydwa pliki znajdują się w tym samym katalogu. Pamiętaj o tym, że tekst połączenia należy zamknąć za pomocą znacznika </A> oraz o tym, aby ująć nazwę pliku w cudzysłów z obu stron (naprawdę bardzo łatwo o tym zapomnieć). Wszystkie te, z pozoru drobne, pomyłki mogą wprowadzić przeglądarkę w błąd i sprawić, że nie odnajdzie ona pliku, który powinna wczytać lub też niepoprawnie wyświetli tekst połącze­nia na ekranie.

0x01 graphic

Nie denerwuj się tym, że o wielkich i małych literach raz mówię tak, a innym razem inaczej. Znaczniki HTML-a nie rozróżniają wielkich i małych liter, ale nazwy odnoszą się do plików, znajdujących się na serwerach WWW. Więk­szość z tych serwerów pracuje w systemach operacyjnych, które rozróżniają wielkość liter (np. Unix), więc w przypadku nazw plików powinieneś zwracać na to uwagę.

Utwórzmy teraz połączenie z pliku klaudiusz.html z powrotem do pliku menu.html. Akapit na końcu tej strony został tam umieszczony właśnie po to:

<p>Powrót do Menu Głównego</p>

Dodaj to tej linii znacznik połączenia wraz z atrybutem HREF, gdzie nazwą pliku będzie menu.html, czyli wyjściowy plik menu:

<p><a href="menu.html">Powrót do Menu Głównego</p>

0x01 graphic

Jeżeli umieszczasz znaczniki pomiędzy innymi znacznikami, upewnij się czy znacznik zamykający jest odpowiednikiem ostatniego otwartego. W tym przypadku powinno to wyglądać tak:

<P> <A> ... </A> </P>

a nie

<P> <A> ... </P> </A>

Niektóre przeglądarki mogą niepoprawnie odczytywać tego typu błędny zapis, tak więc zawsze uważnie sprawdź, czy znaczniki się ze sobą nigdzie nie przeplatają.

0x08 graphic
Odczytaj ponownie stronę biografii Klaudiusza. Połączenie powinno być już aktywne, klika­jąc je, bez problemów musisz przejść z powrotem do strony menu.

Łączenie stron lokalnych przy użyciu ścieżek względnych i bezwzględnych

Przykład z poprzedniego podpunktu pokazuje, jak połączyć ze sobą pliki, znajdujące się w tym samym katalogu (folderze) na lokalnym dysku. Dalej będziemy łączyć ze sobą pliki lokalne, lecz tym razem będą one umiejscowione w różnych katalogach (folderach).

0x01 graphic

Foldery i katalogi to właściwie to samo, nazwa zależy od tego, czy pracujesz na Macintoshu, w systemie Windows, DOS czy też Unix. Od teraz, żeby ułatwić wszystkim życie będę używała tylko nazwy „katalog”.

Jeżeli po HREF podasz w cudzysłowie tylko nazwę pliku, tak jak robiliśmy to w poprzed­nich przykładach, przeglądarka będzie szukała tego pliku w tym samym katalogu, w którym znajduje się aktualnie oglądana strona. Dzieje się tak zawsze, niezależnie od tego, czy prze­glądane pliki umieszczone są na dyskach lokalnych, czy na serwerach w Internecie — obydwa pliki powinny znajdować się w tym samym katalogu. Jest to najprostsza forma określania ścieżki względnej.

Ścieżki względne mogą również zawierać nazwy katalogów lub też wskazywać na pewną ścieżkę z punktu widzenia bieżącego katalogu. Ścieżka może określać miejsce w drzewie katalogów w stosunku do bieżącej pozycji, na przykład, żądany plik może znajdować się dwa poziomy katalogów w górę lub w dół.

0x01 graphic

Ścieżka względna określa położenie pliku z punktu widzenia bieżącej pozycji w drzewie katalogów.

Do określania ścieżek względnych w połączeniach można używać zapisu znanego z systemu Unix, bez względu na używany system operacyjny. I tak nazwy plików i katalogów od­dzielone są od siebie ukośnikiem (/), a dwie kropki (..) zawsze wskazują na katalog znaj­dujący się bezpośrednio powyżej bieżącego.

Tabela 5.1 zawiera kilka przykładów ścieżek względnych wraz z opisem ich znaczenia.

Tabela 5.1: Ścieżki względne

Ścieżka

Znaczenie

HREF="file.html"

Plik file.html znajduje się w bieżącym katalogu.

HREF="files/file.html"

file.html znajduje się w katalogu files, który z kolei umieszczony jest w bieżącym katalogu.

HREF="files/morefiles/file.html"

file.html znajduje się w katalogu morefiles, który jest podkatalogiem files, a ten z kolei umieszczony jest w katalogu bieżącym.

HREF="../file.html"

file.html znajduje się w katalogu mieszczącym się o poziom wyżej niż bieżący.

HREF="../../files/file.html"

file.html znajduje się o dwa poziomy wyżej, w katalogu files.

Jeżeli łączysz swoje strony na komputerze osobistym (czyli na Macintoshu lub PC-cie) i zechcesz podłączyć plik, znajdujący się na innym dysku, możesz skorzystać z litery dysku w ścieżce względnej tak samo jak z nazwy katalogu.

W przypadku komputerów Macintosh, przy tworzeniu połączeń do plików znajdujących się na lokalnym dysku twardym, nazwa dysku ma taką samą postać jak w systemie operacyj­nym. Załóżmy, że jeden z dysków nosi nazwę Hard Disk 2, a Twoje pliki HTML znajdują się w katalogu Pliki HTML. Jeżeli chcesz utworzyć połączenie do pliku o nazwie jane.html z katalogu Public na dysku Jane's Mac, możesz skorzystać z następującej ścieżki względ­nej:

HREF="../../Jane's Mac/Public/jane.html"

W systemach opartych na DOS, Windows 95/98 oraz Windows NT połączenia do dysków tworzymy za pomocą liter, ale dwukropki w nazwach (c:, d:) zastępujemy znakiem „|” (dwukropek ma w połączeniach inne znaczenie). Należy również pamiętać, aby katalogi w ścieżce oddzielać od siebie ukoś­nikiem „/”, a nie lewym ukośnikiem „\” używanym w systemach uniksowych. Jeżeli więc bieżący plik będzie znajdował się w katalo­gu C:\FILES\HTML\ i zechcesz połączyć go z plikiem D:\FILES.NEW\HTML\MORE\INDEX.HTML, ścieżka względna prowadząca do niego może wyglądać następująco:

HREF="../../d|/files.new/html/more/index.html"

Zazwyczaj nie będziesz musiał używać nazwy dysku w tworzonych połączeniach, ale dla porządku zamieściłam informację o tym, jak to się robi. W większości przypadków bę­dziesz łączył ze sobą pliki, które będą się znajdować w sensownej odległości od siebie (jeden, góra dwa poziomy katalogów).

Ścieżki bezwzględne

Połączenie do strony, znajdującej się na lokalnym dysku, możesz również utworzyć w opar­ciu o ścieżkę bezwzględną. Ścieżka względna wskazuje na pozycję innego pliku z punktu widzenia bieżącej pozycji w drzewie katalogów, natomiast ścieżka bezwzględna to pełna ścieżka dostępu do pliku. Zawiera ona w sobie nazwy wszystkich katalogów, znajdujących się po drodze do żądanego pliku, począwszy od najwyższego punktu hierarchicznej struktury drzewa katalogów.

0x01 graphic

Ścieżka bezwzględna tworzona jest w oparciu o bezwzględną pozycję pliku w drzewie katalogów.

Ścieżki bezwzględne zawsze rozpoczynają się od ukośnika — właśnie w ten sposób są one odróżniane od ścieżek względnych. Po ukośniku następują nazwy wszystkich katalogów, począwszy od najwyższego poziomu, a kończąc na nazwie pliku, do którego tworzymy połączenie.

0x01 graphic

Pojęcie „najwyższego poziomu” ma różne znaczenie w zależności od tego, gdzie publikujesz swoje strony. Jeżeli połączenia prowadzą do plików na dysku lokalnym, „najwyższy poziom” to katalog główny systemu plików (/ w Uniksie, nazwa dysku na Macintoshu lub PC). Jeżeli natomiast strony są publikowane na serwerze WWW, „najwyższy poziom” wcale nie musi oznaczać najwyższego poziomu w systemie plików (i zwykle nie oznacza). Więcej na ten temat opowiem w rozdziale 25. „Publikowanie witryny”.

Tabela 5.2 zawiera kilka przykładów ścieżek bezwzględnych oraz krótki opis ich znaczenia.

Tabela 5.2: Ścieżki bezwzględne

Ścieżka

Znaczenie

HREF="/u1/lemay/file.html"

Plik file.html znajduje się w katalogu /u1/lemay/ (w systemie Unix).

HREF="/d|/files/html/file.html"

file.html znajduje się na dysku D: w katalogu files/html/ (w systemie opartym na DOS-ie).

HREF="/Hard Disk 1/HTML files/ file.html"

file.html znajduje się na dysku Hard Disk 1 w katalogu HTML files (na komputerach Macintosh).

Z którego rodzaju ścieżek powinieneś korzystać?

Do tworzenia połączeń pomiędzy swoimi własnymi stronami, w większości przypadków, będziesz korzystał ze ścieżek względnych. Ścieżki bezwzględne mogą wydawać się bardziej przejrzyste, szczególnie w przypadku skomplikowanych połączeń pomiędzy wieloma stro­nami, ale są one bardzo mało elastyczne. Jeżeli będziesz wszędzie używał ścieżek bez­względnych, a potem przeniesiesz pliki gdzieś indziej lub zmienisz nazwę katalogu, po­łączenia przestaną funkcjonować i będziesz zmuszony do żmudnej edycji wszystkich pli­ków i poprawiania ścieżek. Wiąże się to z faktem, że ścieżki bezwzględne bardzo utrudniają proces przenoszenia plików z lokalnego systemu na serwer WWW.

Ścieżki względne umożliwiają swobodne przenoszenie stron pomiędzy różnymi katalogami i systemami, bez konieczności modyfikacji plików. Strony powiązane ze sobą w ten sposób są łatwiejsze w utrzymaniu, tak więc naprawdę warto poświęcić na początku trochę więcej czasu i przygotować prezentację właśnie tą metodą:

Połączenia do dokumentów w sieci WWW

Posiadasz już kilka wzajemnie ze sobą połączonych dokumentów na dysku lokalnym. Do­myślam się jednak, że w paru miejscach chciałbyś już wstawić połączenia do stron znajdu­jących się gdzieś w sieci WWW, na przykład, do strony „The First Caesars” dr Ellis Knox z Boise State University, na której znajdziesz więcej informacji o rzymskich władcach. Do tego celu można wyko­rzystać znacznik połączenia <A>. Strony w sieci WWW będę nazywała stronami zdalnymi.

0x01 graphic

Strona zdalna to strona znajdująca się na serwerze WWW innym od tego, na którym znajduje się Twoja prezentacja.

Do tworzenia połączeń ze zdalnymi stronami służy dokładnie taki sam kod, jakiego używaliśmy do łączenia ze sobą stron lokalnych. Będziemy używać tego samego znacznika <A> i atrybutu HREF wraz z tekstem, który będzie wskazywał stronę w sieci. Ale tym razem tekstem tym nie będzie ścieżka, ale URL danej strony WWW, jak pokazano na rys. 5.5.

0x08 graphic
0x08 graphic
0x08 graphic
Rysunek 5.5

Połączenie do zdalnej strony

Adres URL

<A HREF="http://www.cern.ch/">Strona domowa Cern'u</A>

Znacznik otwierający Znacznik

zamykający

Ćwiczenie 5.2. Łączenie stron o cezarach z siecią WWW

0x08 graphic
Wróćmy do dwóch stron, które łączyliśmy ze sobą w poprzednim ćwiczeniu, tych o cesarzach rzymskich. Plik menu.html zawiera wiele połączeń do lokalnych stron, które zawierają informacje o dwunastu cesarzach.

Załóżmy teraz, że chcemy na końcu tej strony dodać połączenie do strony „The First Caesars” autorstwa dr Ellis Knox z Boise State University, o adresie: http://history.idbsu.edu/westciv/julio-cl/index.html.

Na początek dodaj odpowiedni tekst do strony menu:

<p>Więcej informacji na temat tych władców Rzymu znajdziesz na stronie <i>The First Caesars</i> autorstwa dr Ellis Knox</p>

A co zrobić, jeżeli nie znasz URL strony „The First Caesars” (lub innej strony, do której chcesz utworzyć połączenie) i wiesz tylko, jak do niej dotrzeć poprzez inne strony? Żaden problem, skorzystaj z przeglądarki i znajdź ją. Wygląd tej strony, po wyświetleniu w przeglądarce, został przedstawiony na rysunku 5.6.

Rysunek 5.6

Strona „The First Caesars”

0x01 graphic

0x01 graphic

Jeśli skonfigurowałeś swój komputer w taki sposób, aby połączenie z Internetem nie było nawiązywane (o czym była mowa w rozdziale 3. „Wprowadzenie do HTML”), dobrze byłoby teraz nawiązać to połączenie, aby móc wykonać omawiane ćwiczenie.

W większości przeglądarek adres URL aktualnie oglądanej strony jest widoczny w górnej części okna (w Internet Explorerze 4.0 i 5.0 pasek ten może zostać ukryty, aby go wyświetlić, wybierz opcję WidokPaski narzędziPasek adresów). Więc wystarczy tylko dotrzeć w jakiś sposób do danej strony, skopiować URL i wstawić go w odpowiednie miejsce tworzonego kodu HTML. Nie trzeba nawet nic pisać!

Jeżeli odnalazłeś już URL strony ZOO, możesz przystąpić do konstruowania znacznika po­łączenia:

<p>Więcej informacji na temat tych władców Rzymu znajdziesz na stronie <a href="http://history.idbsu.edu/westciv/julio-cl/index.html"><i>The First Caesars</i></a> autorstwa dr Ellis Knox</p>

Oczywiście, jeżeli znasz już URL podłączanej strony, możesz go po prostu wpisać po atrybucie HREF. Pamiętaj jednak, że najmniejszy błąd w trakcie wpisywania spowoduje, że połączenie nie będzie funkcjonować. Większość adresów URL jest zbyt skomplikowana, aby człowiek mógł je bez problemów zapamiętać. Dlatego też ja osobiście, jeżeli tylko jest to możliwe, kopiuję je i wstawiam do kodu, eliminując w ten sposób możliwość popełnienia pomyłki przy wpisywaniu.

Rys. 5.7 przedstawia plik menu.html po dodaniu połączenia (Internet Explorer dla Windows 98).

0x08 graphic
Rysunek 5.7

Połączenie ze stroną „The First Caesars”

0x01 graphic

Ćwiczenie 5.3: Tworzenie menu połączeń

0x08 graphic
Teraz, kiedy poznałeś już sposoby tworzenia zarówno list, jak i połączeń, jesteś gotów do podjęcia próby utworzenia menu połączeń. Menu połączeń to kilka połączeń umieszczo­nych na stronie w formie uporządkowanej, czytelnej listy. Takie struktury sprawdzają się doskonale we wszelkiego rodzaju spisach treści, służących do nawigacji pomiędzy wieloma stronami. Strony WWW, które zawierają tylko i wyłącznie połączenia bardzo często są zorganizowane właśnie w ten sposób.

0x01 graphic

Menu połączeń to krótkie listy połączeń wychodzących z danej strony, które stanowią przejrzysty przegląd istniejących możliwości wyboru dalszej drogi.

Idea menu połączeń polega na tym, że treść każdego z elementów jest w miarę krótka i przejrzysta oraz w całości stanowi połączenie, nie ma żadnego dodatkowego opisu. Stru­ktury tego typu wyglądają najlepiej, gdy zostaną zorganizowane w formie listy wypunkto­wanej, ale lista definicji czy zwykłe akapity również nie powinny prezentować się źle. Menu połączeń daje czytelnikowi strony błyskawiczny przegląd oferowanych połączeń, co nie byłoby takie proste, gdyby były one umieszczone gdzieś w tekście.

W tym ćwiczeniu stworzymy stronę WWW, będącą przewodnikiem po restauracjach. Będzie ona służyła za punkt wyjścia do szczegółowych opisów, poświęconych konkretnym lokalom.

Rozpocznijmy od znaczników struktury strony, nagłówka pierwszego poziomu i krótkiego tekstu wprowadzającego:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">

<html>

<head>

<title>Rzetelny przegląd książek</title>

</head>

<body>

<h1>Rzetelny przegląd książek</h1>

<p>Przeczytałam wiele książek dotyczących przeróżnych zagadnień.

Choć nie jestem krytykiem i nie robię tego zawodowo, to jednak

lubię od czasu do czasu przeczytać dobrą książkę. Oto lista

książek, które przeczytałam ostatnio:</p>

Wstawmy teraz listę, na razie, bez znaczników połączeń. Zawsze łatwiej jest najpierw napi­sać tekst, a dopiero potem na jego bazie tworzyć połączenie. W tym przykładzie skorzysta­my z listy wypunktowanej, choć równie dobra mogłaby być lista menu. Natomiast zupełnie nie na miejscu byłoby użycie listy numerowanej, sugerowałoby to bowiem, że opisywane książki zostały ocenione w jakiś wymierny sposób. Rys. 5.8 przedstawia stronę zawierającą wprowadzenie oraz listę książek, wyświetloną w Internet Explorerze.

<ul>

<li><i>"Harry Potter i więzień Azkabanu"</i> J.K. Rowling</li>

<li><i>"Władca pierścieni"</i> J.R.R Tolkien</li>

<li><i>"Paragraf 22"</i> Joseph Heller</li>

<li><i>"Kolor magii"</i> Terry Pratchett</li>

</ul>

</body>

</html>

Rysunek 5.8

Lista książek

0x01 graphic

Spróbuj teraz zmodyfikować każdy element listy, tak aby zawierał znaczniki połączeń. W żadnym wypadku nie należy usuwać znacznika <LI>, wskazuje on bowiem na początek każdego elementu listy. Wystarczy tylko wstawić znaczniki <A> przed i za tekstem. Utwórz połączenia do plików na dysku lokalnym, w tym samym katalogu co edytowana strona, zakładając, że każdy plik zawiera bliższy opis jednej książki:

<ul>

<li><a href="hpiwa.html"><i>"Harry Potter i więzień Azkabanu"</i> J.K. Rowling</a></li>

<li><a href="wp.html"><i>"Władca pierścieni"</i> J.R.R Tolkien</a></li>

<li><a href="p22.html"><i>"Paragraf 22"</i> Joseph Heller</a></li>

<li><a href="km.html"><i>"Kolor magii"</i> Terry Pratchett</a></li>

</ul>

Menu książek wygląda teraz zupełnie dobrze, ale jest chyba troszkę zbyt ubogie w infor­macje. Osoby przeglądające stronę nie znajdą na niej żadnych informacji o tym, jaka jest dana książka i czego dotyczy (choć czasami sam tytuł książki może dawać pewne pojęcie na jej temat) oraz czy jest ona dobra lub nie. Dobrze byłoby dołożyć po tekście połączenia krótki opis tego, co znajduje się po jego drugiej stronie:

<ul>

<li><a href="hpiwa.html"><i>"Harry Potter i więzień Azkabanu"</i> J.K. Rowling</a>

Kolejna, doskonała część przygód Harrego Pottera.</li>

<li><a href="wp.html"><i>"Władca pierścieni"</i> J.R.R Tolkien</a>

Klasyczny przykład walki dobra ze złem - doskonały przykład literatury fantasy.</li>

<li><a href="p22.html"><i>"Paragraf 22"</i> Joseph Heller</a>

To już klasyka! Doskonała groteska o ludziach i wojnie - najpierw umrzesz ze

śmiechu, a potem będziesz musiał się chwilę zastanowić.</li>

<li><a href="km.html"><i>"Kolor magii"</i> Terry Pratchett</a> Świat jakiego

jeszcze nie znałeś opisany z humorem jakiego nie znajdziesz w żadnej innej

książce.</li>

</ul>

Lista książek w ostatecznym kształcie wygląda następująco:

0x08 graphic
Rysunek 5.9

Ostateczna postać menu połączeń

0x01 graphic

Połączenia do określonych miejsc w dokumencie

Połączenia, które tworzyliśmy wspólnie do tej pory, prowadziły od pewnego miejsca w do­kumencie wyjściowym do innej strony. Ale co zrobić, jeżeli chcemy utworzyć połączenie nie tylko ogólnie do strony, ale do konkretnego jej miejsca, przypuśćmy do czwartego akapitu?

HTML daje taką możliwość, służą do tego odnośniki, które mogą być umieszczane w ko­dzie strony. Połączenie, które jest tworzone na stronie wyjściowej musi w takim wypadku zawierać nie tylko nazwę pliku, ale także nazwę odnośnika. Po wybraniu tego połączenia przeglądarka odczyta stronę, do której ono prowadzi, a następnie przesunie ją na ekranie, tak że będzie wyświetlana od miejsca oznaczonego za pomocą odnośnika (patrz rys. 5.10).

Rysunek 5.10

sklep.html

obiad.html

Połączenia i odnośniki 0x08 graphic
0x08 graphic
0x08 graphic

Wybierz temat:

*Makaron

*Napoje

*Piwo

*Sok

*Woda mineralna

*Warzywa

*Pomidor

*Ogórek

Piwo

Napój niskoalkoholowy.

Pomidor

Jednoroczna roślina warzywna.

Makaron

Wysuszone ciasto z mąki pszennej z do­datkiem jaj i soli.

0x01 graphic

Odnośniki to specjalnie oznaczone miejsca w dokumencie HTML, do których można tworzyć połączenia. Wybór takiego połączenia spowoduje przejście do miejsca oznaczonego za pomocą odnośnika, a nie ogólnie do wybranej strony. Odnośniki mogą być również wykorzystywane do tworzenia połączeń wewnątrz tej samej strony.

Tworzenie połączeń i odnośników

Do tworzenia odnośników używany jest ten sam znacznik, który poznaliśmy już przy okazji połączeń, czyli <A>.

Znacznik <A> używany jako połączenie składa się z dwóch części: atrybutu HREF w znacz­niku otwierającym oraz tekstu połączenia, znajdującego się pomiędzy znacznikiem otwie­rającym a zamykającym.

Odnośniki tworzy się prawie tak samo, z tym, że zamiast atrybutu HREF używany jest atrybut NAME. Atrybut ten zawiera słowa kluczowe, które będą stanowiły nazwę odnośnika. Rys. 5.11 przedstawia składnię znacznika <A> wykorzystanego to utworzenia odnośnika.

0x08 graphic
0x08 graphic
0x08 graphic
0x08 graphic
Rysunek 5.11

Znacznik <A> jako odnośnik

Tekst, który ukaże się

Nazwa odnośnika na górze ekranu

<A NAME="Czesc4">Część czwarta: Sianie kukurydzy</A>

Znacznik otwierający Znacznik

zamykający

Odnośnik, podobnie jak połączenie, wymaga pewnego fragmentu tekstu, który musi zostać umieszczony pomiędzy znacznikiem otwierającym a zamykającym. Po wybraniu połączenia do danego odnośnika przeglądarka przewija stronę, tak aby ten tekst znalazł się w pierwszej linii ekranu. Niektóre przeglądarki dodatkowo wyróżniają w jakiś sposób tekst odnośnika.

Aby więc utworzyć odnośnik w części tekstu, oznaczonej jako „Część Czwarta”, możesz wstawić przed nagłówkiem znacznik <A> i nazwać go Part4:

<h1><a name="Part4">Część Czwarta: Niebiański Grejpfrut </a></h1>

W przeciwieństwie do połączeń, odnośniki nie są w żaden sposób widoczne na normalnie wyświetlanej stronie. Dopóki więc nie przeskoczysz do danego odnośnika za pomocą jakie­goś połączenia, nie dowiesz się, że on tam jest.

Żeby skierować połączenie na wybrany odnośnik, używamy takiej samej składni, z jakiej korzystaliśmy, tworząc „zwykłe” połączenia do stron, łącznie z atrybutem HREF, który określa nazwę pliku lub URL strony docelowej. Różnica polega na tym, że po nazwie pliku wstawiamy znak # (hash) i nazwę odnośnika, która musi być, dokładnie taka sama jak ta, która została wpisana po atrybucie NAME w kodzie odnośnika (z dokładnością do małych i wielkich liter):

<a href="mybigdoc.html#Part4">Idź do Części Czwartej</a>

Takie połączenie poleca przeglądarce, aby po wczytaniu strony mybigdoc.html rozpo­częła jej wyświetlanie od części czwartej. Tekst, który znajduje się w definicji odnośnika Part4, zostanie umieszczony w pierwszej linii ekranu.

Ćwiczenie 5.4: Wzajemne łączenie fragmentów dwóch stron

0x08 graphic
Spróbujmy przećwiczyć to na przykładzie dwóch stron. Są one częścią prezentacji poświęconej muzyce klasycznej, a każda z nich zawiera połączenia do wszystkich pozos­tałych dokumentów, których nazwy rozpoczynają się od tej samej litery (a.html, b.html, itd.). Można by poukładać to w taki sposób, że każdy dokument posiadałby swoją własną stronę, lecz taka organizacja prezentacji zmusiłaby autora do utworzenia wielu stron, które czytelnicy musie­liby wciąż od nowa wczytywać. W takim przypadku dużo korzystniejsze jest połączenie wszystkich dokumentów rozpoczynających się od danej litery w jedną stronę (o tym, kiedy warto tworzyć długie a kiedy krótkie strony, możesz przeczytać w rozdziale 22. „Tworzenie i projektowanie stron WWW: zalecenia i przeciwwskazania”).

Pierwsza część takiej zbiorczej strony powinna wyglądać w HTML-u następująco:

<!DOCTYPE html public "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">

<html>

<head>

<title>Muzyka klasyczna: M</title>

</head>

<body>

<h1>M</h1>

<h2>Madrygały</h2>

<ul>

<li>William Byrd, <em>This Sweet and Merry Month of May</em></li>

<li>William Byrd, <em>Though Amaryllis Dance</em></li>

<li>Orlando Gibbons, <em>The Silver Swan</em></li>

<li>Roland de Lassus, <em>Mon Coeur se Recommande &agrave; vous</em></li>

<li>Claudio Monteverdi, <em>Lamento d'Arianna</em></li>

<li>Thomas Morley, <em>My Bonny Lass She Smileth</em></li>

<li>Thomas Weelkes, <em>Thule, the Period of Cosmography</em></li>

<li>John Wilbye, <em>Sweet Honey-Sucking Bees</em> </li>

</ul>

<p>Świecka muzyka wokalna na cztery, pięć i sześć głosów, zazwyczaj

a cappella. 15-16 wiek.</p>

<p><em>Zobacz również</em> Byrd,Gibbons, Lassus, Monteverdi, Morley,

Weelkes, Wilbye</p>

</body>

</html>

Rys. 5.12 przedstawia powyższy fragment tekstu w przeglądarce:

Rysunek 5.12

Encyklopedia muzyki klasycznej: litera M

0x01 graphic

W ostatniej linii (Zobacz również) należałoby umieścić połączenia do stron, na których znajdują się informacje o kompozytorach. W ten sposób połączenie do słowa Byrd prowa­dziłoby do pliku b.html. Czytelnik, po wybraniu tego połączenia, ujrzałby na ekranie stronę na literę B, ale chcąc uzyskać informacje na temat Byrda, musiałby przewijać ją w dół i sam znaleźć to nazwisko, co byłoby dość irytujące, zważywszy na to, że kompozytorów, których nazwiska rozpoczynają się od B jest niemało (Bach, Beethoven, Brahms, Bruckner). Cał­kiem sporo pracy jak na system, który powinien być łatwy w użyciu i błys­kawicznie wyszu­kiwać żądane informacje.

Można rozwiązać ten problem, łącząc słowo Byrd w pliku m.html, bezpośrednio z rozdzia­łem poświęconym Byrdowi w pliku b.html. Oto odpowiedni fragment pliku m.html (dla większej przejrzystości usunęłam pozostałych kompozytorów z tego pliku; załóżmy jednak, że infor­macje o nich wciąż tam są).

0x01 graphic

Zauważyłeś pewnie, że w przytaczanych tu przykładach używam znacznika <EM>. Jest on stosowany do wyróżnienia jakiegoś fragmentu tekstu na ekranie. W Netscape'ie i Internet Explorerze tak oznaczony tekst jest z reguły wyświetlany kursywą.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">

<html>

<head>

<title>Muzyka klasyczna: B</title>

</head>

<body>

<h1>B</h1>

<h2>Byrd, William, 1543-1623</a></h2>

<ul>

<li>Madrygały</li>

<ul>

<li><em>This Sweet and Merry Month of May</em></li>

<li><em>Though Amaryllis Dance</em></li>

<li><em>Lullabye, My Sweet Little Baby</em></li>

</ul>

<li>Msze</li>

<ul>

<li><em>Msza na Pięć Głosów</em></li>

<li><em>Msza na Cztery Głosy</em></li>

<li><em>Msza na Trzy Głosy</em></li>

</ul>

<li>Motety</li>

<ul>

<li><em>Ave verum corpus a 4</em></li>

</ul>

</ul>

<p><em>Zobacz również</em>

Madrygały, Msze, Motety</p>

</body>

</html>

W nagłówku części poświęconej Byrdowi należy teraz wstawić odnośnik. Wtedy będzie można umieścić odpowiednie połączenie w linii Zobacz również w pliku m.html.

Jak już wspomniałam wcześniej w tym rozdziale, do utworzenia odnośnika potrzebne będą dwa elementy: jego nazwa oraz tekst pomiędzy znacznikami. Wybór tekstu jest w tym wypadku oczywisty, będzie to treść nagłówka części dokumentu, do której ma pro­wadzić połączenie.

Nazwa odnośnika może być dowolna, ale nazwy znajdujące się w obrębie jednej strony mu­szą być unikalne (gdyby na jednej stronie znajdowały się dwa odnośniki o nazwie Franek, to skąd przeglądarka miałaby wiedzieć, do którego z nich ma przeskoczyć po wybraniu połączenia?). W tym przypadku dobrą, unikalną nazwą byłoby po prostu słowo byrd, ponieważ logiczne jest, że taka nazwa może pojawić się tylko w tym miejscu pliku b.html.

Kiedy już wiesz, jak będą brzmieć obydwie części odnośnika, możesz rozpocząć proces wstawiania. Umieść znacznik <A> w nagłówku części poświęconej Williamowi Byrdowi, ale bądź ostrożny. Jeżeli pracujesz na zwykłym tekście wewnątrz akapitu, wystarczy po prostu umieścić znaczniki na początku i końcu wybranego fragmentu. Jeżeli jednak odnośnik wstawiany jest w tekście, który dodatkowo oznaczony jest innymi znacznikami (nagłówek lub cały akapit), zawsze należy umieszczać go wewnątrz już istniejących ozna­czeń. Innymi słowy, należy to zrobić tak:

<H2><A NAME="byrd">Byrd, William, 1543-1623</A></H2>

a nie tak:

<A NAME="byrd"><H2>Byrd, William, 1543-1623</H2></A>

Drugi z powyższych zapisów może zmylić przeglądarkę. Nie będzie ona w stanie rozróżnić, czy jest to odnośnik z tajemniczymi znacznikami nagłówków, czy też może jest to nagłó­wek, który przypadkiem również jest odnośnikiem. Jeżeli wstawisz znaczniki we właściwej kolejności, unikniesz tego typu problemów.

Jeżeli, podobnie jak ja, zaczynasz od pisania samego tekstu, a dopiero później dodajesz do niego znaczniki, nie powinieneś mieć kłopotów opisanych powyżej. Najbardziej sensowny sposób podejścia do tej kwestii to otaczanie wszystkiego znacznikami <A>. Pomyśl o tym następująco: jeżeli tworzysz połączenie do jednego słowa a nie do całego elementu, musisz wstawić znaczniki <A> pomiędzy znacznikami <H2>. W wypadku pracy z pełną linią tekstu jest podobnie. Trzymaj się tej reguły, a unikniesz wielu komplikacji.

0x01 graphic

Jeżeli jeszcze niezupełnie rozumiesz, o co chodzi, zajrzyj do dodatku B „Opis języka HTML”. Znajdziesz tam podsumowanie wiadomości o znacznikach i regułach dotyczących ich wzajemnego umieszczania pomiędzy sobą.

Jeżeli wstawiłeś już do nagłówka odnośnik o nazwie byrd, wróćmy do pliku m.html i linii Zobacz również.

<P><EM>Zobacz również</EM>

Gibbons, Lassus, Monteverdi, Morley, Weelkes, Wilbye</P>

Nasze połączenie utworzymy, korzystając ze słowa byrd. Ale z jakiego URL należy skorzys­tać? Jak już wcześniej wspomniałam, ścieżka połączenia do odnośnika wygląda tak:

nazwa_strony#nazwa_odnośnika

Ogólne połączenie do strony B.htm wyglądałoby następująco:

<A HREF="b.html">

ale ponieważ chcemy, aby połączenie prowadziło do konkretnego miejsca w obrębie tej strony, musimy dodać do tego zapisu nazwę odnośnika:

<A HREF="b.html#byrd">

Zwróć uwagę na początkową małą literę w słowie byrd. Nazwy odnośników i połączenia rozróżniają małe i wielkie litery, tak więc wstawienie słowa Byrd byłoby błędem. Zawsze należy się upewnić, czy nazwa odnośnika zapisana w atrybucie NAME jest identyczna z tą, użytą w połączeniu po znaku #.

0x01 graphic

Częstym błędem jest umieszczanie znaku # zarówno w nazwie odnośnika, jak i w połączeniu. Pamiętaj, że służy on do oddzielenia od siebie nazw pliku i odnośnika oraz, że może być umieszczany tylko i wyłącznie w połączeniach. Nazwy odnośników nie mogą w żadnym wypadku zawierać znaku #.

Teraz, po dodaniu nowego połączenia do konkretnego fragmentu strony, linia Zobacz również wygląda następująco:

<P><EM>Zobacz również</EM>

<A HREF="b.html#byrd">Byrd</A>

Gibbons, Lassus, Monteverdi, Morley, Weelkes, Wilbye</P>

Możesz oczywiście w podobny sposób wstawić połączenia i odnośniki przy pozostałych nazwiskach kompozytorów, znajdujących się w tej linii.

Gdy wszystkie połączenia i odnośniki będą już gotowe, spróbuj przetestować funkcjono­wa­nie tak utworzonej całości. Rys. 5.13 przedstawia stronę litery M z gotowym połącze­niem przy słowie byrd.

Rysunek 5.13

Madrygały wraz z połączeniem

0x01 graphic

Rys. 5.14 przedstawia stronę, która pojawi się po wybraniu połączenia Byrd.

0x08 graphic
Rysunek 5.14

Informacje o Byrdzie

0x01 graphic

Połączenia wewnątrz tego samego dokumentu

A co zrobić, jeżeli prezentacja składa się tylko z jednej dużej strony i chciałbyś utworzyć połączenia pomiędzy poszczególnymi jej częściami? Także w takim przypadku możesz skorzystać z odnośników. W wypadku naprawdę dużych stron tego typu połączenia mogą okazać się niezbędne, aby można było w sensowny sposób poruszać się po nich. Same odnośniki należy umieścić w początkowych punktach odpowiednich sekcji dokumentu w taki sam sposób, jak robiliśmy to do tej pory. Połączenie natomiast różni się tym, że pomijana jest część określająca ścieżkę dostępu i nazwę strony, zostaje tylko znak # i naz­wa odnośnika. Jeżeli więc chcesz utworzyć połączenie wewnątrz tej samej strony do odnośnika o nazwie Section5, powinno ono wyglądać następująco:

Idź do <A HREF=#Section5>Sekcji Piątej</A>

Po wybraniu takiego połączenia przeglądarka, nie mając podanej nazwy strony docelowej, zakłada, że musi to być strona aktualnie wyświetlana i przewija ją do wybranego odnośnika. W rozdziale 6. „Więcej o formatowaniu tekstu w HTML-u”, będziesz miał okazję zobaczyć przykłady praktycznego wykorzystania tej możliwości. Stworzysz w nim kompletną stronę WWW, na której początku zostanie umieszczony spis treści. Dzięki temu spisowi osoba przeglądająca stronę będzie mogła przejść do dowolnie wybranej jej części. Będzie on zawierał połączenia do nagłówków każdej z części strony. Z kolei inne połączenia, umieszczone pod koniec każdej z części strony będą umożliwiały czytelnikom przejście do spisu treści umieszczonego na samym jej początku.

Anatomia adresu URL

Do tej pory, czytając tę książkę, dwa razy spotkałeś się z pojęciem adresów URL. W pierwszym rozdziale, „Świat WWW” wspomniałam o nich we wprowadzeniu do podsta­wowych pojęć sieci WWW, a w tym rozdziale była o nich mowa przy okazji tworzenia po­łączeń do zdalnych stron. Jeżeli kiedykolwiek przeglądałeś zasoby sieci WWW, na pewno również tam zetknąłeś się z URL-ami. Bez nich eksplorowanie sieci byłoby niemożliwe.

Jak już nadmieniłam w rozdziale 1., URL to skrót od Uniform Resource Locator, co można przetłumaczyć na uniwersalny identyfikator zasobów. Jest to adres, określający lokalizac­ję pewnej porcji informacji w Internecie. W większości przypadków będziesz mógł uniknąć wymyślania, jaki URL wstawić do połączenia, zawsze bowiem możesz wykorzystać przeglądarkę i za jej pomocą dotrzeć do żądanej strony, po czym skopiować URL i wstawić ten niezrozumiały ciąg znaków do swojego kodu HTML. Pomimo tego, warto zapoznać się bliżej z tymi adresami; wiedza ta może się czasami przydać, choćby do tego, aby zarekla­mować innym swoje strony WWW, kiedy zostaną już opublikowane w sieci.

W tym punkcie pragnę omówić dokładnie, z jakich części składa się adres URL, jak używać URL-i, aby wydobyć z sieci szukane informacje oraz jakiego typu URL-e można napotkać w Internecie (HTTP, FTP, Mailto itp.).

Z czego składa się URL

Większość URL-i składa się z trzech części: nazwy protokołu, nazwy serwera oraz katalogu wraz z nazwą pliku (patrz rys. 5.15).

0x08 graphic
0x08 graphic
0x08 graphic
0x08 graphic
0x08 graphic
Rysunek 5.15

Części składowe URL

Ścieżka dostępu

Protokół i nazwa pliku

http://daytona.raceway.com/home/www/files/race.html

Nazwa serwera

Protokół to, innymi słowy, metoda dostępu do danej strony, czyli sposób, w jaki przeglą­darka pobiera plik z sieci. Jeżeli protokołem tym jest HTTP, odpowiednia część adresu URL przybiera postać http, w wypadku protokołu FTP — ftp. Jeżeli protokołem dostępu do pliku jest Gopher, pierwsza część URL-a brzmi: gopher itd. Na serwerze, na którym znajduje się szukany plik, musi być uruchomiony program, który potrafi komunikować się za pomocą określonego w URL-u protokołu. Oznacza to, że, na przykład, za pomocą URL z pro­tokołem FTP nie uzyskasz dostępu do żadnego pliku na komputerze, na którym nie jest uruchomione oprogramowanie serwera FTP.

Nazwa serwera to system w sieci Internet, na którym przechowywane są informacje, jak, na przykład, www.netcom.com, www.aol.com, ftp.apple.com. Do tego samego serwera mogą odwoływać się URL-e z różnymi protokołami:

http://mysystem.com

ftp://mysystem.com

gopher://mysystem.com

Jeden komputer, trzy różne programy serwerowe i przeglądarka musi użyć trzech różnych metod dostępu do informacji tam zgromadzonych. Jeżeli tylko te trzy programy będą wspólnie funkcjonować na tym serwerze, wszystko będzie w jak najlepszym porządku.

Nazwa serwera może dodatkowo zawierać numer portu. Mówi on przeglądarce, że powinna otworzyć połączenie, korzystając z portu o podanym numerze, innym niż standardowy port dla danego protokołu. Informacja ta będzie wymagana tylko wtedy, gdy serwer zostanie tak skonfigurowany, aby pracował tylko na jednym, ustalonym porcie (temat ten zostanie szerzej omówiony w rozdziale 25.).

Jeżeli numer portu jest wymagany, należy umieścić go po nazwie serwera, ale przed częścią dotyczącą katalogu:

http://my-public-access-unix.com:1550/pub/file

Ostatnia część adresu URL, czyli katalog i nazwa pliku, określa położenie pliku na serwe­rze. Może to być rzeczywista nazwa katalogu i pliku albo inny sposób określenia położenia danych w systemie plików serwera (na przykład, katalogi Gophera nie są nazwami faktycz­nie istniejących katalogów).

Znaki specjalne w adresach URL

Znaki specjalne w adresach URL to wszystko, co nie jest małą lub dużą literą, cyfrą (0-9), ani żadnym z następujących symboli: znakiem dolara ($), znakiem hash (#), łącznikiem (-), podkreśleniem (_), kropką (.) ani plusem (+). Jeżeli adres zawiera jakiś znak, który zgodnie z tą definicją jest znakiem specjalnym, trzeba zapisać go w postaci kodu URL.

Kody URL składają się ze znaku procentu (%) i dwuznakowej liczby szesnastkowej ze zbioru ISO-Latin-1 (jest to podzbiór zbioru kodów ASCII), na przykład, %20 oznacza spację, %3f znak zapytania a %2f — ukośnik.

Załóżmy, że pliki, które chcesz opublikować w sieci, znajdują się w katalogu o nazwie All My Files. Pierwsze podejście do utworzenia adresu URL, wskazującego na jeden z tych plików mogłoby wyglądać następująco:

http://myhost.com/harddrive/All My Files/www/file.html

Jeżeli umieścisz ten URL w cudzysłowie jako część znacznika połączenia, zadziała on pra­widłowo. Ponieważ spacje w URL-ach są traktowane jako znaki specjalne, niektóre prze­glądarki mogą mieć problemy z poprawną ich interpretacją i mogą błędnie odczytać ścieżkę dostępu do pliku. Aby mieć pewność, że każda przeglądarka prawidłowo odczyta ten URL, powinien on wyglądać następująco:

http://myhost.com/harddrive/All%20My%20Files/www/file.html

W większości wypadków, jeżeli będziesz stosował krótkie nazwy plików i katalogów, a po­nadto będą one składały się tylko i wyłącznie ze znaków alfanumerycznych, nie będzie potrzeby korzystania ze znaków specjalnych w URL-ach. Miej to na uwadze, gdy będziesz projektował swoje strony.

HTML 4.0 i znacznik <A>

W HTML-u 4.0 zostały wprowadzone nowe, rzadziej wykorzystywane, atrybuty znacznika <A>.

Rodzaje adresów URL

Wiele typów URL-i zostało zdefiniowanych w oficjalnej specyfikacji URL (wskazówkę, gdzie możesz znaleźć aktualną wersję tego dokumentu znajdziesz w dodatku A „Źródła dodatkowych informacji”). W tym miejscu pragnę opisać tylko kilka najbardziej popular­nych rodzajów adresów URL.

HTTP

URL typu HTTP jest zdecydowanie najpopularniejszą jego formą, używaną w sieci WWW. HTTP jest skrótem od HyperText Transfer Protocol (protokół transmisji hipertekstu) — właśnie z tego protokołu korzystają serwery WWW, przesyłając informacje do przeglądarek na całym świecie.

URL typu HTTP przyjmuje z reguły podstawową postać URL:

http://www.foo.com/home/foo/

Jeżeli na końcu adresu znajduje się ukośnik, przyjmuje się, że ostatnią częścią jest nazwa katalogu. Plik, który można tym sposobem otrzymać z serwera, przyjmuje standardową naz­wę, zdefiniowaną na serwerze HTTP i zwykle jest to index.html (jeżeli strona, którą pro­jektujesz, jest stroną główną w stosunku do innych, znajdujących się w tym samym katalogu, dobrze jest nazwać ją właśnie index.html).

Oczywiście, nic nie stoi na przeszkodzie, aby w URL-u umieścić nazwę pliku. W takim przypadku wczytany zostanie plik o nazwie, która znajduje się na końcu adresu:

http://www.foo.com/home/foo/index.html

http://www.foo.com/home/foo/homepage.html

Jeżeli foo jest nazwą katalogu, poniższy URL powinien również zostać zaakceptowany:

http://www.foo.com/home/foo

W takim przypadku URL powinien kończyć się ukośnikiem, bowiem foo to nazwa katalo­gu. Jednakże większość serwerów WWW domyśla się, że chodzi o katalog i samo­dzielnie kieruje takie żądanie do właściwego pliku. Nie jest jednak wykluczone, że starsze serwery nie poradzą sobie z takim zadaniem, stąd też powinieneś zawsze wyraźnie rozróżniać, co jest plikiem a co katalogiem oraz upewnić się, czy plik standardowy jest w danym katalogu dostępny.

Anonimowe FTP

Adresy URL typu FTP wskazują pliki, znajdujące się na serwerach FTP. Zwykle są to ser­wery o anonimowym dostępie, czyli takie, do których może się zalogować każdy, używając nazwy użytkownika „anonymous” i swojego adresu e-mail jako hasła. URL-e typu FTP, podobnie jak HTTP, przyjmują standardową postać:

ftp://ftp.foo.com/home/foo

ftp://ftp.foo.com/home/foo/homepage.html

Z racji tego, że za pomocą serwera FTP można odczytać zarówno plik, jak i zawartość katalogu, zasady dotyczące ukośnika na końcu adresu są inne niż w przypadku HTTP. Pierwszy URL z powyższego przykładu spowoduje odczytanie zawartości katalogu foo, drugi natomiast spowoduje pobranie pliku homepage.html.

0x01 graphic

Poruszanie się po serwerach FTP za pomocą przeglądarki WWW może być w widocznym stopniu wolniejsze od programów, przeznaczonych tylko do obsługi FTP. Przyczyną tego jest fakt, że przeglądarka WWW nie utrzymuje otwartego połączenia z serwerem, tylko wraz z każdym żądaniem użytkownika nawiązuje je, odnajduje plik lub katalog, wykonuje odpowiednią operację i zamyka połączenie. Gdy wybierzesz połączenie hipertekstowe, za pomocą którego wchodzisz do innego katalogu, przeglądarka konstruuje na tej podstawie nowy URL, ponownie otwiera połączenie z serwerem FTP, pobiera zawartość nowego katalogu i znów przerywa łączność. Z tych powodów korzystanie z URL-i typu FTP jest zalecane tylko wtedy, gdy znane jest dokładne położenie pliku na serwerze i gdy nie ma potrzeby przeglądania drzewa katalogów.

Pomimo że przeglądarka pobiera pliki z serwera, korzystając z protokołu FTP, możesz w ten sposób odczytywać pliki HTML i wyświetlać je w przeglądarce tak samo, jakby od­bywało się to przy użyciu protokołu HTTP. Przeglądarka nie dba o to, w jaki sposób pliki hipertekstowe do niej docierają. Jeżeli tylko potrafi ona rozpoznać, że otrzymany plik jest plikiem HTML (może ona otrzymać tę informację z serwera HTTP — o tym będziemy jesz­cze rozmawiać, może też samodzielnie rozpoznać plik po jego rozszerzeniu), przetworzy go i wyświetli, tak jak zawsze. Jeżeli przeglądarka nie rozpozna formatu HTML, nie będzie to wielki problem, może bowiem go wyświetlić na ekranie (jeżeli rozpozna typ pliku i będzie wiedziała, jak to zrobić) lub zapisać na dysku.

FTP o ograniczonym dostępie

Wszystkie URL-e typu FTP, o których mowa była w poprzednim podpunkcie, dotyczyły serwerów ogólnodostępnych, czyli anonimowych. Oprócz tego, istnieje sposób dostępu do serwerów FTP, do których musimy znać nazwę użytkownika i hasło:

ftp://username:password@ftp.foo.com/home/foo/homepage.html

W powyższym URL username oznacza nazwę użytkownika, którego konto musi być zdefi­niowane na serwerze FTP, a password to oczywiście hasło dostępu do tego konta. Zwróć uwagę na to, że w takim zapisie hasło nie jest w żaden sposób chronione przed wzrokiem niepowołanych osób. Z uwagi na to należy bardzo ostrożnie posługiwać się tego typu adre­sami i uważać, czy nikt nie patrzy na ekran w momencie wpisywania hasła, a już w żad­nym wypadku nie powinno się umieszczać takich zapisów w połączeniach na ogólnodostępnych stronach WWW.

Mailto

URL typu Mailto służy do wysyłania poczty elektronicznej. Przeglądarka, obsługująca ten sposób adresowania, po wybraniu takiego połączenia powinna uruchomić procedurę edycji i wysyłania poczty lub wywołać program pocztowy, znajdujący się w pakiecie oprogramo­wania (np. Netscape Communicator lub Internet Explorer 4.0 w połączeniu z programem Outlook Express).

Istnieją jeszcze przeglądarki, które nie obsługują URL-i typu Mailto i po wybraniu tego typu połączenia wyświetlają komunikat o błędzie.

URL typu Mailto różni się od formy standardowej:

mailto:internetowy_adres_e-mail

A oto przykład:

mailto:lemay@lne.com

0x01 graphic

Jeżeli adres e-mail zawiera znak procentu (%), zamiast niego należy użyć kodu %25. Znak % jest bowiem traktowany jako znak specjalny URL.

Gopher

URL-e służące do obsługi Gophera są zapisywane standardowo, aż do nazwy serwera. W dalszej części zapis jest kodowany przez specjalne protokoły i określa ścieżkę dostępu do plików na serwerach. Katalog w Gopherze nie jest tym samym, co ścieżka dostępu do pliku w URL-ach HTTP czy FTP. Opis zasad kodowania nazw katalogów wykracza poza ramy tej książki, ale jeżeli jesteś nim zainteresowany, możesz go znaleźć w szczegółowej specyfikacji standardu URL.

W większości wypadków będziesz używał URL-a typu Gopher tylko po to, aby uzyskać dostęp do serwera. Taki adres wygląda następująco:

gopher://gopher.myhost.com/

Jeżeli jednak będziesz chciał umieścić na stronie połączenie do konkretnego pliku na serwe­rze Gophera, lepiej jest dojść do niego za pomocą przeglądarki, zamiast konstruować go własnymi siłami. Spróbuj więc dojść do tego pliku, a następnie skopiuj go i wstaw do kodu swojej strony.

Usenet

URL-e służące do obsługi list dyskusyjnych Usenet mogą mieć dwie formy:

news:name_of_newsgroupnews:message-id

Pierwsza forma jest używana do odczytu całej listy, na przykład, comp.infosystems. www.authoring.html lub alt.gothic. Jeżeli przeglądarka obsługuje tego typu URL-e (bez­pośrednio lub poprzez specjalny program), taki zapis spowoduje odczytanie listy wszyst­kich artykułów dostępnych w ramach danej grupy.

Druga forma umożliwia odczyt konkretnego artykułu. Każdy artykuł, znajdujący się na liście dyskusyjnej posiada swój unikalny numer ID, który wygląda następująco:

<lemayCt76Jq.CwG@netcom.com>

Aby wykorzystać ten numer w adresie URL, wystarczy usunąć nawiasy kątowe i wstawić go po słowie news:

news:lemayCt76Jq.CwG@netcom.com

Wstawiając tego typu połączenia, musisz pamiętać o tym, że artykuły na serwerach Usenet nie są przechowywane bez końca i po upływie jakiegoś czasu są usuwane. Numer ID takie­go artykułu stanie się po jakimś czasie nieaktualny. Jedyny sposób na wstawienie stałego połączenia do artykułu, to skopiowanie go w postaci pliku na serwer, na którym znajduje się prezentacja i podłączenie jako pliku tekstowego lub HTML.

Obydwa sposoby dostępu do wiadomości zakładają, że artykuły będą odczytywane z serwe­ra NNTP i mogą być używane tylko wtedy, gdy takowy będzie zdefiniowany w zmiennej środowiskowej lub ustawieniach przeglądarki. Dlatego też URL-e tego typu nadają się bar­dziej do lokalnego odczytywania artykułów, niż do umieszczania w połączeniach na stro­nach WWW.

0x01 graphic

Nie wszystkie przeglądarki obsługują URL-e typu News i Mailto.

File

Adresy URL tego typu umożliwiają dostęp do plików na lokalnych dyskach. Innymi słowy, odnoszą się do plików znajdujących się w tym samym systemie komputerowym co prze­glądarka. URL przyjmuje w przypadku plików lokalnych jedną z dwóch postaci. W pierw­szej z nich nazwa serwera jest pusta (stąd trzy ukośniki obok siebie), w drugiej z kolei w miejscu nazwy serwera pojawia się słowo localhost.

file:///dir1/dir2/file
file://localhost/dir1/dir2
/file

Jeden z tych sposobów na pewno zadziała (jest to zależne od przeglądarki).

Adres URL tego typu bardzo przypominają adresy FTP. Tak naprawdę, to jeżeli w URL-u typu file podać nazwę serwera inną niż pusta lub lolcalhost, przeglądarka będzie próbo­wała skopiować ten plik za pomocą protokołu FTP. Obydwa poniższe URL-e odniosą dokładnie taki sam skutek:

file://somesystem.com/pub/dir/foo/file.html

ftp://somesystem.com/pub/dir/foo/file.html

Chyba najlepszym sposobem na wykorzystanie URL typu file jest umieszczenie lokalnej strony w parametrach przeglądarki jako tej, która będzie wywoływana natychmiast po uru­chomieniu programu. Może to być z powodzeniem strona lokalna, zawierająca najczęściej wykorzystywane punkty startowe do wędrówki po sieci.

Problem z URL-ami typu file polega na tym, że odnoszą się one do plików w tym samym systemie, w którym pracuje przeglądarka, a nie w systemie, z którego pochodzi strona. Jeże­li ktoś napotka tego typu połączenie na Twojej stronie i spróbuje podążyć jego śladem, przeglądarka będzie szukać plików w jego systemie, co oczywiście w 99,99 procentach przypadków, nie może się udać. Dodatkowym minusem jest to, że ścieżki dostępu w tego typu URL-ach są ścieżkami bezwzględnymi, co znacznie utrudnia przenoszenie plików pomiędzy różnymi systemami.

Jeżeli zamierzasz wstawiać połączenia do plików umieszczonych w tym samym systemie, w którym znajduje się strona wyjściowa, staraj się korzystać ze ścieżek względnych a nie z adresów URL typu file. Używanie ścieżek względnych do plików lokalnych a innych URL-i do plików zdalnych całkowicie eliminuje potrzebę korzystania z file.

Podsumowanie

W rozdziale, którego lekturę właśnie zakończyłeś, opisałam wszystko, co powinieneś wie­dzieć o połączeniach. One to właśnie zamieniają zbiór niezwiązanych ze sobą stron w dos­konały, wzajemnie powiązany system informacyjny.

Do tworzenia połączeń służą znaczniki <A>...</A>, zwane też znacznikami odnośników. Posiadają one kilka atrybutów, które pozwalają na określenie nazwy i położenia pliku doce­lowego (HREF) oraz nazwy odnośnika (NAME).

Łącząc ze sobą strony, znajdujące się na dysku lokalnym, możesz określić ich położenie za pomocą ścieżki względnej lub bezwzględnej. W wypadku połączeń lokalnych zdecydowa­nie zalecane jest stosowanie ścieżek względnych, bowiem pozwalają one na łatwiejsze przeno­szenie całej prezentacji w inne miejsca. Ścieżki bezwzględne mogą spowodować, że połą­czenia staną się nieaktualne.

Jeżeli chcesz utworzyć połączenie do strony znajdującej się w Internecie (strony zdalnej), atrybut HREF powinien zawierać jej URL. Adres ten możesz łatwo skopiować do kodu strony. Wystarczy tylko znaleźć tę stronę za pomocą przeglądarki, następnie skopiować URL i wstawić go w odpowiednim miejscu kodu HTML.

Aby tworzyć połączenia do konkretnych miejsc na stronach WWW, najpierw musisz wsta­wić odnośniki w punktach docelowych. Możesz do tego wykorzystać znaczniki połączenia <A>…</A>, z tym, że zamiast atrybutu HREF musisz wstawić atrybut NAME, który określa nazwę odnośnika. Wtedy możesz już tworzyć połączenia do tego miejsca, używając nazwy strony, znaku # i nazwy odnośnika.

Adresy URL określają lokalizację stron, plików i informacji innego typu, znajdujących się w sieci Internet. W zależności od rodzaju informacji, URL może składać się z różnych elemen­tów, najczęściej jednak zawiera on nazwę protokołu i adres serwera internetowego. Najbar­dziej powszechnym zastosowaniem adresów URL jest określanie położenia stron WWW (http), katalogów i plików na serwerach FTP (ftp), informacji na serwerach Gophera (gopher), adresów poczty elektronicznej (mailto) i artykułów w grupach dyskusyjnych (news).

Warsztat

Gratuluję, czytając ten rozdział, wiele się nauczyłeś! Teraz nadszedł czas na utrwalenie tych wiadomości. W tej części znajdziesz szereg pytań dotyczących połączeń. Pytania umieszczone w quizie koncentrują się na innych ważnych zagadnieniach, które powinieneś zapamiętać. W dalszej części rozdziału znajdziesz odpowiedzi na te pytania. W ćwiczeniach podanych na samym końcu tego rozdziału zmodyfikujesz listy utworzone w poprzednim rozdziale, łącząc je z innymi stronami WWW.

Pytania i odpowiedzi

P. Moje połączenia wcale nie są wyróżnione na niebiesko czy fioletowo. Wyglądają jak zwykły tekst.

O. Czy przypadkiem nie pomyliłeś ze sobą atrybutów NAME i HREF? A może zapomniałeś zamknąć cudzysłów po nazwie pliku docelowego? Obydwa te błędy mogą spowodować, że tekst połączenia nie będzie wyróżniony, tak jak powinien.

P. Wstawiłem URL do połączenia, które jest prawidłowo wyróżnione na stronie, ale po jego wybraniu pojawia się komunikat, że przeglądarka nie może tej strony znaleźć. Dlaczego w takim razie tekst połączenia wciąż pozostaje wyróżniony?

O. Przeglądarka wyświetla tekst połączenia w postaci wyróżnionej niezależnie od tego, czy połączenie jest prawidłowe, czy też nie. Tak naprawdę, system komputerowy nie musi być nawet podłączony do Internetu, a wszystkie połączenia z punktu widzenia przeglą­darki pozostaną wciąż połączeniami i dlatego też będą odpowiednio wyświetlane. Jedy­nym sposobem na to, aby stwierdzić, czy połączenie jest prawidłowe, czy nie, jest wy­próbowanie go.

Jeżeli przeglądarka nie potrafi znaleźć strony docelowej połączenia, należy koniecznie znaleźć tego przyczynę. Upewnij się, czy komputer jest podłączony do sieci oraz czy URL został poprawnie wpisany. Sprawdź, czy obydwa cudzysłowy są na swoim miejscu i czy są to cudzysłowy górne. Niektóre przeglądarki wyświetlają URL strony docelowej na pasku statusu w dolnej części okna, gdy najedziesz kursorem na tekst połączenia. Sprawdź czy tekst, który tam się pojawia, jest taki, jak być powinien.

Jeżeli wszystko zawiedzie, spróbuj otworzyć nieszczęsny URL bezpośrednio w prze­glądarce i zobacz, co się stanie. Jeżeli i to nie zadziała, powody mogą być następujące:

P. Czy mogę wstawić URL do połączenia?

O. Oczywiście. Jeżeli tylko będziesz w stanie wydobyć URL za pomocą przeglądarki, możesz wstawić go do połączenia. Zauważ jednak, że niektóre przeglądarki obsługują takie URL-e, których nie są w stanie obsłużyć inne, na przykład, Lynx bardzo sprawnie obsługuje URL-e typu Mailto. Po wybraniu takiego adresu prosi użytkownika o podanie tematu i treści wiadomości, po czym ją wysyła. Inne przeglądarki, które nie obsługują URL-i typu Mailto będą, po wybraniu takiego połączenia, upierać się, że jest ono błędne. Tak więc może zdarzyć się, że URL będzie w porządku, ale przeglądarka okaże się niezdol­na do jego obsłużenia.

P. Czy można używać obrazów jako połączeń?

O. Tak. Wszystkiego na ten temat dowiesz się z rozdziału 7. „Wykorzystywanie obrazów, koloru i tła”, natomiast w rozdziale 16. „Tworzenie i stosowanie map odsyłaczy” dowiesz się, jak można tworzyć mapy odsyłaczy.

P. Opisałeś tylko dwa --> [Author:MMP] atrybutów znacznika <A>, to znaczy HREF i NAME. Nie ma ich przypadkiem więcej?

O. Owszem, są. Znacznik <A> posiada całe mnóstwo atrybutów, takich jak REL, REV, SHAPE, ACCESSKEY czy TITLE. Większość z nich jest jednak wykorzystywana głównie przez narzędzia, które automatycznie generują połączenia między stronami lub przez przeglądarki lepiej wykorzystujące połączenia niż te, powszechnie dostępne. Ponieważ 99 procent czytelników tej książki nie będzie używać tego typu narzędzi, będę uparcie ignorowała wszystkie atrybuty, z wyjątkiem oczywiście HREF i NAME.

Jednakże dla tych, którzy są naprawdę zainteresowani tymi atrybutami, sporządziłam w dodatku B ich krótkie podsumowanie oraz zamieściłam wskazówki, gdzie w Interne­cie można znaleźć więcej informacji na ich temat.

P. Moje połączenia nie prowadzą do właściwych odnośników. Zawsze, kiedy wybiorę jedno z nich, strona jest wyświetlana od początku a nie od miejsca oznaczonego odnośnikiem. Co jest grane?

O. Czy aby na pewno nazwa odnośnika, którą wpisujesz po znaku # jest identyczna z tą, która znajduje się w jego nazwie? Pamiętaj, że nazwy odnośników rozróżniają małe i wielkie litery, więc zwróć na to baczną uwagę. Niektóre przeglądarki, nie mogąc zna­leźć na stronie podanego w połączeniu odnośnika, będą próbowały znaleźć inny, który będzie możliwie jak najbardziej podobny do szukanego. W takim wypadku różnica wielkości jednej litery może ujść płazem, ale nie wszystkie, niestety, to potrafią. Najczęs­tszą przyczyną tego typu problemów jest niezgodność nazw w połączeniach i odnośni­kach. Aha, zwróć uwagę na to, czy przypadkiem nie wstawiłeś znaku # w naz­wie odnoś­nika, możesz to bowiem zrobić tylko w połączeniu.

P. Z treści rozdziału wynika, że URL-e typu file nie są zbyt przydatne. Do czego właściwie miałyby być mi potrzebne?

O. Są przynajmniej dwa powody. Po pierwsze, może się zdarzyć, że Twoje strony będą miały wielu użytkowników w lokalnym systemie (np. w Uniksie) i im właśnie zechcesz udostępnić pewne pliki. URL typu file sprawi, że wszyscy użytkownicy tego systemu będą mieli dostęp do tych danych, natomiast nikt z zewnątrz nie będzie miał możliwości ich odczytania, gdyż nie będzie miał dostępu do tych dysków, do których prowadzą połączenia.

Drugi dobry powód, dla którego warto używać URL-i typu file, to po prostu chęć sko­rzystania z zasobów zgromadzonych na lokalnym dysku. Być może, zechcesz skorzystać z informacji w postaci plików HTML, znajdujących się na płycie CD-ROM i w tym celu utworzysz połączenie do plików z tego krążka. W takim przy­padku, kiedy prezentacja oparta jest na płycie, którą czytelnicy muszą posiadać, korzystanie z URL-i typu file ma swoje uzasadnienie.

P. Czy URL typu Mailto może zawierać temat wiadomości?

O. Nie. Zgodnie z aktualną definicją URL-a typu Mailto, jedyną informacją, którą można w nim umieścić, jest adres poczty elektronicznej. Jeżeli naprawdę musisz wcześniej określić temat wiadomości lub jakąś część jej treści, zastanów się nad wykorzystaniem do tego celu formularzy HTML.

Quiz

  1. Jakie dwa elementy są potrzebne do utworzenia połączenia w języku HTML?

  2. Co to jest ścieżka względna? Dlaczego stosowanie ścieżek względnych jest korzystne?

  3. Co to jest ścieżka bezwzględna?

  4. Co to są odnośniki i do czego są wykorzystywane?

  5. Jakie są rodzaje URL-i oprócz URL-i HTTP (do stron WWW)?

Odpowiedzi

  1. Aby stworzyć połączenie, będziesz potrzebował nazwy lub adresu URL pliku bądź strony WWW, do której chcesz stworzyć połączenie oraz tekstu, który użytkownik będzie mógł wskazać, aby przejść do tej strony.

  2. Ścieżka względna wskazuje na plik, którego położenie określane jest względem aktualnego pliku. Ścieżki względne są przenośne, co oznacza, iż po przeniesieniu plików w inne miejsce dysku lub po zmianie nazwy folderu, ścieżki takie wymagają minimalnych modyfikacji lub wręcz w ogóle nie trzeba ich zmieniać.

  3. Ścieżki bezwzględne określają położenie strony, poczynając od najwyższego poziomu hierarchii folderów, a następnie wszystkie kolejne foldery w hierarchii i kończą na nazwie pliku.

  4. Odnośnik oznacza miejsce dokumentu HTML, do którego możesz stworzyć połączenie. Połączenia umieszczane w tej samej oraz w innych stronach WWW mogą powodować przejście do tego miejsca, a nie na sam początek strony.

  5. Inne typy URL-i to: URL-e FTP (wskazujące na pliki znajdujące się na serwerach FTP), URL-e do plików przechowywanych na lokalnym dysku, URL-e Mailto --> [Author:MMP] (stosowane do przesyłania wiadomości poczty elektronicznej), URL-e Gophera (wskazujące na pliki przechowywane na serwerach Gopher) oraz URL-e Usenet (wskazujące na grupy dyskusyjne lub konkretne artykuły).

Ćwiczenia

  1. Czy pamiętasz listę tematów, którą stworzyłeś jako pierwsze ćwiczenie zadane pod koniec poprzedniego rozdziału? Stwórz połączenie łączące odpowiedni temat tej listy ze stroną WWW, zawierającą jego rozwinięcie (stworzyłeś ją jako drugie ćwiczenie w poprzednim rozdziale).

  2. Teraz otwórz stronę stworzoną w drugim ćwiczeniu w poprzednim rozdziale i utwórz w niej połączenie z pierwszą stroną (tą zawierającą listę tematów). Poza tym odszukaj na WWW strony poświęcone tym samym zagadnieniom i utwórz połączenia do nich. Powodzenia.

150

HTML 4 - Vademecum profesjonalisty

151

Wszystko o połączeniach

???co to za ornitologiczne skojarzenie

czy całe dwa to kilka?

dużą czy małą literą?

4



Wyszukiwarka

Podobne podstrony:
R-01, ## Documents ##, HTML 4 - Czrna księga WebMastera
R-D-H, ## Documents ##, HTML 4 - Czrna księga WebMastera
R-D-FMP, ## Documents ##, HTML 4 - Czrna księga WebMastera
R-18MP, ## Documents ##, HTML 4 - Czrna księga WebMastera
R-27MP, ## Documents ##, HTML 4 - Czrna księga WebMastera
Rozdzial 2 cz3, ## Documents ##, HTML 4 - Czrna księga WebMastera
R-24MP, ## Documents ##, HTML 4 - Czrna księga WebMastera
R-08MP, ## Documents ##, HTML 4 - Czrna księga WebMastera
R-D-GMP, ## Documents ##, HTML 4 - Czrna księga WebMastera
R-04, ## Documents ##, HTML 4 - Czrna księga WebMastera
R-20MP, ## Documents ##, HTML 4 - Czrna księga WebMastera
R-30MP, ## Documents ##, HTML 4 - Czrna księga WebMastera
R-D-EMP, ## Documents ##, HTML 4 - Czrna księga WebMastera
R-19MP, ## Documents ##, HTML 4 - Czrna księga WebMastera
R-21MP, ## Documents ##, HTML 4 - Czrna księga WebMastera
Rozdzial 2 cz2a, ## Documents ##, HTML 4 - Czrna księga WebMastera
R-09MP, ## Documents ##, HTML 4 - Czrna księga WebMastera
R-22MP, ## Documents ##, HTML 4 - Czrna księga WebMastera
R-12MP, ## Documents ##, HTML 4 - Czrna księga WebMastera

więcej podobnych podstron