HTML I XHTML Dla Każdego

IDZ DO
PRZYKADOWY ROZDZIA
SPIS TRECI
KATALOG KSIEK
KATALOG ONLINE
ZAMW DRUKOWANY KATALOG
TWJ KOSZYK
DODAJ DO KOSZYKA
CENNIK I INFORMACJE
ZAMW INFORMACJE
O NOWOCIACH
ZAMW CENNIK
CZYTELNIA
FRAGMENTY KSIEK ONLINE
HTML i XHTML
dla kadego
Autor: Laura Lemay
Tumaczenie: ukasz Zieliski (rozdz. 1 5, 13, 14),
Marzena Baranowska (rozdz. 6, 7 12, 15, 16)
ISBN: 83-7361-239-4
Tytu oryginau: Teach Yourself Web Publishing
with HTML and XHTML
Format: B5, stron: 464
Prawdopodobnie najwiksz zalet WWW jest to, e nie trzeba prowadzi wielkiego
przedsibiorstwa, aby udostpnia informacje i produkty czytelnikom i klientom na
caym wiecie. Wystarczy komputer z dostpem do internetu i ch uczenia si.
Skoro czytasz te sowa, prawdopodobnie i Ty chciaby zaistnie w Sieci.
Pytanie brzmi: od czego zacz?
W internecie mona znale samouczki, instrukcje, mnstwo przykadw i darmowych
narzdzi majcych uatwi publikowanie na WWW. Jest te wiele innych ksiek na ten
temat. Przewaga ksiki HTML i XHTML dla kadego bierze si z faktu, e wszystkie
materiay s dostpne w jednym miejscu: informacje potrzebne do opanowania jzyka
HTML, umieszczania stron na serwerze, tworzenia grafiki na potrzeby WWW
i utrzymywania funkcjonalnoci i sprawnoci swojej witryny. Znajdziesz tu podpowiedzi,
sugestie i przykady pokazujce, jak projektowa caociow struktur witryny,
a nie tylko ukad sw na pojedynczych stronach. Ta ksika nie uczy jak stworzy
serwis WWW ona uczy jak stworzy dobr i nieprzecitn stron internetow.
Ksika opisuje midzy innymi:
Podstawow struktur strony WWW
Tworzenie czy pomidzy stronami
Formatowanie tekstu za pomoc HTML-a i CSS
Uycie tabel, projektowanie formularzy
Grafik i multimedia na stronach WWW
Podstawy jzykw JavaScript i DHTML
Publikowanie witryny na serwerze
Wydawnictwo Helion
ul. Chopina 6
44-100 Gliwice
tel. (32)230-98-63
e-mail: helion@helion.pl
Ksika nie koncentruje si na konkretnej platformie systemowej. Zawarte w niej

informacje zachowuj swoj przydatno niezalenie od tego, czy uywa si komputera
PC i systemu Windows, Macintosha, ktrej z odmian Uniksa, czy te jeszcze innego
systemu. Uzyskan tu wiedz bdzie mona stosowa do rozwijania swoich stron
WWW przy uyciu dowolnie wybranego systemu.
Spis treci
O Autorach ...................................................................................... 13
Wprowadzenie ................................................................................. 15
Rozdzia 1. Wprowadzenie do jzyka HTML......................................................... 19
Jzyk HTML .....................................................................................................................19
Jzyk HTML opisuje struktur strony ........................................................................20
Jzyk HTML nie opisuje ukadu strony......................................................................20
Dlaczego to dziaa w ten sposb.................................................................................21
Jzyk HTML jest jzykiem oznacze .........................................................................22
Krtka historia znacznikw HTML ............................................................................22
Aktualny standard: XHTML 1.0 .......................................................................................23
Jak wyglda jzyk HTML .................................................................................................24
Uwaga o formatowaniu...............................................................................................28
Uywanie kaskadowych arkuszy stylw...........................................................................28
Umieszczanie atrybutw w znacznikach ....................................................................29
Programy przydatne w pisaniu w jzyku HTML ..............................................................30
Podsumowanie ..................................................................................................................31
Rozdzia 2. Rozwj od podstaw .......................................................................... 33

Tworzenie struktury kodu HTML .....................................................................................33
Znacznik <html>.........................................................................................................34
Znacznik <head>.........................................................................................................34
Znacznik <body> ........................................................................................................35
Tytu ..................................................................................................................................36
Nagwki ...........................................................................................................................37
Akapity ..............................................................................................................................39
Listy...................................................................................................................................40
Znaczniki tworzce listy .............................................................................................41
Listy numerowane.......................................................................................................42
Dostosowywanie list numerowanych .........................................................................43
Listy punktowane........................................................................................................46
Dostosowywanie list punktowanych...........................................................................46
Listy definicji ..............................................................................................................49
Zagniedanie list .......................................................................................................50
Komentarze .......................................................................................................................51
Podsumowanie ..................................................................................................................52
HTML i XHTML dla kadego
Rozdzia 3. Wszystko o czach ......................................................................... 55

Jak tworzy cza ..............................................................................................................55
<a> znacznik tworzcy cza .................................................................................55
czenie stron lokalnych ciekami wzgldnymi i bezwzgldnymi ................................60
cieki bezwzgldne...................................................................................................61
Ktre cieki s lepsze wzgldne czy bezwzgldne? ............................................62
cza do innych dokumentw w sieci ..............................................................................63
cza do fragmentw stron ...............................................................................................67
Jak tworzy cza i zakotwiczenia ..............................................................................68
Podczanie zakotwicze wewntrz dokumentu.........................................................73
Anatomia adresu URL.......................................................................................................74
Czci adresu URL .....................................................................................................74
Znaki specjalne w adresach URL ...............................................................................75
Rodzaje adresw URL ......................................................................................................76
Protok HTTP............................................................................................................76
Anonimowy dostp do serwerw FTP........................................................................77
Dostp do serwerw FTP z podaniem nazwy uytkownika .......................................78
Adresy URL typu mailto.............................................................................................78
Grupy dyskusyjne Usenet ...........................................................................................79
Plikowe adresy URL ...................................................................................................80
Podsumowanie ..................................................................................................................81
Rozdzia 4. Formatowanie tekstu ....................................................................... 83

Elementy poziomu znakowego .........................................................................................84
Znaczniki stylw logicznych ......................................................................................84
Znaczniki stylw fizycznych ......................................................................................86
Formatowanie znakw waciwociami CSS....................................................................87
Ozdabianie tekstu waciwo text-decoration ......................................................88
Waciwoci czcionek.................................................................................................89
Zachowywanie ukadu tekstu ............................................................................................90
Kreski poziome .................................................................................................................92
Atrybuty znacznika <hr> ............................................................................................93
Wymuszanie podziau wiersza ..........................................................................................95
Sygnaturki .........................................................................................................................97
Akapity cytowane..............................................................................................................98
Znaki specjalne..................................................................................................................99
Skadnia encji znakowych...........................................................................................99
Zapis znakw zarezerwowanych ..............................................................................100
Wyrwnywanie tekstu.....................................................................................................102
Wyrwnywanie pojedynczych elementw ...............................................................102
Wyrwnywanie wielu elementw jednoczenie.......................................................103
Kroje pisma i wielko czcionki .....................................................................................104
Zmiana wielkoci czcionki .......................................................................................105
Zmiana kroju pisma ..................................................................................................106
Modyfikacja czcionek arkuszami stylw..................................................................107
Znaczniki <nobr> oraz <wbr> ........................................................................................108
Podsumowanie ................................................................................................................118
Rozdzia 5. Obrazki, kolory i ta........................................................................ 123

Obrazki na stronach WWW ............................................................................................123
Formaty plikw graficznych ...........................................................................................124
Format GIF................................................................................................................125
Format JPEG.............................................................................................................125
Format PNG ..............................................................................................................126
Spis treci
7
Obrazki w tekcie: znacznik <img> ................................................................................126
Dostarczanie etykiet rezerwowych ...........................................................................127
Obrazki a tekst.................................................................................................................130
Wyrwnywanie obrazkw i tekstu............................................................................131
Zawijanie tekstu przy obrazkach ..............................................................................133
Dopasowywanie odstpw wok obrazkw............................................................136
Obrazki a cza ................................................................................................................137
Inne przydatne umiejtnoci............................................................................................141
Wymiary obrazkw i skalowanie..............................................................................141
Jeszcze o obramowaniach obrazkw ........................................................................142
Stosowanie koloru ...........................................................................................................143
Nazywanie kolorw ..................................................................................................143
Zmienianie koloru ta................................................................................................144
Zmienianie koloru tekstu ..........................................................................................145
Zmienianie koloru znakw .......................................................................................146
Okrelanie kolorw waciwociami CSS ................................................................147
Ozdabianie ta tapet .......................................................................................................147
Podpowiedzi dodatkowe .................................................................................................149
Czy ten obrazek naprawd jest potrzebny?...............................................................150
Mae jest pikne ........................................................................................................150
Kulturalne zamieszczanie obrazkw.........................................................................151
Podsumowanie ................................................................................................................151
Rozdzia 6. Tabele ........................................................................................... 153

Tworzenie tabel ...............................................................................................................154
Elementy skadowe tabeli................................................................................................154
Element <table> ........................................................................................................155
Krtki opis tabeli.......................................................................................................155
Wiersze i komrki.....................................................................................................156
Puste komrki ...........................................................................................................157
Tytuy........................................................................................................................159
Zmiana rozmiaru tabel, obramowania i komrek ...........................................................162
Ustawianie szerokoci tabeli.....................................................................................162
Zmiana obramowania tabeli......................................................................................163
Marginesy komrek ..................................................................................................164
Odstpy midzy komrkami .....................................................................................164
Szeroko kolumn.....................................................................................................165
Ustawianie podziau wierszy ....................................................................................166
Kolor tabeli i komrek oraz wyrwnanie ...........................................................................167
Zmiana koloru tabeli oraz ta komrek.....................................................................168
Zmiana koloru obramowania ....................................................................................169
Wyrwnanie zawartoci tabeli ........................................................................................171
Wyrwnanie tabeli ....................................................................................................171
Wyrwnanie zawartoci komrek.............................................................................172
Wyrwnanie tytuu....................................................................................................173
Scalanie komrek ............................................................................................................174
Zaawansowane sposoby ulepszania tabel .......................................................................182
Grupowanie i wyrwnanie kolumn...........................................................................182
Grupowanie i wyrwnanie wierszy ..........................................................................185
Atrybuty frame i rules...............................................................................................187
Inne elementy i atrybuty tabel.........................................................................................188
Podsumowanie ................................................................................................................188
Rozdzia 7. Formatowanie stron za pomoc kaskadowych arkuszy stylw.......... 193

Uaktywnianie arkuszy stylw na stronie ............................................................................193
Tworzenie arkuszy stylw na poziomie strony.........................................................194
Tworzenie arkuszy stylw na poziomie witryny ......................................................194
Selektory..........................................................................................................................195
Selektory kontekstowe ..............................................................................................196
Klasy i identyfikatory ...............................................................................................197
Jednostki miar .................................................................................................................198
Waciwoci pl ..............................................................................................................199
Sterowanie rozmiarem ..............................................................................................200
Obramowanie............................................................................................................200
Marginesy i wypenienie...........................................................................................202
Elementy pywajce ..................................................................................................206
Pozycjonowanie CSS ......................................................................................................210
Pozycjonowanie wzgldne........................................................................................211
Pozycjonowanie bezwzgldne ..................................................................................212
Nakadanie elementw..............................................................................................215
Modyfikowanie wygldu tabeli.......................................................................................217
Znacznik <body> ............................................................................................................219
cza ...............................................................................................................................220
Tworzenie ukadw z wieloma kolumnami ....................................................................221
Podsumowanie ................................................................................................................224
Rozdzia 8. Projektowanie formularzy ............................................................... 225

Forma i funkcja formularzy.............................................................................................226
Zastosowanie etykiety <form>........................................................................................230
Tworzenie elementw formularza za pomoc znacznika <input>..................................232
Tworzenie pl tekstowych ........................................................................................232
Tworzenie pola hasa ................................................................................................233
Tworzenie przyciskw wysyajcych .......................................................................234
Tworzenie przyciskw zerowania.............................................................................235
Tworzenie pl wyboru ..............................................................................................235
Tworzenie przyciskw opcji .....................................................................................236
Uycie obrazw jako przyciskw wysyajcych ......................................................236
Tworzenie przyciskw rodzajowych ........................................................................237
Ukryte pola formularza .............................................................................................237
Pole pobierania pliku ................................................................................................238
Uycie innych elementw kontrolnych...........................................................................238
Uycie elementu button ............................................................................................239
Tworzenie duych pl tekstowych za pomoc elementu textarea ............................239
Tworzenie menu za pomoc elementw select i option................................................240
Elementy dodatkowe .......................................................................................................245
Wywietlanie etykiet za pomoc elementu label ......................................................245
Grupowanie elementw za pomoc elementw fieldset i legend .............................246
Zmiana domylnej kolejnoci poruszania si po polach formularza ........................246
Uycie klawiszy dostpu...........................................................................................247
Tworzenie elementw nieaktywnych i tylko do odczytu ...............................................247
Zastosowanie kaskadowych arkuszy stylw ...................................................................248
Planowanie formularzy ...................................................................................................253
Podsumowanie ................................................................................................................254
Rozdzia 9. Mapy obrazw i grafiki animowane ................................................. 257

Czym s mapy obrazw?.................................................................................................257
Mapy obrazw dziaajce po stronie klienta ...................................................................258
Mapy obrazw a przegldarki tekstowe ...................................................................259
Spis treci
9
Tworzenie map obrazw dziaajcych po stronie klienta ...............................................259
Przygotowanie obrazu...............................................................................................259
Okrelanie wsprzdnych ........................................................................................260
Znaczniki <map> i <area>........................................................................................262
Atrybut usemap.........................................................................................................264
Tworzenie przezroczystych plikw GIF .........................................................................268
Wybr koloru przezroczystoci ................................................................................268
Antyaliasowanie i przezroczysto ...........................................................................268
Tworzenie animowanych GIF-w...................................................................................269
Programy uatwiajce kompilacj animowanych GIF-w ..............................................269
Tworzenie animowanych GIF-w...................................................................................270
Szukanie optymalnej wielkoci animacji ...........................................................................271
Programy uatwiajce tworzenie obrazw ......................................................................274
Przydatne waciwoci oprogramowania..................................................................275
Podsumowanie ................................................................................................................279
Rozdzia 10. Dodawanie dwikw, wideo i innych elementw multimedialnych... 281

Sposoby prezentacji dwikw oraz obrazw wideo......................................................282
Stare, ale uyteczne rozwizanie doczanie..............................................................283
Osadzanie dwikw i obrazw wideo ...........................................................................290
Uycie elementu <embed> .......................................................................................291
Uycie elementu <object> ........................................................................................294
czenie elementw <embed> i <object> ................................................................295
Osadzanie animacji Flash .........................................................................................295
Osadzanie animacji Shockwave................................................................................296
Osadzanie RealAudio i RealVideo ...........................................................................296
Techniki multimedialne ............................................................................................297
Typy plikw dwikowych i wideo ................................................................................303
Odtwarzacze i moduy rozszerzajce ..............................................................................306
Windows Media Player.............................................................................................306
Flash Player firmy Macromedia................................................................................307
Shockwave firmy Macromedia .................................................................................308
QuickTime 6 firmy Apple.........................................................................................308
RealOne Player .........................................................................................................309
WinAmp....................................................................................................................310
Podsumowanie ................................................................................................................310
Rozdzia 11. JavaScript ..................................................................................... 313

Charakterystyka jzyka JavaScript..................................................................................313
Zalety jzyka JavaScript ...........................................................................................314
Znacznik <script>............................................................................................................315
Struktura skryptw pisanych w jzyku JavaScript ...................................................316
Atrybut src ................................................................................................................317
Podstawowe polecenia i struktura jzyka........................................................................317
Waciwoci i metody ...............................................................................................318
Zdarzenia i JavaScript...............................................................................................320
Zmienne ....................................................................................................................322
Operatory i wyraenia...............................................................................................322
Podstawy programowania w jzyku JavaScript ..............................................................323
Czym jest program? ..................................................................................................324
Wicej o programowaniu w JavaScript ....................................................................326
Podsumowanie ................................................................................................................326
10
Rozdzia 12. Praca z JavaScript ......................................................................... 329

Tworzenie generatora losowych pocze ......................................................................329
Weryfikacja danych w formularzach ..............................................................................337
Tworzenie podmienianych obrazw ...............................................................................343
Podsumowanie ................................................................................................................346
Rozdzia 13. Opracowywanie ukadw ramek i okien czonych........................... 347

Czym s ramki i w ktrych przegldarkach dziaaj.......................................................347
Tworzenie okien czonych.............................................................................................349
Znacznik <base> .......................................................................................................352
Opracowywanie ukadw ramek.....................................................................................353
Znacznik <frameset> ................................................................................................354
Znacznik <frame>.....................................................................................................357
Znacznik <noframes> ...............................................................................................357
Okrelanie wygldu rozgranicze ...................................................................................359
Dodatkowe atrybuty..................................................................................................360
Tworzenie zoonych ukadw ramek.............................................................................360
Magiczne wartoci atrybutu target............................................................................371
Ramki swobodne .............................................................................................................372
Podsumowanie ................................................................................................................375
Rozdzia 14. Techniki DHTML ............................................................................ 377

Czym waciwie s techniki DHTML? ...........................................................................378
Uywanie obiektowego modelu dokumentu ...................................................................380
Typy danych w obiektach DOM...............................................................................380
Obiekty w strukturze DOM ......................................................................................381
Zastosowanie struktury DOM...................................................................................381
Techniki DHTML a niespjno przegldarek ...............................................................386
Rozpoznawanie przegldarek ...................................................................................386
Rozpoznawanie moliwoci przegldarki.................................................................388
Sprawdzanie obecnoci obiektw .............................................................................389
Grupowanie elementw znacznikiem <div>...................................................................389
Pozycjonowanie elementw <div> ...........................................................................390
Manipulacja elementami za pomoc skryptw JavaScript .......................................394
Kontynuacja nauki technik DHTML...............................................................................401
Podsumowanie ................................................................................................................402
Rozdzia 15. Publikowanie witryny ..................................................................... 403

Sposb dziaania i przeznaczenie serwera WWW ..........................................................403
Co jeszcze potrafi serwery WWW? ........................................................................404
Lokalizowanie serwera WWW .......................................................................................405
Korzystanie z serwera WWW w szkole lub w pracy................................................405
Korzystanie z usug komercyjnych...........................................................................406
Zakadanie wasnego serwera ...................................................................................407
Organizowanie i instalowanie plikw HTML.................................................................407
Pytania do webmastera .............................................................................................407
Przechowywanie plikw w folderach .......................................................................408
Domylny plik indeksu i poprawne nazwy plikw...................................................408
Publikowanie plikw.......................................................................................................409
Przemieszczanie plikw pomidzy systemami.........................................................410
Usuwanie bdw ............................................................................................................413
Brak dostpu do serwera...........................................................................................413
Nie mam dostpu do plikw .....................................................................................413
Nie mam dostpu do obrazw...................................................................................414
cza nie dziaaj poprawnie....................................................................................414
Pliki nie s wywietlane poprawnie..........................................................................414
Spis treci
11
Rejestracja i reklama witryny..........................................................................................415
Listy witryn WWW...................................................................................................415
Yahoo!.......................................................................................................................415
dmoz: Open Directory Project ..................................................................................417
te strony (Yellow Pages) .....................................................................................418
Prywatne serwisy katalogowe...................................................................................419
Serwisy indeksujce i wyszukujce ................................................................................419
Google.......................................................................................................................420
AltaVista ...................................................................................................................421
AlltheWeb.com .........................................................................................................422
Narzdzia automatycznej rejestracji................................................................................422
Piercienie internetowe (ringi) ........................................................................................422
Wizytwki, papeteria firmowa i broszury............................................................................423
Jak wpywa na przyjaci i ludzi ...................................................................................423
Informacje o odwiedzajcych..........................................................................................424
Plik dziennika............................................................................................................424
Liczniki odwiedzin na stronie...................................................................................425
Podsumowanie ................................................................................................................426
Rozdzia 16. Wykorzystywanie moliwoci serwera ............................................. 427

Aplikacje WWW .............................................................................................................427
CGI............................................................................................................................428
Active Server Pages ..................................................................................................429
JSP/J2EE ...................................................................................................................431
PHP ...........................................................................................................................433
Wstawki po stronie serwera ............................................................................................434
Uycie wstawek po stronie serwera..........................................................................435
Uycie plikw kontroli dostpu Apache .........................................................................437
Zarzdzanie dostpem do stron.................................................................................438
Przekierowywanie uytkownikw ............................................................................440
Podsumowanie ................................................................................................................441
Skorowidz...................................................................................... 443
Rozdzia 3.
Wszystko o czach
Strony HTML, ktre stworzylimy w poprzednim rozdziale, s w porzdku i oglnie
bez zarzutu, niestety raczej nudnawe. Prawdziwa zabawa zaczyna si w momencie,
gdy na stronach zaczynamy umieszcza cza do innych witryn. W tym rozdziale zajmiemy si wanie takimi sprawami. W szczeglnoci omwimy:
znacznik tworzcy cza,
czenie stron znajdujcych si na dysku lokalnym czami wzgldnymi
i bezwzgldnymi,
tworzenie czy do stron WWW za pomoc adresw URL,
tworzenie czy do wybranych fragmentw stron za pomoc zakotwicze,
adresy URL, ich elementy i rodzaje.
Jak tworzy cza

Aby utworzy cze w jzyku HTML, potrzeba:
nazwy lub adresu URL pliku, do ktrego ma prowadzi cze;
tekstu, ktry posuy za punkt dostpu tekst ten, wywietlany z wyrnieniem,
wybrany przez uytkownika spowoduje otwarcie podczonego pliku.

Z dwch powyszych jedynie tekst jest widoczny na stronie. Kiedy uytkownik kilka
ten tekst, przegldarka wczytuje plik wskazany przez zwizany z nim adres URL.
<a> znacznik tworzcy cza

Aby utworzy cze, w kodzie HTML umieszczamy znacznik , nazywany rwnie
znacznikiem zakotwiczenia (ang. anchor; wicej o zakotwiczeniach w dalszej czci
tego rozdziau). W przeciwiestwie do prostych znacznikw omwionych do tej pory,
znacznik ma kilka dodatkowych cech. Znacznik otwierajcy , oprcz samej
56
nazwy znacznika, zawiera jeszcze parametry cza. Te parametry nazywane s atrybutami znacznika (pojcie atrybutu po raz pierwszy pojawio si w rozdziale 1).
W zwizku z tym znacznik otwierajcy nie przybiera postaci samej nazwy, umieszczonej pomidzy nawiasami trjktnymi, lecz raczej podobn do takiej:

Atrybuty (w tym przykadzie s to: , oraz

) su do opisu cza. Prawdopodobnie najczciej przydawa si bdzie atrybut (od ang. hypertext reference
odwoanie hipertekstowe). Jego wartoci jest nazwa lub adres URL podczanego pliku.
Podobnie jak wikszo znacznikw HTML, znacznik tworzcy cza ma take znacznik zamykajcy . Cay tekst midzy znacznikiem otwierajcym a zamykajcym
bdzie ekranow reprezentacj cza. Przy wywietleniu zostanie wyrniony, zwykle
podkreleniem i kolorem niebieskim albo czerwonym. To wanie ten tekst bd
klika uytkownicy, aby skierowa przegldark pod adres okrelony atrybutem .
Rysunek 3.1 przedstawia czci znacznika typowego cza, takie jak atrybut , tekst
cza i znacznik zamykajcy.
Rysunek 3.1.
cze na stronie WWW
Poniej inny prosty przykad kodu i prezentacji cza.

Rysunek 3.2.
cze wywietlane
w przegldarce
wiczenie 3.1. czenie dwch stron

Czas sprbowa utworzy proste cze samodzielnie. Poczymy dwie strony HTML
zapisane na dysku lokalnym. Do wykonania wiczenia posuymy si edytorem tekstu oraz przegldark. Poniewa oba pliki znajduj si na dysku lokalnym, nie bdzie
potrzebne poczenie z sieci (prosimy o cierpliwo; do zagadnie sieciowych przejdziemy w nastpnym podrozdziale).
Naley stworzy dwie strony HTML i zapisa je w osobnych plikach. Poniej znale
mona kod obu stron, ktre utworzylimy dla potrzeb tego wiczenia. Nazwy plikw
Rozdzia 3. Wszystko o czach
57
to menu.html oraz klaudiusz.html. Wygld obu stron, jak i nazwy plikw nie maj
doprawdy znaczenia (trzeba jednak konsekwentnie stosowa wybrane nazwy). Oto zawarto pierwszego pliku menu.html:
!"#$%&&'(&&)*+#,-. && /
0&&( 1&2&3,&&. 44

4

4
5 4
, ,

! " " #$
% & ' " ()$* + ,! '
-
.& " /0 * - 1 %
2
" " 1& &
, -2 3
* 2 ", 14
2 5

-
6" 7
1
3
3

8
91
6
:
:&

.&

5 4

Pozycje menu (Juliusz Cezar, August itd.) stan si czami do innych stron. Na razie
wystarczy wpisa je jako zwyky tekst. Pniej przerobimy je na cza. A teraz zawarto drugiego pliku, czyli klaudiusz.html:
!"#$%&&'(&&)*+#,-. && /
0&&( 1&2&3,&&. 44

4
5 3

4
5 4
63
& 6
3
2 &; !<
; * =2 1&; ! ,
, 3!2 " ! "* 3

' "2 3

!

!2 ' *
63
& 6
:
, & 3
* 8"
&&;
& ' "! 7 !
1 1 1 *
- < &

&!
> &;,
"
7 ?? 8 *

5 4

58
Naley upewni si, e oba pliki s w tym samym katalogu (folderze). Jeli wybrano
inne nazwy ni menu.html i klaudiusz.html, trzeba je zanotowa, poniewa bd potrzebne pniej.
Utworzymy cze od pliku menu do pliku z treci. W edytorze otwieramy plik menu.html i ustawiamy kursor w linii wygldajcej tak:
3

Znaczniki tworzce cza nie okrelaj formatu samego tekstu, w zwizku z tym pozostawiamy znaczniki oznaczajce element listy, a cze umieszczamy pomidzy nimi.
Najpierw dopisujemy znaczniki cza jako takie (czyli znaczniki oraz ) przed
i po tekcie majcym suy za cze:
3

Teraz dodajemy nazw pliku, do ktrego cze chcemy utworzy. Zapisujemy j w czci
znacznika otwierajcego . Nazw pliku umieszcza si w cudzysowie (przy
czym naley uy zwykego znaku cudzysowu (), nie cudzysowu drukarskiego czy
jeszcze innych znakw). Naley pamita o znaku rwnoci () pomidzy sowem
a nazw pliku. Nazwy plikw w czach s zapisywane z rozrnianiem maych
i wielkich liter, trzeba si wic upewni, e nazwa wpisana w znaczniku i nazwa istniejcego pliku s rzeczywicie identyczne (Klaudiusz.html to nie ten sam plik, co
klaudiusz.html; wielko liter musi si dokadnie zgadza). Zastosowana tu nazwa to
klaudiusz.html; w przypadku wybrania innych nazw, naley uy wanie ich.
4.3

Teraz uruchamiamy przegldark, wybieramy polecenie Plik/Otwrz (lub jego odpowiednik w uywanej przegldarce) i otwieramy plik menu.html. Tekst wykorzystany
jako cze powinien ukaza si w postaci waciwej dla czy, czyli w specjalnym
kolorze, podkrelony lub wyrniony w inny sposb. Na rysunku 3.3 przedstawiono
uzyskany wygld strony.
Rysunek 3.3.
Plik menu.html
po dodaniu cza
59
W tej chwili, jeli kliknie si cze, przegldarka powinna wczyta i wywietli stron
zapisan w pliku klaudiusz.html.
Jeli przegldarka nie moe odnale pliku w momencie kliknicia cza, naley upewni si, czy nazwa pliku umieszczona w czci znacznika cza jest taka sama,
jak nazwa pliku istniejcego na dysku, czy zgadza si sposb zastosowania wielkich
i maych liter oraz czy oba pliki znajduj si w tym samym katalogu. Trzeba pamita, aby na kocu tekstu sucego za cze pojawia si znacznik zamykajcy .
Warto te sprawdzi, czy na kocu wpisanej nazwy pliku pojawia si znak cudzysowu
(zdarza si czasem o tym zapomina) oraz czy znak cudzysowu, tak przed, jak i po
nazwie, jest waciwego rodzaju (zwyky znak cudzysowu). Wszystkie te problemy
mog zmyli przegldark i uniemoliwi odnalezienie pliku, a tym samym prawidowe dziaanie w momencie wybrania cza.
Trzeba dobrze zrozumie problem rozrniania maych i wielkich liter. W nazwach
znacznikw HTML nie uwzgldnia si wielkoci liter (jakkolwiek specyfikacja XHTML
1.0 wymaga stosowania w nich liter maych). Niemniej pliki, o jakich mwimy, znajduj
si na jakim serwerze WWW, a poniewa serwery WWW czsto dziaaj pod kontrol systemw operacyjnych, ktre rozrniaj wielko liter (systemy typu UNIX),
naley upewni si co do penej zgodnoci nazw plikw w znacznikach czy.
Teraz mona utworzy cze w odwrotnym kierunku: ze strony z tekstem do strony

z menu. I takie wanie jest przeznaczenie akapitu koczcego plik klaudiusz.html:

Dodajemy do tej linii znacznik tworzcy cze z odpowiednim atrybutem , tak jak
w poniszym przykadzie, w ktrym oryginalny plik strony z menu nazywa si menu.html:

Umieszczajc znacznik w rodku innego znacznika, trzeba uwaa, aby w pierwszej kolejnoci zamkn ten znacznik, ktry zosta otwarty jako ostatni. W przeciwnym razie przegldarka moe si pogubi. Innymi sowy, poprawny zapis to:
**
w przeciwiestwie do:
**
Teraz wystarczy ponownie wczyta do przegldarki stron o Klaudiuszu, aby uaktywni cze (patrz: rysunek 3.4). Mona teraz wygodnie przechodzi ze strony z menu na
stron ze szczegami, wybierajc tak utworzone cza.
60
Rysunek 3.4.
Strona zapisana
w pliku klaudiusz.html
czenie stron lokalnych

ciekami wzgldnymi i bezwzgldnymi
Przykad wykorzystany w poprzednim podrozdziale pokazuje, jak czy z sob strony znajdujce si w tym samym katalogu (folderze) na dysku lokalnym. Teraz rozwiniemy ten wtek czeniu podlega bd strony zapisane na dysku lokalnym, jednak w rnych katalogach (folderach).
Foldery i katalogi to jedno i to samo, ale nazwa zaley od tego, czy uywa si systemu Windows, komputera macintosh czy te systemu typu Unix. eby uproci
nam wszystkim ycie, od teraz nazywane tu bd po prostu katalogami.
Kiedy midzy znakami cudzysowu pojawia si wycznie nazwa podczanego pliku,

jak to miao miejsce dotd, przegldarka szuka wskazanego pliku w katalogu, z ktrego
wczytano biecy plik. Pozostaje to prawd, nawet jeli zarwno plik biecy, jak i plik
podczany znajduj si gdzie daleko w internecie; maj si znajdowa w tym samym
katalogu na swoim serwerze. Jest to najprostszy przypadek cieki wzgldnej.
cieka wzgldna prowadzi do plikw na podstawie ich pooenia wzgldem pliku
biecego. Moe zawiera nazwy katalogw lub te wskazywa drog, ktr trzeba
przeby od biecego katalogu do danego pliku. Na ciek tak mogyby na przykad
skada si polecenia przejcia najpierw dwa poziomy w gr drzewa katalogw,
a nastpnie przez dwa okrelone katalogi w d, a do pliku.
Aby zapisa ciek wzgldn w parametrach cza, stosuje si skadni pochodzc
z systemw typu Unix, niezalenie od rzeczywicie uywanego systemu. Oznacza to
oddzielanie nazw katalogw ukonikiem ( ) oraz uywanie dwch kropek () jako
uniwersalnego odwoania do katalogu nadrzdnego. Tabela 3.1 pokazuje kilka przykadw cieek wzgldnych wraz z wyjanieniami.
61
Tabela 3.1. cieki wzgldne

cieka
Wyjanienie
,4@A"*,A
Plik plik.html znajduje si w katalogu biecym
,4@A""*,A
Plik plik.html znajduje si w katalogu o nazwie pliki,

ktry znajduje si w katalogu biecym
,4@A"&""*,A
Plik plik.html znajduje si w katalogu o nazwie

jeszczerazpliki, ktry znajduje si w katalogu o nazwie
pliki, ktry z kolei znajduje si w katalogu biecym
,4@A**"*,A
Plik plik.html znajduje si w katalogu znajdujcym si

o poziom wyej ni biecy (czyli w katalogu nadrzdnym)
,4@A****""*,A
Plik plik.html znajduje si w katalogu o nazwie pliki,

ktry znajduje si w katalogu pooonym dwa poziomy
wyej ni biecy
W przypadku czenia stron przechowywanych w komputerze osobistym (typu PC lub

macintosh), aby podczy plik umieszczony na innym dysku, uywa si nazwy lub
litery dysku tak samo, jak innych nazw katalogw w ciece wzgldnej.
Aby podczy plik na dysku lokalnym macintosha, stosuje si tak nazw dysku, jaka
pojawia si przy ikonie waciwego dysku. Przyjmijmy, e pliki HTML znajduj si
w folderze Pliki HTML na dysku o nazwie Dysk twardy 2. Wwczas podczenie pliku
o nazwie julia.html w folderze o nazwie Publiczne na dysku udostpnionym pod nazw
Mak Julki wymaga zastosowania nastpujcej cieki wzgldnej:
@A****B" -"C1 &*,A
Kiedy plik zapisany na dysku lokalnym podcza si w systemie Windows, dysk

wskazuje si za pomoc litery jak moglibymy si w istocie spodziewa. Jednake
zapis c: albo d: zostaje zmodyfikowany poprzez zastpienie dwukropka znakiem pionowej kreski (), poniewa dwukropek ma szczeglne znaczenie w adresach URL.
Znak pionowej kreski na klawiaturze dzieli zwykle klawisz ze znakiem odwrotnego
ukonika, nadrukowany za jest tam w postaci dwch pionowych kreseczek, jednej
nad drug. Nie naley zapomina o uywaniu zwykych ukonikw, jak w systemach
typu Unix. Tak wic jeli biecy plik znajduje si w katalogu C:\PLIKI\HTML,
chcemy za utworzy cze do pliku D:\PLIKI.NOW\HTML\JESZCZE\INDEX.HTM,
cieka wzgldna do tego pliku bdzie wyglda tak:
,4@A****
D"* ,&
E*,A
W wikszoci przypadkw uywanie nazw dyskw w ciekach wzgldnych prawie

nigdy nie jest praktyczne wspominamy o tym dla kompletnoci opisu. Po przeniesieniu plikw na serwer WWW cza zawierajce nazwy dyskw nie bd dziaa. Zwykle przydaj si wic cza wzgldne sformuowane w bardziej uniwersalny sposb.
cieki bezwzgldne
Mona take utworzy cze do innej strony zapisanej w systemie lokalnym za pomoc
cieki bezwzgldnej.
62
cieka bezwzgldna wskazuje drog do pliku na podstawie jego bezwzgldnego (absolutnego) pooenia w systemie plikw. Podczas gdy cieki wzgldne wskazuj podczany plik, opisujc jego pozycj w odniesieniu do pliku strony biecej, cieki
bezwzgldne wyznaczaj pooenie, zaczynajc od najwyszego katalogu w hierarchii. Nastpnie pojawiaj si nazwy wszystkich kolejnych zawierajcych si katalogw a do tego, w ktrym znajduje si szukany plik.
cieki bezwzgldne zawsze zaczynaj si ukonikiem, co odrnia je od cieek wzgldnych. Po ukoniku nastpuj wszystkie kolejne katalogi od najwyszego poziomu a
do podczanego pliku.
Gdzie konkretnie znajduje si w najwyszy poziom, zaley od sposobu wykorzystania plikw. Jeli po prostu podcza si pliki na dysku lokalnym, najwyszy poziom oznacza najwyszy poziom systemu plikw (oznaczany ukonikiem w systemach typu Unix, a na macintoshu nazw dysku). W przypadku umieszczenia
plikw na serwerze WWW najwyszym poziomem jest katalog, w ktrym przechowywane s przeznaczone do udostpniania pliki uytkownika. O zagadnieniu cieek bezwzgldnych na serwerach WWW wicej w rozdziale 15.
Tabela 3.2 przedstawia kilka przykadw cieek bezwzgldnych wraz z wyjanieniami.

Tabela 3.2. cieki bezwzgldne
cieka
Wyjanienie
,4@A("*,A
Plik plik.html znajduje si w katalogu lemay,

ktry znajduje si w katalogu u1, ktry z kolei
znajduje si w katalogu gwnym (zapis typowy
dla systemw typu Unix)
,4@A
D","*,A
Plik plik.html znajduje si w katalogu html, ktry

znajduje si w katalogu pliki, a ten z kolei
w katalogu gwnym dysku D: (system Windows)
,4@A."FG$
FG$(C" HBI"*,A
Plik plik.html znajduje si na dysku Dysk

twardy 1 w katalogu Pliki HTML (zapis typowy
dla macintoshy)
Ktre cieki s lepsze

wzgldne czy bezwzgldne?
Odpowied na to pytanie brzmi: to zaley. Dla zestaww plikw czonych tylko midzy sob zastosowanie cieek wzgldnych ma sens. Jeli natomiast cza prowadz
do plikw poza dan hierarchi, najprawdopodobniej odpowiednie bd cieki bezwzgldne.
Do lepszego wyjanienia przyda si moe przykad. Zamy, e witryna skada si
z dwch dziaw: /rzeczy oraz /sprawy. cze od pliku index.html w katalogu /rzeczy
do pliku historia.html w katalogu /rzeczy (lub do jakiegokolwiek innego pliku w katalogu /rzeczy) utworzymy za pomoc cza wzgldnego. W ten sposb przeniesienie
63
katalogu /rzeczy w inne miejsce nie spowoduje uszkodzenia wewntrznych czy. Z drugiej strony, jeli cze miaoby prowadzi od pliku /rzeczy/index.html do /sprawy/index.html, odpowiednim rozwizaniem bdzie cze bezwzgldne. Jego zastosowanie
pozwoli na dziaanie cza nawet w przypadku przeniesienia katalogu /rzeczy do katalogu
/jeszczeinny.
Zota zasada, ktr zazwyczaj stosujemy, brzmi: pliki tworzce funkcjonaln cao
czymy wzgldnie, a nalece do osobnych grup bezwzgldnie.
cza do innych dokumentw w sieci

Na dysku lokalnym mamy ju wic zestaw poczonych z sob stron. Przydayby si
jednake odwoania do stron znajdujcych si gdzie w internecie na przykad do
witryny Piotra Kowackiego Strefa Rzymu1, zawierajcej dodatkowe informacje o cesarzach rzymskich. Znacznik tworzcy cza doskonale nadaje si take do podczania
stron w internecie, ktre bdziemy nazywa stronami zdalnymi.
Strony zdalne znajduj si gdzie w sieci, lecz zwykle na innym komputerze ni ten,
ktrym zajmujemy si w danym momencie.
Kod HTML sucy do utworzenia cza do strony zdalnej wyglda dokadnie tak samo,
jak kod opisujcy cza midzy stronami zapisanymi lokalnie. W dalszym cigu znajduje
tu zastosowanie znacznik z atrybutem , jednak, jak pokazuje rysunek 3.5, nazw
pliku zastpuje adres URL.
Rysunek 3.5. cze do zdalnego pliku
wiczenie 3.2. Podczanie stron

Wrmy do dwch stron powiconych cesarzom, na ktrych wczeniej umiecilimy
cza. Plik menu.html zawiera cza do stron lokalnych zawierajcych informacje o dwunastu cesarzach rzymskich.
W polskim wydaniu zastpiono w ten sposb odwoanie do angielskojzycznej witryny dr Ellis Knox
z Uniwersytetu Stanowego w Broise zatytuowanej The first caesars page (ang. Strona o pierwszych
cesarzach), dostpnej pod adresem http://history.boisestate.edu/westciv/julio-cl/ przyp. tum.
64
Zamy, e chcemy na tej stronie, poniej menu, doda cze wskazujce spis artykuw o staroytnym Rzymie na witrynie Piotra Kowackiego. Odpowiedni adres URL
to http://www.strefarzymu.one.pl/historiam.htm . W pierwszej kolejnoci dopiszmy na
kocu strony tekst z opisem przyszego cza:
: C 3" 4 = !& 4& ,

,*
A jeli nie znalibymy adresu URL witryny Strefa Rzymu (lub innej strony, do ktrej
cze chcielibymy utworzy)? Jeli tylko umielibymy trafi do niej, przechodzc po
kolejnych czach z innych witryn, nie byoby problemu. Pierwszym krokiem do
okrelenia adresu URL byoby otwarcie w przegldarce strony, ktr zamierzalibymy
podczy do swojej. Rysunek 3.6 pokazuje stron witryny Strefa Rzymu wywietlon
w przegldarce.
Rysunek 3.6. Spis artykuw na witrynie Strefa Rzymu

Jeli poczenie z internetem nie jest aktywne, trzeba je teraz wczy inaczej
nie bdzie moliwe przetestowanie czy do stron znajdujcych si w sieci.
W wikszoci przegldarek adres URL otwartej w danym momencie strony pojawia si

gdzie w grnej czci okna. Dziki temu atwo utworzy cze do wybranej strony:
wystarczy skierowa przegldark pod odpowiedni adres URL, skopiowa go z okienka
adresu, a na koniec wklei do kodu HTML, nad ktrym si wanie pracuje. adnego
pisania!
65
Po zdobyciu adresu URL podanej strony mona skonstruowa znacznik tworzcy

cze i umieci go w pliku menu wraz z wklejonym adresem URL w taki sposb:
: C 3"
0&&. &. 4 =
!& 4& ,
,*
Naturalnie adres URL strony, ktr chce si podczy, mona po prostu wpisa do
czci znacznika. Naley jednak pamita, e popenienie nawet drobnego bdu
sprawi, e otwarcie w przegldarce pliku znajdujcego si na drugim kocu cza nie
bdzie moliwe. Wikszo adresw URL jest zbyt skomplikowana, eby czowiek
by w stanie je zapamita. Zalecamy korzysta z polece kopiowania i wklejania
tylko wczas mona unikn kopotw zwizanych z pomyk podczas wpisywania
adresu URL.
Na rysunku 3.7 przedstawiono, jak wywietlany jest plik menu.html po dodaniu nowego cza.
Rysunek 3.7.
cze do Strefy Rzymu
wiczenie 3.3. Jak utworzy menu czy

Gdy ju wiesz, jak uywa list oraz czy, moesz stworzy menu czy.
Menu czy to pewna liczba czy na stronie WWW, ktrej nadano ksztat listy
albo inny zwizy, atwy do odczytania i zrozumienia format. Rozwizanie
to jest idealne w przypadku stron ukadajcych si w hierarchi, nadaje si te do tworzenia spisw treci oraz wskazywania wybranej strony pord wielu. Strony WWW,
ktre skadaj si wycznie z czy, czsto przyjmuj wanie tak form.
Pomys polega na uywaniu krtkich, opisowych etykiet w charakterze czy bez dodatkowego tekstu obok cza, albo wanie z rozszerzonym opisem nastpujcym zaraz
po nim. Menu czy wygldaj najlepiej jako listy punktowane lub inne listy nieuporzdkowane. Mona te uywa list definicji lub po prostu zwykych akapitw. Zastosowanie menu czy pozwala czytajcym na szybkie przegldnicie spisu czy
rzecz trudna w przypadku, gdy cza ukryte s w tekcie.
66
W tym wiczeniu stworzymy stron WWW z recenzjami kilku ksiek. Strona bdzie
suy jako spis recenzji, w zwizku z czym menu czy bdzie w istocie skada si
z nazw ksiek. Zaczynamy od nieskomplikowanego szkieletu strony z nagwkiem pierwszego poziomu i prostym tekstem wprowadzajcym:
!"#$%&&'(&&)*+#,-. && /
0&&( 1&2&3,&&. 44

4
C
& ";'"
4
5 4
,C
& ";'",

' ";'" ' ,

* B ' & ""
" " & ??
1 ";'"

* 6 ";'" , 5
Teraz dodajemy list, ktrej elementy stan si czami ale na razie bez znacznikw tworzcych cza (zawsze atwiej zacz od tekstu, a dopiero potem zrobi z niego
waciwe cze). Zastosujemy znaczniki w celu utworzenia punktowanej listy ksiek.
Znacznik niezbyt si tu nadaje, poniewa pojawienie si numerw mogoby
sprawia wraenie, e wymieniamy ksiki w kolejnoci wedug oceny. Poniej wida
kod HTML listy ksiek, a rysunek 3.8 pokazuje wywietlon stron na obecnym
etapie skadaj si na ni wprowadzenie i lista.

J* 8"2 C !
C* K" ;2
""
1
6* .12 . " &

7* 2 6

' ,

Rysunek 3.8.
Lista ksiek
Nastpnie modyfikujemy kad pozycj listy w taki sposb, aby zawieraa znaczniki
tworzce cza. Znaczniki zostaj na swoich miejscach wyznaczaj przecie
pocztki kolejnych elementw. Znaczniki umieszczamy przed i po tekcie. W tym
przypadku podczamy pliki znajdujce si na dysku lokalnym, w tym samym katalogu,
co nasz plik; kady z nich zawiera recenzj danej ksiki:

J* 8"2 C !7
5 1
C* K" ;2
""

1
67
846* .12 . " &

17* 2 6

' ,

Menu ksiek wyglda dobrze mimo pewnej zgrzebnoci. Jego lektura nie dostarcza
czytelnikom adnych informacji o charakterze poszczeglnych ksiek (cho niektre
tytuy zdradzaj ogln tematyk) ani o tym, czy s dobre albo ze. W zwizku z tym
ulepszenie moe polega na rozwiniciu elementw listy o krtkie teksty objaniajce
i zasugerowaniu w ten sposb, co czeka czytelnika na drugim kocu cza:

J* 8"2 C !* C< 4
, 11& ,* , !;2 "*
5 1
C* K" ;2
""

1* -
1
2 L M ,
*
846* .12 . " &
*
8L 3;'" ,
! 4"
*
17* 2 6

' ,*
.& "&*** 3 1 , 1< ' N

Kompletne menu czy przedstawiono na rysunku 3.9.

Rysunek 3.9.
Kompletne
menu czy
cza do fragmentw stron

cza omawiane do tej pory przebiegay pomidzy punktem na stronie rdowej
a stron docelow. Co jednak naley zrobi, gdy chcemy wskaza wybran cz
strony na przykad czwarty nagwek od gry?
W jzyku HTML mona to osign, tworzc zakotwiczenie (ang. anchor) w kodzie
strony docelowej, ktre umoliwia utworzenie cza do rodka strony. Dziki zakotwiczeniom moliwe jest przejcie od razu do wybranego miejsca w rodku dokumentu
zamiast do jego pocztku.
W kodzie cza na stronie rdowej wpisuje si, oprcz nazwy podczanego pliku,
rwnie nazw wskazywanego zakotwiczenia. Dziki temu wybranie cza w przegldarce powoduje wczytanie strony docelowej, a nastpnie przewinicie widoku a
do miejsca, gdzie pooone jest zakotwiczenie (patrz: rysunek 3.10).
68
Rysunek 3.10.
cza do zakotwicze
Mona uywa czy i zakotwicze wewntrz pojedynczej strony w ten sposb, e wybranie jednego cza powoduje przewinicie widoku do punktu zakotwiczenia na tej
samej stronie.
Jak tworzy cza i zakotwiczenia

Zakotwiczenia tworzy si w podobny sposb, jak cza: korzystajc ze znacznika .
Dlatego te nazwa tego znacznika jest wanie taka nie , jak link (cze), lecz
, jak anchor (czyli zakotwiczenie).
W przypadku zapisywania cza za pomoc znacznika potrzebne s dwie czci:
atrybut w otwierajcym znaczniku oraz tekst pomidzy znacznikami otwierajcym a zamykajcym. Tekst w peni wtedy funkcj punktu dostpu do cza.
Zakotwiczenia powstaj prawie tak samo, lecz atrybut zostaje zastpiony przez
atrybut , ktry przyjmuje jako warto sowo (lub sowa kluczowe) nazywajce to
zakotwiczenie. Na rysunku 3.11 wyodrbniono czci znacznika tworzcego cze
do zakotwiczenia.
Rysunek 3.11.
Zakotwiczenie
znacznik <a>
Mimo e zakotwiczenia zwykle wskazuj miejsce z dokadnoci do pojedynczego znaku,

wymagaj podobnie jak cza umieszczenia tekstu pomidzy otwierajcym
a zamykajcym znacznikiem . Ten wanie tekst ma ukaza si uytkownikowi,
ktry wybra cze do danego zakotwiczenia. Przegldarka przewija stron do miejsca,
gdzie znajduje si tekst oznaczony zakotwiczeniem powinien si on znale w grnej czci ekranu. W niektrych przegldarkach moe te by podwietlany.
69
Na przykad utworzenie zakotwiczenia do fragmentu strony rozpoczynajcego si od

nagwka Cz czwarta moe polega na dodaniu do tego nagwka znacznika
z etykiet , tak jak poniej:
,
.
9!< * 9&4 1,
Inaczej ni w przypadku czy, tekst wykorzystywany w zakotwiczeniach zwykle nie

jest specjalnie formatowany na ekranie, a nazwy zakotwicze nie s wywietlane
w tekcie strony.
Aby utworzy cze do zakotwiczenia, stosuje si tak form cza, jak mona by si
posuy do podczenia caej strony, czyli z nazw pliku lub adresem URL jako
wartoci atrybutu . Rnica polega na dopisaniu do tej wartoci znaku i nazwy
zakotwiczenia, dokadnie takiej, jaka pojawia si w atrybucie tego zakotwiczenia
(z uwzgldnieniem wielkoci liter!). Oto przykad:
844 :
.
9. ! O*
Wybranie takiego cza w przegldarce powoduje otwarcie pliku mojduzydok.html

i przewinicie do zakotwiczenia o nazwie . Tekst wewntrz definicji zakotwiczenia powinien si znale w grnej czci ekranu.
wiczenie 3.4. cza midzy fragmentami dwch stron

Czas wic utworzy dwie przykadowe strony. Zamy, e trzeba uzupeni internetowy leksykon muzyki powanej, ktrego kada strona grupuje definicje terminw
rozpoczynajcych si od jednej litery alfabetu (pliki a.html, b.html itd). Witryna leksykonu mogaby by rwnie podzielona na strony z pojedynczymi terminami. Taki
sposb organizacji spowodowaby jednak konieczno administrowania wieloma stronami, jak rwnie zmuszaby uytkownikw do wczytywania wielu stron podczas eksplorowania leksykonu. Wizanie pokrewnych fragmentw w grupy oznaczone literami
jest w tym przypadku bardziej praktyczne.
Stron, ktra ma si ukaza jako pierwsza, jest lista hase na liter M. Jej pierwszy
fragment, zapisany w jzyku HTML, wyglda bdzie tak:
!"#$%&&'(&&)*+#,-. && /
0&&( 1&2&3,&&. 44

4
B" ' 5 B
4
5 4
,B,
6
6

: P
2 B&2
" ;

: P
2 ,< >;
6
911 2 1 1!
%

B Q
2 I
R7
, B2 B
" " ! &
, :"2 ,2 "4
-, :12 C
" ;

70

S" " ,2 ! 1 !,2
" * 6
TU
TUMM "*
1 '5 P
2 911 2 B Q
2 B2
:"2 :1
5 4

Rysunek 3.12 pokazuje, jak ten fragment wyglda w przegldarce.

Rysunek 3.12.
Internetowy leksykon
muzyki powanej
litera M,
haso madrygay
W ostatniej linii (czyli zobacz rwnie) przydaoby si doda cza od nazwisk kompozytorw do powiconych im miejsc na odpowiednich stronach leksykonu. Moliwe
jest utworzenie w sowie Byrd cza do pliku b.html, zgodnie z poznan wczeniej
procedur. Gdy uytkownik je kliknie, przejdzie do pocztku strony z terminami na
liter B. Bdzie teraz musia przedziera si przez informacje o wszystkich kompozytorach, ktrych nazwiska zaczynaj si na liter B (a takich jest niemao Bach, Beethoven, Brahms, Bruckner). Dopiero wtedy dotrze do Byrda. Cakiem wiele zachodu
jak na system, ktry mia pono udostpnia poczone informacje szybko i bez trudu.
Zatem, aby uatwi posugiwanie si leksykonem, trzeba poczy sowo Byrd z dotyczcym kompozytora fragmentem strony b.html. Oto cz pliku b.html, ktr zamierzamy podczy (w tym przykadzie w celu skrcenia pliku pominito wszystkie terminy na liter B, prcz Byrda; umwmy si, e one wci tam s):
!"#$%&&'(&&)*+#,-. && /
0&&( 1&2&3,&&. 44

4
B" ' 5 P
4
5 4
,P,
%%55;
8< = .. .;=">4 "4%%
6P
:2 (VO)?(0G)6

71

B&2
" ;

,< >;
S&2
;"
"

!

7Q Q O

1 '
2 2
5 4

W tym przykadzie mona zauway pojawienie si znacznika , ktry powoduje

wyrnianie tekstu. Wyrnianie polega zwykle na wizualizacji czcionk pochy
tak dzieje si w przegldarkach Netscape i Internet Explorer.
Teraz trzeba utworzy zakotwiczenie w nagwku fragmentu o Byrdzie, ktre zostanie

podczone do linii zobacz rwnie w pliku z hasami na liter M.
Jak opisalimy to ju wczeniej, kade zakotwiczenie skada si z dwch czci: nazwy
zakotwiczenia oraz tekstu, ktry bdzie ekranow reprezentacj cza (w niektrych
przegldarkach wywietlan z wyrnieniem). Drug z tych czci atwo okreli; nagwek fragmentu doskonale si nadaje to przecie wanie ten element, do ktrego
tworzymy cze.
Mona nada zakotwiczeniu dowoln nazw, byle tylko nazwy zakotwicze na danej
stronie nie powtarzay si. Jeli na stronie znalazyby si dwa zakotwiczenia o nazwie
, w jaki sposb przegldarka rozpozna, o ktre z nich chodzi uytkownikowi wybierajcemu cze? Dobr, unikatow nazw zakotwiczenia bdzie w tym przypadku
po prostu sowo , poniewa pojawia si tylko w jednym miejscu pliku a tego
wanie potrzebujemy.
Po wybraniu nazwy i tekstu do zakotwiczenia czas utworzy samo zakotwiczenie w kodzie HTML. Dodajemy znacznik do nagwka , ale zachowujemy przy
tym ostrono. Ot gdyby chodzio o zwyky tekst akapitu, objoby si po prostu
ca lini znacznikami . W tym przypadku trzeba jednak pamita, e jeli umieszczamy zakotwiczenie w wikszym fragmencie tekstu, ktry z kolei zawiera si w elemencie (takim jak nagwek lub akapit), wwczas znaczniki zakotwiczenia musz trafi
do wewntrz nadrzdnego elementu. Innymi sowy, naley wpisa:
654P
:2 (VO)?(0G)6
72
ale nie wolno wpisa:

546P
:2 (VO)?(0G)6
Drugi przykad moe zmyli przegldark. Czy to ma by zakotwiczenie, przeznaczone do sformatowania podobnie jak poprzedzajcy tekst, z dodatkowymi, tajemniczo zlokalizowanymi znacznikami nagwka? Czy te raczej nagwek, ktry akurat
jest take zakotwiczeniem? Stosujc prawidowy zapis kodu HTML, czyli z zakotwiczeniem umieszczonym wewntrz nagwka, unika si dwuznacznoci.
atwo zapomnie o tej sprawie zwaszcza jeli najpierw wpisujemy tekst, a dopiero
pniej dodajemy znaczniki. Otoczenie caego nagwka znacznikami wydaje si
mie sens. Jednak co w przypadku, gdybymy mieli do czynienia nie z krtkim nagwkiem, a dugim akapitem? Skd przegldarka miaaby wiedzie, ktr lini akapitu
pokaza? Aby utworzy cze do wybranego sowa albo zdania, umieszcza si znacznik
wewntrz innych znacznikw. Trzeba o tym pamita i wszystko bdzie jasne.
W tym momencie mamy ju w nagwku odpowiednie zakotwiczenie o nazwie .
Wrmy teraz do linii z tekstem w pliku m.html:
1 '5 P
2 911 2 B Q
2 B2 :"2 :1
Zamierzamy wic utworzy w sowie Byrd cze, czym zajmowalimy si ju przecie kilkakrotnie. Lecz jak brzmi adres URL? Jak wspominalimy wczeniej, cieki
do zakotwicze powstaj wedug nastpujcego wzorca:

W
Mamy tu do czynienia z czem do pliku b.html, ktrego nazw podstawiamy w atrybucie :
5
Jednak chcemy podczy konkretne miejsce na tej stronie. Dodajemy wic nazw zakotwiczenia i nasz znacznik wyglda teraz tak:
5:54
Zwrmy uwag, e nazw zapisano z maej litery. W nazwach zakotwicze

uwzgldnia si wielko liter; gdyby w wartoci wpisa , cze mogoby nie
dziaa. Trzeba sprawdza, czy nazwa zakotwiczenia uyta w atrybucie i nazwa
zakotwiczenia w atrybucie s na pewno identyczne.
Czsto popenianym bdem jest poprzedzanie nazwy znacznika znakiem nie tylko
w parametrach cza, ale i w definicji zakotwiczenia. Jedynym waciwym tu zastosowaniem znaku jest oddzielanie adresu pliku i nazwy zakotwiczenia. Same nazwy
zakotwicze nigdy nie powinny zawiera znakw .
Ostatecznie, po dodaniu cza do czci oznaczonej zobacz rwnie, wyglda ona nastpujco:
1 ' 5:54P
2 911 2 B Q
2
B2 :"2 :1
73
Naturalnie nie ma adnych przeszkd, aby wzbogaci o zakotwiczenia i cza wszelkie

wzmianki o pozostaych kompozytorach.
Po umieszczeniu na waciwych miejscach wszystkich zakotwicze i czy nadchodzi
czas na przetestowanie ich. Rysunek 3.13 pokazuje opis hasa madrygay z czem do
hasa Byrd gotowym do kliknicia.
Rysunek 3.13.
Haso madrygay
z czem do hasa Byrd
Na rysunku 3.14 przedstawiono ekran, jaki ukazuje si po klikniciu sowa Byrd.

Rysunek 3.14.
Haso Byrd
Podczanie zakotwicze wewntrz dokumentu

A co mona zrobi w sytuacji, gdy wszystko znajduje si na jednej obszernej stronie
i trzeba utworzy cza od fragmentu do fragmentu? Zakotwiczenia sprawdzaj si nadal,
pozwalajc na atwe przewijanie duszych stron do wybranego miejsca. Aby podcza wybrane fragmenty tekstu, umieszcza si na ich pocztkach zakotwiczenia
tak jak zwykle. Wwczas, zapisujc kod cza, pomija si nazw pliku strony i podaje
nazw zakotwiczenia poprzedzon znakiem . Jeli, dajmy na to, potrzebujemy cza
do zakotwiczenia o nazwie !"#
$ znajdujcego si na tej samej stronie, co cze, kod
cza wyglda nastpujco:
&
: ? " V*
74
Jeli nazwa pliku nie zostaa podana, przegldarka przyjmuje, e chodzi o stron biec, i gdy takie cze zostaje wybrane, przewija widok do odpowiedniego miejsca.
Bdziemy mogli podziwia t funkcj w akcji w rozdziale nastpnym. Zajmiemy si
tam konstruowaniem kompletnej strony WWW, na pocztku ktrej znajdzie si spis
treci. W spisie tym czytelnik bdzie mg wybiera cza, aby szybko przewija widok
do rnych czci tej samej strony. cza w spisie treci bd prowadzi do nagwkw wszystkich kolejnych czci tekstu. I odwrotnie na kocu kadego fragmentu
umiecimy cze pozwalajce szybko wrci do spisu treci, czyli na pocztek strony.
Anatomia adresu URL

W tym rozdziale wspominalimy ju o adresach URL (kiedy zajmowalimy si czami
do stron zdalnych). Ktokolwiek przeglda strony WWW, si rzeczy zetkn si z pewn
liczb adresw URL. Przede wszystkim jakikolwiek adres jest potrzebny, by w ogle
zacz eksplorowa zasoby WWW.
Skrt URL pochodzi od angielskich sw Uniform Resource Locator jednolity lokalizator zasobw. Adresy URL s jakby nazwami ulic i numerami lecz nie domw,
a kawakw informacji. W wikszoci przypadkw mona atwo okreli potrzebny
adres URL. Wystarczy skierowa przegldark w podane miejsce, a nastpnie przekopiowa do kodu cza dugi acuch znakw pojawiajcy si w okienku adresu. Wiedza o tym, jak zbudowany jest adres URL (i czemu bywa tak dugi i skomplikowany),
bywa czasem jednak przydatna. Co wicej, umiejtno okrelenia adresu URL wasnej witryny okae si konieczna, aby inni mogli j odwiedzi.
W tym podrozdziale omwimy poszczeglne czci adresw URL, ich zastosowanie
w lokalizowaniu informacji na WWW oraz rodzaje adresw URL, ktrych si zwykle
uywa (protokoy HTTP, FTP, typ mailto i inne).
Czci adresu URL

Na wikszo adresw URL skadaj si trzy (z grubsza) czci: protok, nazwa komputera i nazwa katalogu lub pliku (rysunek 3.15).
Rysunek 3.15.
Czci adresu URL
Protokoem nazywamy sposb dostpu do danych; innymi sowy jest to rodek komunikacji sucy przegldarce do pobrania pliku. Jeli przegldarka ma uy protokou
HTTP, w czci adresu okrelajcej protok pojawi si musi skrt
!. Jeli przegldarka ma uy protokou FTP, ma to by skrt

!. Wskazany protok musi od-
75
powiada uywanemu przez serwer, ktry ma udostpni informacje. Nie mona

oczekiwa uzyskania danych, dajmy na to, protokoem FTP, jeli na zdalnym komputerze program serwera FTP nie jest zainstalowany.
Nazwa komputera okrela system, w zasobach ktrego informacje s przechowywan,
np. www.helion.pl, ftp.apple.com lub www.gazeta.pl. Mona te uywa tej samej nazwy komputera z rnymi protokoami. Powstaj wtedy inne adresy URL jak na
przykad:
http://mojsystem.com.pl
ftp://mojsystem.com.pl
Takie dwa adresy URL umoliwiaj dostp do dwch rnych usug informacyjnych
pojedynczego komputera. Przegldarka zastosuje inn metod czenia si w kadym
z tych przypadkw. Jeli oba typy programw serwera s zainstalowane na komputerze
zdalnym, nie bdzie problemu.
Cz adresu URL okrelajca nazw komputera moe zawiera numer portu. Potrzebny
jest on tylko wwczas, gdy serwer zosta ustawiony w taki sposb, e odpowiada na
poczenia skierowane wanie pod ten jeden, wyznaczony numer portu. Jeli serwer
wysuchuje zapyta pod domylnym numerem portu, mona w numer spokojnie pomin. Jednak gdy podanie numeru portu jest konieczne, umieszcza si je po nazwie
komputera, lecz przed nazw katalogu, jak poniej:
http://moj-publicznie-dostepny-unix.com.pl:1550/pub/plik
Wreszcie nazwy katalogu i pliku okrelaj plik lub innego rodzaju czstk danych, ktrych oczekujemy od serwera. Nazwa katalogu moe odpowiada rzeczywistej ciece
dostpu na dysku serwera, moe te by pewnego rodzaju wyznacznikiem uywanym
w danym protokole do odwoania si do informacji. Na przykad katalogi protokou
wistak (ang. Gopher, poprzednik WWW) nie s dosownie katalogami.
Znaki specjalne w adresach URL

Znakiem specjalnym w adresie URL nazywamy taki znak, ktry nie jest ani ma, ani
wielk liter, ani cyfr, ani nie jest to znak dolara (%), mylnik (&), znak podkrelenia
('), kropka () lub znak plus ((). W przypadku wszelkich innych znakw moe zaj
potrzeba zastpowania ich specjalnymi kodami sterujcymi, aby zapobiec faszywej
ich interpretacji.
Kody sterujce w adresach URL skadaj si ze znaku procenta ()) i dwucyfrowej
liczby szesnastkowej. Liczba ta odpowiada kodowi znaku wedug numeracji zestawu
znakw ISO-Latin-1 (nadzbir standardu ASCII). Przykadowo zapis )*+ oznacza znak
spacji, ), to znak zapytania, a )* ukonik.
Zamy, e mamy katalog o nazwie wszystkie moje pliki. Pierwsza prba zapisania
adresu URL zawierajcego t nazw zakoczyaby si zapewne tak:
http://mojkomputerglowny.pl/dysktwardy/wszystkie moje pliki/www/plik.html
76
Jeli umiecioby si taki adres URL ujty w cudzysw w znaczniku tworzcym cze,
mogoby to nawet zadziaa (lecz tylko pod warunkiem, e uyoby si cudzysowu).
Jednake ze wzgldu na fakt, e spacje w adresach URL maj charakter znakw specjalnych, niektre przegldarki mogyby mie z nimi kopot i nie odczyta poprawnie
zawierajcego je adresu. Dla penej zgodnoci z wszelkimi przegldarkami naley
stosowa dla spacji zapis )*+:
http://mojkomputerglowny.pl/dysktwardy/wszystkie%20moje%20pliki/www/plik.html
Jak mona zauway, pojawia si problem z zapisem samego znaku procenta jako takiego.
Jeli nazwa pliku zawiera taki znak, w adresie URL zastpuje si go zapisem )*$.
W wikszoci przypadkw, jeli konsekwentnie stosuje si krtkie nazwy katalogw
zoone wycznie ze znakw alfanumerycznych, nie trzeba uywa w adresach URL adnych znakw specjalnych. Warto o tym pamita podczas pracy nad stronami WWW.
W jzyku HTML 4.01 przewidziano jeszcze inne prcz dotd omawianych atrybuty
znacznika , ktre s jednak rzadziej spotykane. Nale do nich:

- pozwala autorom stron definiowa kolejno zmian aktywnego
cza. Naciskajc klawisz tabulacji, uytkownik moe zmienia aktualnie

aktywny element w sposb analogiczny, jak w oknach dialogowych systemw
Windows lub Mac OS;
atrybuty do obsugi zdarze, takie jak #, " oraz ".
Rodzaje adresw URL

Specyfikacja definiuje wiele rodzajw adresw URL (specyfikacj URL, podobnie jak
i specyfikacj HTML, zajmuj si instytucje zrzeszone w konsorcjum W3C). Ten
podrozdzia opisuje niektre popularne rodzaje adresw URL i potencjalne puapki
czyhajce na uytkownikw.
Protok HTTP
Protokou HTTP (ang. Hypertext Transport Protocol protok przesyu hipertekstu) uywaj serwery WWW do przesyania informacji do przegldarek. Adresy URL
typu HTTP s znacznie popularniejsze od jakichkolwiek innych, poniewa wskazuj
dokumenty na WWW. Powielaj one podstawowy wzorzec adresu URL:
,5*"
*111
Jeli adres URL koczy si ukonikiem, ostatni czon adresu uwaany jest za nazw
katalogu. Serwer w odpowiedzi na takie danie wysya plik domylny dla danego
katalogu. Zwykle jest to plik o nazwie index.html (jeli dana strona WWW jest stron
gwn, nadrzdn wobec pozostaych plikw w katalogu, nazwanie jej index.html
jest bardzo dobrym pomysem).
77
Mona take okreli nazw danego pliku dosownie. Wwczas wczytywany jest plik,
ktrego nazwa znajduje si na kocu adresu URL, jak w nastpujcych przykadach:
,5*"
*111
E*,
,5*"
*111 *,
Adresy URL takie, jak poniej (w ktrym czon blablabla jest nazw katalogu) te
zwykle s akceptowane:
,5*"
*111
W tym ostatnim przypadku, poniewa blablabla jest nazw katalogu, na kocu powinien
pojawia si ukonik. Wikszo serwerw WWW potrafi domyli si, e chodzi o katalog, i przekierowa przegldark do waciwego pliku. Jednak niektre przegldarki
i starsze serwery mog sprawia trudnoci, napotkawszy taki adres URL. Lepiej zawsze
wskazywa katalogi i pliki dosownie, upewniajc si, czy plik o domylnej nazwie
istnieje (jeli podajemy tylko nazw katalogu).
Anonimowy dostp do serwerw FTP

Adresy URL typu FTP su do wskazywania plikw zlokalizowanych na serwerach FTP.
Zwykle chodzi o serwery dopuszczajce dostp anonimowy, czyli takie, do ktrych
mona si zalogowa, podajc nazw uytkownika " i, jako haso, adres poczty
elektronicznej. Adresy URL typu FTP powielaj podstawowy wzorzec adresw URL,
co pokazuj ponisze przykady:
454*"
*111
454*"
*111 *,
Ze wzgldu na moliwo uzyskania z serwera FTP spisu plikw w danym katalogu

ograniczenia dotyczce stosowania na kocu adresu ukonika s odmienne ni w przypadku protokou HTTP. Podanie pierwszego z przykadowych adresw oznacza danie
spisu plikw w katalogu blablabla. Podanie drugiego powoduje pobranie i parsowanie
pliku stronaglowna.html w katalogu blablabla.
Przegldanie katalogw na serwerach FTP za pomoc przegldarki WWW bywa
znacznie wolniejsze ni przegldanie za pomoc specjalizowanego programu klienta
FTP. Przegldarka bowiem nie utrzymuje otwartego poczenia FTP, lecz zamyka je
natychmiast po pobraniu pliku lub spisu zawartoci katalogu. Jeli uytkownik wybiera wywietlone cze do pliku lub katalogu z pobranego spisu, przegldarka
ukada nowy adres URL typu FTP z nazw wybranego pliku, ponownie otwiera poczenie FTP z nowym adresem, pobiera plik lub spis katalogu i znowu zamyka poczenie. W tej sytuacji adresy URL typu FTP najlepiej sprawdzaj si wwczas,
gdy uytkownik wie dokadnie, ktry plik chce pobra, a nie wtedy, gdy chodzi o przegldanie archiwum plikw.
Mimo e przegldarka pobiera plik protokoem FTP, jeli tylko jest to plik HTML wywietli go tak samo, jak gdyby korzystano z protokou HTTP. W przypadku przegldarek
WWW metoda dostpu nie ma znaczenia. Jeli tylko rozpoznaj plik HTML czy to
dziki jednoznacznej informacji z serwera, czy to po rozszerzeniu nazwy pliku parsuj i wywietlaj tre pliku jako stron WWW. Jeli plik nie zostaje rozpoznany jako
78
kod HTML, nie dzieje si nic strasznego. Przegldarki umiej okreli i wywietli
rne rodzaje plikw, poza tym umoliwiaj zapisywanie na dysku plikw wszelakiego
rodzaju.
Dostp do serwerw FTP

z podaniem nazwy uytkownika
Wszystkie adresy URL typu FTP omawiane w poprzednim podrozdziale su do czenia si z serwerami FTP umoliwiajcymi dostp anonimowy. Mona uoy take adres
URL do nazwanych kont na serwerach FTP, jak poniej:
455X4*"
*111 *,
W takim adresie URL oznacza nazw konta na serwerze FTP, natomiast
odpowiednie dla podanej nazwy konta haso. Naley zwrci uwag, e haso zapisane
jest dosownie w adresie URL. Trzeba bardzo uwaa, eby nikt nie oglda w ten
sposb zapisanych adresw i nie umieszcza ich tam, gdzie kto niepowoany mgby
je odczyta2.
Ponadto uywane adresy URL mog zosta zapisane w pamici podrcznej lub pliku
dziennika tak w komputerze lokalnym, jak i w serwerze poredniczcym, gdzie pomidzy przegldark a serwerem docelowym. Z tego powodu prawdopodobnie najlepiej w ogle unika stosowania adresw URL typu FTP z nazw uytkownika.
Adresy URL typu mailto

Adresy URL typu mailto (ang. mail to, dosownie poczta do) su do wysyania
wiadomoci poczty elektronicznej. Jeli przegldarka obsuguje adresy URL typu mailto,
wybranie cza z takim adresem powoduje otwarcie okna dialogowego, gdzie mona
wpisa temat i tre listu, ktry nastpnie zostaje wysany pod okrelony adres poczty
elektronicznej. Ze wzgldu na niuanse ustawie przegldarki i programu pocztowego
w komputerze uytkownika, cza mailto mog zupenie nie dziaa.
Skadnia adresu URL typu mailto rni si od podstawowego wzorca adresu URL i ma
nastpujc posta:
5
czyli na przykad:
5X *
W przeciwiestwie do pozostaych opisywanych tu typw adresw URL, obsuga adresu

URL typu mailto zachodzi wycznie po stronie klienta. Jest to jak gdyby polecenie
dla przegldarki, aby utworzy wiadomo poczty elektronicznej zaadresowan do
2
Warto pamita, e kada przegldarka umoliwia wgld w kod rdowy dowolnej strony HTML.
Na przykad w przegldarce Internet Explorer, aby zobaczy kod rdowy aktualnie otwartej strony,
wystarczy wybra polecenie rdo z menu Widok przyp. tum.
79
okrelonego odbiorcy. Sposb, w jaki si to odbywa, zaley od przegldarki. Wikszo

przegldarek umoliwia take ustalenie w adresie URL domylnego tematu nowego
listu, na przykad:
5X *N1&@2Q\FTQYKGPKC\2QNUMK
Wybranie cza przez uytkownika spowoduje w wikszoci przegldarek wstawienie

podanego tematu do odpowiedniego okienka.
Grupy dyskusyjne Usenet

Adresy URL grup dyskusyjnych przyjmuj jedn z dwch postaci:
5

5

W pierwszym przypadku chodzi o wskazanie grupy dyskusyjnej, czyli na przykad

pl.comp.www albo alt.gothic. Jeli przegldarka obsuguje adresy URL grup dyskusyjnych (bezporednio lub za pomoc programu czytnika), wywietli si spis artykuw
dostpnych w danej grupie dyskusyjnej.
Druga posta pozwala przeczyta okrelony artyku w danej grupie dyskusyjnej. Kady
artyku ma swj unikatowy identyfikator (ang. message ID identyfikator wiadomoci),
ktry zwykle wyglda tak3:
#0-*9X *
Aby uoy adres URL zawierajcy identyfikator artykuu, trzeba usun nawiasy trjktne i doda przedrostek .:
5#0-*9X *
Naley pamita, e artykuy nie s wieczne po upywie pewnego czasu s usuwane

z serwera. W zwizku z tym identyfikator artykuu, ktry w danym momencie jest
poprawny, po krtkim czasie moe si zdezaktualizowa. Aby na stae doczy atryku
do swojej witryny, trzeba go po prostu skopiowa i umieci w osobnym pliku.
W przypadku obu postaci adresu zakada si, e uytkownik ma dostp do grup dyskusyjnych przez serwer NNTP, a do takiego mona odwoa si tylko wwczas, gdy w zmiennych rodowiskowych lub w ustawieniach przegldarki okrelono jego nazw. Z tej przyczyny adresy URL grup dyskusyjnych s najbardziej przydatne po prostu do otwierania
okrelonych artykuw lokalnie, a do tworzenia czy na stronach niekoniecznie.
Identyfikator artykuu mona okreli, wywietlajc jego kod rdowy w czytniku grup dyskusyjnych
lub za pomoc odpowiedniej funkcji takiego programu przyp. tum.
80
Adresy URL grup dyskusyjnych, podobnie jak adresy typu mailto, mog nie by obsugiwane przez wszystkie przegldarki.
Plikowe adresy URL

Plikowe adresy URL s przeznaczone do odwoywania si do plikw przechowywanych na dysku lokalnym. Innymi sowy, wskazuj pliki zlokalizowane w tym samym
systemie plikw, w ktrym dziaa przegldarka. Adresy URL plikw lokalnych przyjmuj jedn z dwch postaci: w pierwszej brak jest nazwy komputera (a wic pojawiaj
si trzy ukoniki pod rzd), w drugiej nazwa komputera jest wyszczeglniona w poniszym przykadzie brzmi
:
45"("G"
45,
(
G"
W zalenoci od uywanej przegldarki odpowiedni bdzie pierwszy, drugi lub oba

schematy.
Plikowe adresy URL s bardzo podobne do adresw URL typu FTP. De facto, jeli
nazwa komputera jest podana i nie jest ni sowo
, przegldarka podejmie
prb pobrania pliku za pomoc protokou FTP. Oba ponisze przykady spowodowayby wczytanie pliku w ten sam sposb:
45&"*1"111"*,
45&"*1"111"*,
Prawdopodobnie najlepszym zastosowaniem plikowego adresu URL jest wskazanie strony

startowej przegldarki (nazywanej te stron gwn). W tym przypadku, poniewa
prawie zawsze chodzi o odwoanie do dysku lokalnego, uywanie plikowego adresu URL
ma sens.
Kopot z plikowymi adresami URL polega na tym, e odwouj si one do plikw
lokalnych, przy czym lokalno oznacza tutaj umiejscowienie w systemie plikw,
w ktrym dziaa przegldarka a nie w systemie, z ktrego pobrano stron! Jeli jeden
uytkownik zastosuje plikowe adresy URL w czach na swojej stronie, a drugi, na
swoim komputerze, wybierze jedno z tych czy przegldarka podejmie prb
otwarcia pliku na dysku komputera drugiego uytkownika (zakoczon zwykle fiaskiem). Co wicej, poniewa plikowy adres URL zawiera bezwzgldn ciek dostpu
do pliku, zastosowanie na stronie plikowego adresu URL uniemoliwia przeniesienie
strony w inne miejsce lub do innego komputera.
Jeli potrzebne jest odwoanie do plikw, ktre znajduj si w tym samym systemie
plikw lub nawet w tym samym katalogu, co bieca strona, naley uywa cieek
wzgldnych zamiast plikowych adresw URL. Dziki ciekom wzgldnym (w odniesieniu do plikw lokalnych) i innym typom adresw URL (w odniesieniu do plikw
zdalnych) w ogle nie powinna wystpi potrzeba stosowania plikowych adresw URL.
81
Podsumowanie
W tym rozdziale scharakteryzowalimy cza. cza zmieniaj WWW z kolekcji niezwizanych z sob stron w olbrzymi system zjednoczonych informacji (jeli wolno tu
przywoa wielkie sowa).
cza tworzy si za pomoc pary znacznikw / , czyli znacznikw tworzcych
cza lub zakotwiczenia. Najwaniejszym atrybutem znacznika tworzcego cze jest
atrybut (wskazuje pliki, do ktrych prowadzi cze), a znacznika tworzcego zakotwiczenia atrybut (okrela nazw zakotwiczenia).
Kiedy czy si strony przechowywane na dysku lokalnym, ich pooenie mona zapisa
w atrybucie jako ciek wzgldn lub bezwgldn. W przypadku czy lokalnych
zalecane s cieki wzgldne, ktre umoliwiaj atwe przenoszenie stron lokalnych
do innego katalogu lub na inny komputer. Zastosowanie cieek bezwzgldnych grozi
uszkodzeniem czy podczas przemieszczania plikw.
Aby podczy stron dostpn na WWW (stron zdaln), jako warto atrybutu
trzeba wpisa adres URL tej strony. Mona ten adres atwo skopiowa: po prostu
otwiera si stron w przegldarce, a potem zaznacza si i kopiuje z okienka adres URL,
aby na koniec wklei go w odpowiednie miejsce w kodzie znacznika.
Utworzenie cza do okrelonej czci strony polega na przygotowaniu tam zakotwiczenia za pomoc znacznika / . Atrybut zastpuje si atrybutem , ktremu przypisuje si nazw zakotwiczenia. Mona wwczas tworzy cza do zakotwiczenia o znanej nazwie za pomoc adresu zoonego z adresu strony, znaku i nazwy
zakotwiczenia.
Na kocu opisano adresy URL, ktrych funkcj jest wskazywanie stron, plikw i innych zasobw informacji w internecie. W zalenoci od rodzaju zasobu adresy URL
skadaj si z rnych czci, ale zwykle jest to po prostu nazwa protokou i okrelenie pooenia. Adresy URL mog suy do lokalizowania rnych rodzajw zasobw
informacji, zwykle jednak wskazuj strony WWW (przedrostek
!), katalogi lub

pliki na serwerach FTP (
!), adresy poczty elektronicznej (
) lub grup dyskusyjnych Usenet ().

HTML I XHTML Dla Każdego

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

HTML I XHTML Dla Każdego

Uploaded by

Copyright:

Available Formats

IDZ DO

Ksika nie koncentruje si na konkretnej platformie systemowej. Zawarte w niej

Rozdzia 2. Rozwj od podstaw .......................................................................... 33

HTML i XHTML dla kadego

Rozdzia 3. Wszystko o czach ......................................................................... 55

Rozdzia 4. Formatowanie tekstu ....................................................................... 83

Rozdzia 5. Obrazki, kolory i ta........................................................................ 123

Rozdzia 6. Tabele ........................................................................................... 153

HTML i XHTML dla kadego

Rozdzia 7. Formatowanie stron za pomoc kaskadowych arkuszy stylw.......... 193

Rozdzia 8. Projektowanie formularzy ............................................................... 225

Rozdzia 9. Mapy obrazw i grafiki animowane ................................................. 257

Rozdzia 10. Dodawanie dwikw, wideo i innych elementw multimedialnych... 281

Rozdzia 11. JavaScript ..................................................................................... 313

HTML i XHTML dla kadego

Rozdzia 12. Praca z JavaScript ......................................................................... 329

Rozdzia 13. Opracowywanie ukadw ramek i okien czonych........................... 347

Rozdzia 14. Techniki DHTML ............................................................................ 377

Rozdzia 15. Publikowanie witryny ..................................................................... 403

Rozdzia 16. Wykorzystywanie moliwoci serwera ............................................. 427

Jak tworzy cza

wybrany przez uytkownika spowoduje otwarcie podczonego pliku.

<a> znacznik tworzcy cza

HTML i XHTML dla kadego

Atrybuty (w tym przykadzie s to: ,  oraz

Poniej inny prosty przykad kodu i prezentacji cza.

wiczenie 3.1. czenie dwch stron

Rozdzia 3. Wszystko o czach

HTML i XHTML dla kadego

Rozdzia 3. Wszystko o czach

Teraz mona utworzy cze w odwrotnym kierunku: ze strony z tekstem do strony

HTML i XHTML dla kadego

czenie stron lokalnych

Kiedy midzy znakami cudzysowu pojawia si wycznie nazwa podczanego pliku,

Rozdzia 3. Wszystko o czach

Tabela 3.1. cieki wzgldne

Plik plik.html znajduje si w katalogu biecym

Plik plik.html znajduje si w katalogu o nazwie pliki,

, 4@A"&  ""*, A

Plik plik.html znajduje si w katalogu o nazwie

Plik plik.html znajduje si w katalogu znajdujcym si

Plik plik.html znajduje si w katalogu o nazwie pliki,

W przypadku czenia stron przechowywanych w komputerze osobistym (typu PC lub

Kiedy plik zapisany na dysku lokalnym podcza si w systemie Windows, dysk

W wikszoci przypadkw uywanie nazw dyskw w ciekach wzgldnych prawie

HTML i XHTML dla kadego

Tabela 3.2 przedstawia kilka przykadw cieek bezwzgldnych wraz z wyjanieniami.

Plik plik.html znajduje si w katalogu lemay,

Plik plik.html znajduje si w katalogu html, ktry

Plik plik.html znajduje si na dysku Dysk

Ktre cieki s lepsze

Rozdzia 3. Wszystko o czach

cza do innych dokumentw w sieci

Rysunek 3.5. cze do zdalnego pliku

wiczenie 3.2. Podczanie stron

HTML i XHTML dla kadego

Rysunek 3.6. Spis artykuw na witrynie Strefa Rzymu

W wikszoci przegldarek adres URL otwartej w danym momencie strony pojawia si

Rozdzia 3. Wszystko o czach

Po zdobyciu adresu URL podanej strony mona skonstruowa znacznik tworzcy

wiczenie 3.3. Jak utworzy menu czy

HTML i XHTML dla kadego

Rozdzia 3. Wszystko o czach

Atrybuty (w tym przykadzie s to: , oraz

,4@A"&""*,A

846* .12 . " &

W tym przykadzie mona zauway pojawienie si znacznika , ktry powoduje

Zwrmy uwag, e nazw zapisano z maej litery. W nazwach zakotwicze