IDZ DO

PRZYKADOWY ROZDZIA
SPIS TRECI

KATALOG KSIEK
KATALOG ONLINE

Tworzenie stron WWW.

Kurs. Wydanie II
Autor: Radosaw Sok
ISBN: 83-246-0798-6
Format: B5, stron: 312

ZAMW DRUKOWANY KATALOG

TWJ KOSZYK
DODAJ DO KOSZYKA

CENNIK I INFORMACJE
ZAMW INFORMACJE
O NOWOCIACH
ZAMW CENNIK

CZYTELNIA
FRAGMENTY KSIEK ONLINE

Wydawnictwo Helion
ul. Kociuszki 1c
44-100 Gliwice
tel. 032 230 98 63
e-mail: helion@helion.pl

Dynamiczny rozwj internetu i jego coraz wikszy zasig sprawiaj, e witryny WWW
stay si niemal obowizkowymi wizytwkami przedsibiorstw i organizacji. Take coraz
wicej uytkownikw prywatnych tworzy wasne miejsca w sieci prezentujc na nich
wykonane przez siebie zdjcia, opisujc swoje zainteresowania lub prowadzc
internetowe pamitniki zwane blogami. Na rynku oprogramowania pojawia si coraz
wicej narzdzi pozwalajcych na tworzenie stron internetowych bez znajomoci ich
podstawowego budulca jzyka HTML, jednak jako generowanego przez nie kodu
czsto pozostawia sporo do yczenia. Znajomo znacznikw HTML i umiejtno
rcznego stworzenia strony WWW nadal pozostaje podstawow umiejtnoci,
jak musi posi kady, kto chce zaistnie w sieci.
Dziki ksice Tworzenie stron WWW. Kurs. Wydanie II opanujesz najnowsz wersj
jzyka HTML oraz jego rozszerzon i zunifikowan posta XHTML. Nauczysz si
pisa kod HTML w zwykym edytorze tekstu. Dowiesz si, jak skonstruowane s
dokumenty HTML i jak rol peni poszczeglne znaczniki tego jzyka. Nauczysz si
wprowadza i formatowa tekst, przygotowywa i osadza w kodzie elementy graficzne
oraz projektowa mechanizmy nawigacji. Poznasz technologi kaskadowych arkuszy
stylw, podstawy jzyka JavaScript oraz zasady tworzenia tabel i ramek. Dowiesz si
take, w jaki sposb opublikowa gotow witryn WWW na serwerze internetowym.
W ksice znajdziesz rwnie niezwykle przydatne w pracy zestawienie wszystkich
znacznikw jzyka XHTML.
Struktura dokumentw HTML
Wprowadzanie tekstu i okrelanie jego atrybutw
Tworzenie czy do innych stron WWW oraz do poczty elektronicznej
Osadzanie na stronie elementw graficznych
Tworzenie tabel i ramek
Korzystanie z kaskadowych arkuszy stylw
Umieszczanie na stronie elementw dynamicznych z wykorzystaniem
jzyka JavaScript
Projektowanie struktury serwisu WWW
Publikacja witryny na serwerze za pomoc klienta FTP
Po przeczytaniu tej ksiki bdziesz gotowy do stworzenia wasnej witryny WWW.
Opanowanie wiadomoci w niej zawartych to pierwszy krok do zostania profesjonalnym
webmasterem.

Spis treci
Wstp ......................................................................................................................................................7
Rozdzia 1.

Nowa strona WWW .......................................................................................................................15

Uruchomienie programu Notatnik ....................................................................................16
Wprowadzanie podstawowego kodu strony .....................................................................18
Ustalanie tytuu strony WWW ...........................................................................................20
Zapisywanie kodu strony na dysku twardym ...................................................................21
Otwieranie zapisanej wczeniej strony WWW ................................................................23
Wywietlanie strony w przegldarce ..................................................................................24
Aktualizowanie strony w przegldarce ..............................................................................27
Kopiowanie fragmentu kodu HTML .................................................................................28
Wklejanie uprzednio skopiowanego fragmentu kodu HTML .......................................29
Wycinanie fragmentu kodu HTML ...................................................................................30
Podsumowanie......................................................................................................................31

Rozdzia 2.

Tekst i jego atrybuty.....................................................................................................................33

Wprowadzanie tekstu...........................................................................................................34
Deklarowanie sposobu kodowania polskich znakw diakrytycznych ..........................35
Zapisanie fragmentu tekstu czcionk pogrubion ...........................................................37
Zapisanie fragmentu tekstu kursyw .................................................................................38
Podkrelenie fragmentu tekstu ...........................................................................................39
Twarde spacje ........................................................................................................................40
Indeksy grne i dolne...........................................................................................................41
Zapisywanie fragmentu tekstu czcionk nieproporcjonaln..........................................42
Zapisywanie wikszego fragmentu tekstu czcionk nieproporcjonaln .......................44
Zmiana sposobu wyrwnywania akapitu tekstu ..............................................................46
amanie tekstu wewntrz akapitu ......................................................................................48
Zmiana koloru treci i ta akapitu ......................................................................................49
Zmiana koloru treci i ta fragmentu tekstu .....................................................................51
Zmiana rozmiaru czcionki ..................................................................................................52
Zmiana kroju pisma .............................................................................................................53
Okrelanie marginesw akapitu .........................................................................................55
Tworzenie nagwka ............................................................................................................57
Wstawianie poziomej linii...................................................................................................59
Zmiana wygldu poziomej linii..........................................................................................60
Lista wypunktowana ............................................................................................................62
Zagniedanie listy ...............................................................................................................63
Lista numerowana ................................................................................................................64
Wstawianie znakw specjalnych ........................................................................................65
Kompletna, prosta strona ....................................................................................................67
Podsumowanie......................................................................................................................70

Spis treci

Rozdzia 3.

Odnoniki ..........................................................................................................................................71
Tworzenie odnonika...........................................................................................................72
Tworzenie odnonika pocztowego .....................................................................................73
Definiowanie domylnego tematu wiadomoci pocztowej.............................................75
Definiowanie etykiety ..........................................................................................................77
Tworzenie odnonika prowadzcego do etykiety ............................................................78
Tworzenie odnonika prowadzcego do etykiety zadeklarowanej
na innej stronie WWW .......................................................................................................79
Otwieranie odnonika w nowym oknie ............................................................................81
Podsumowanie......................................................................................................................82

Rozdzia 4.

Obrazy.................................................................................................................................................83
Format GIF............................................................................................................................84
Format JPEG .........................................................................................................................86
Pobieranie i instalowanie programu IrfanView ...............................................................87
Umieszczanie obrazu na stronie WWW .........................................................................101
Podsumowanie....................................................................................................................127

Rozdzia 5.

Tabele ...............................................................................................................................................129
Jak w jzyku HTML opisuje si tabel? ...........................................................................130
Tworzenie tabeli .................................................................................................................131
Wprowadzanie tekstu do komrki tabeli ........................................................................135
Zmiana szerokoci kolumny tabeli ..................................................................................136
Zmiana koloru ta tabeli ....................................................................................................138
Zmiana koloru ta komrki tabeli ....................................................................................139
Zmiana marginesw komrek tabeli ...............................................................................140
Wstawianie nowego wiersza tabeli...................................................................................142
Wstawianie nowej kolumny tabeli ...................................................................................144
Scalanie komrek tabeli .....................................................................................................146
Dzielenie scalonej komrki tabeli ....................................................................................150
Okrelenie pooenia zawartoci komrki tabeli ...........................................................152
Tabela tworzca ukad strony ...........................................................................................154
Podsumowanie....................................................................................................................161

Rozdzia 6.

Kaskadowe arkusze stylu ........................................................................................................163

Styl wpisany.........................................................................................................................164
Styl osadzony ......................................................................................................................165
Zewntrzny arkusz stylu ....................................................................................................166
Dlaczego kaskadowe? .....................................................................................................167
Zmiana czcionki, kolorw tekstu i ta oraz marginesw tekstu ...................................168
Zmiana wygldu elementu jzyka HTML ......................................................................171
Definiowanie klas wygldu elementu jzyka HTML .....................................................173
Definiowanie niezalenych klas stylu ..............................................................................175
Zmiana wygldu odnonikw ..........................................................................................177
Tworzenie zewntrznego arkusza stylu ...........................................................................179
Podsumowanie....................................................................................................................182

Spis treci

Rozdzia 7.

Ramki ................................................................................................................................................183
Budowa serwisu skadajcego si z ramek ......................................................................184
Tworzenie strony podzielonej na ramki ..........................................................................185
Weryfikowanie podziau na ramki ...................................................................................188
Tworzenie ramki z tytuem serwisu .................................................................................189
Tworzenie ramki z menu ...................................................................................................190
Tworzenie ramki z treci .................................................................................................191
Ustalanie pocztkowej zawartoci ramek ........................................................................192
Tworzenie odnonika prowadzcego do wybranej ramki ............................................194
Tworzenie odnonika otwierajcego nowe okno przegldarki ....................................196
Blokowanie moliwoci zmiany szerokoci ramki .........................................................198
Zmiana obramowania ramki ............................................................................................200
Tworzenie treci alternatywnej .........................................................................................201
Ramka osadzona.................................................................................................................202
Usuwanie obramowania ramki osadzonej ......................................................................204
Podsumowanie....................................................................................................................205

Rozdzia 8.

JavaScript ........................................................................................................................................207
Quiz internetowy ................................................................................................................208
Dynamiczne menu .............................................................................................................217
Podsumowanie....................................................................................................................221

Rozdzia 9.

Serwis internetowy .....................................................................................................................223

Strona gwna serwisu .......................................................................................................224
Dynamiczne tworzenie stron WWW ..............................................................................225
Informacje o stronie WWW .............................................................................................232
Podsumowanie....................................................................................................................234

Rozdzia 10. Publikowanie serwisu WWW ..................................................................................................235

Instalowanie programu SmartFTP...................................................................................237
Uruchomienie programu SmartFTP ...............................................................................245
Tworzenie nowego poczenia ..........................................................................................246
Nawizywanie poczenia .................................................................................................249
Zrywanie poczenia z serwerem .....................................................................................251
Aktualizowanie listy plikw ..............................................................................................252
Podwietlanie grupy plikw ..............................................................................................253
Pobieranie plikw z serwera .............................................................................................254
Tworzenie nowego folderu na serwerze ..........................................................................255
Umieszczanie plikw na serwerze ....................................................................................256
Weryfikacja poprawnoci opublikowania pliku HTML ................................................257
Zmiana nazwy folderu lub pliku umieszczonego na serwerze.....................................259
Zmiana praw dostpu do folderw lub plikw umieszczonych na serwerze .............260
Usuwanie plikw przechowywanych na serwerze .........................................................262
Weryfikacja zgodnoci kodu HTML ze standardami ....................................................264
Podsumowanie....................................................................................................................266

Spis treci

Rozdzia 11. Zakoczenie..................................................................................................................................................... 267

Dodatek A

Elementy jzyka XHTML ..........................................................................................................269

Elementy podstawowe .......................................................................................................270
Atrybuty tekstu ...................................................................................................................272
Bloki tekstu..........................................................................................................................274
Odnoniki i etykiety...........................................................................................................276
Ramki ...................................................................................................................................277
Formularze ..........................................................................................................................279
Listy ......................................................................................................................................284
Obrazy..................................................................................................................................285
Tabele ...................................................................................................................................287
Kaskadowe arkusze stylu ...................................................................................................291
Informacje o dokumencie .................................................................................................293
Programowanie...................................................................................................................295
Skorowidz .............................................................................................................................................. 297

!
!
!

Tworzenie odnonika
Tworzenie odnonika pocztowego
Deniowanie domylnego tematu
wiadomoci pocztowej

!
!

Deniowanie etykiety
Tworzenie odnonika prowadzcego
do etykiety

Tworzenie odnonika prowadzcego

do etykiety zadeklarowanej na innej
stronie WWW

!
!

Otwieranie odnonika w nowym oknie

Podsumowanie

Odnoniki

Odnoniki jeszcze do niedawna odrniay strony WWW od wszystkich innych dokumentw elektronicznych. Dzisiaj moliwo deklarowania w prawie kadym typie dokumentu odnonikw do dowolnych innych materiaw niezalenie od ich
umiejscowienia w globalnej sieci zrewolucjonizowaa wiat informacji. Czy klikajc
odnonik przenoszcy Ci z jednego artykuu do drugiego, moesz sobie wyobrazi,
e kiedy korzystano z globalnej sieci komputerowej bez ich pomocy?
Odnoniki, nazywane czasem poczeniami (lub linkami od angielskiego sowa
link), s niesamowicie uytecznym i wygodnym narzdziem. Co ciekawe, tworzy si je
wyjtkowo atwo.
Adresy internetowe dziel si na:
bezwzgldne (np. http://www.helion.pl/) podany adres od pocztku
do koca (bezwzgldnie) definiuje pooenie strony WWW i moe by stosowany w takiej samej postaci, niezalenie od strony WWW, na ktrej
go uyjemy,
wzgldne (np. ../teksty/opis.html lub te nowy.html) podany adres definiuje
pooenie strony WWW wycznie wzgldem aktualnej strony; uycie go na
innej stronie WWW (umieszczonej w innym katalogu tego samego serwera
lub na innym serwerze) uniemoliwi odszukanie wskazywanego przez odnonik dokumentu.
Adresy internetowe czsto nazywane s te adresami URL lub URI od angielskich
nazw Uniform Resource Locator oraz Uniform Resource Identifier (jednolity lokalizator
zasobu).

72

Tworzenie odnonika

Tworzenie odnonika
Odnonik reprezentuje obiekt o nazwie <a>. Bdzie on pojawia si we wszystkich
przykadach w tym rozdziale.
6

1. Umie kursor w tym miejscu

kodu, w ktrym ma si pojawi
odnonik. Najczciej odnoniki
umieszcza si wewntrz akapitu
tekstu, czyli wewntrz elementu
<p>.
2. Wprowad kod elementu <a>.

3. Rozbuduj element <a> o atrybut href zawierajcy zapisany w cudzysowie docelowy adres URL odnonika:
<a href=adres-docelowy>
Wprowadzajc bezwzgldny adres strony WWW, nie zapominaj o poprawnym sformowaniu go. Adres bezwzgldny musi zaczyna si od nazwy protokou internetowego
(w przypadku stron WWW: http://). Jeeli adres zawiera tylko nazw serwera, musi koczy si znakiem /.

4. Wprowad tekst, ktry ma by wywietlany jako odnonik.

Staraj si unika definiowania jako odnonikw sformuowa typu kliknij tutaj.

5. Zamknij element <a>.

6. Zapisz wprowadzone zmiany.
7. Uaktywnij okno przegldarki.
7
8

8. Zaktualizuj wywietlan stron.

9. Umie wskanik myszy na utworzonym odnoniku. Kliknij
i sprawd, czy faktycznie przeniesie
Ci do strony WWW, ktrej adres
wpisae w kodzie.

Tworzenie odnonika pocztowego

73

Tworzenie odnonika pocztowego

Najprawdopodobniej nieraz na stronach WWW widziae odnoniki, ktrych kliknicie
natychmiast otwierao okno Twojego programu pocztowego z now, automatycznie zaadresowan wiadomoci. Wbrew pozorom, przygotowanie takiego odnonika jest rwnie atwe jak zbudowanie zwykego odnonika prowadzcego do strony internetowej.
Umieszczenie na stronie odnonika prowadzcego do Twojej skrzynki pocztowej zdecydowanie podniesie jako tworzonej strony, gdy umoliwi jej czytelnikom zgaszanie
pod Twoim adresem uwag jej dotyczcych. Nie zapominaj zatem o tym szczegle najlepiej za przygotuj sobie szablon pustej strony (na podstawie ktrego bdziesz tworzy
kolejne strony podrzdne serwisu) z utworzonym w jej stopce odnonikiem pocztowym.
6

1. Umie kursor w miejscu kodu,

w ktrym ma si pojawi odnonik
pocztowy.
1

2. Wprowad kod elementu <a>.

3

3. Rozbuduj element <a> o atrybut

href zawierajcy zapisane w cudzysowie wyraenie mailto: oraz docelowy adres pocztowy:
<a href=mailto:adrespocztowy>

4. Wprowad tekst, ktry ma by wywietlany jako odnonik. Moe to

by np. Twoje imi i nazwisko.
5. Zamknij element <a>.
6. Zapisz wprowadzone zmiany.
7. Uaktywnij okno przegldarki.
7
8

8. Zaktualizuj wywietlan stron.

9. Kliknij utworzony odnonik, aby
przetestowa jego dziaanie i sprawdzi, czy program pocztowy otworzy do edycji prawidowo zaadresowan wiadomo pocztow.

74

Tworzenie odnonika pocztowego

10. System Windows Vista wywietli

ostrzeenie informujce, e strona
WWW prbuje uzyska dostp
do Twojej poczty elektronicznej.

10

11

11. Udziel zgody na rozpoczcie tworzenia nowej wiadomoci pocztowej, klikajc przycisk Zezwalaj.

12. Wiadomo pocztowa zostaa poprawnie zaadresowana. Czytelnik

Twojej strony musi teraz jedynie
wprowadzi temat i tre wiadomoci oraz wysa j.

12

Pamitaj, e zamieszczenie adresu pocztowego na stronie WWW dostpnej w Internecie

jest rwnoznaczne z ujawnieniem go wszystkim osobom rozsyajcym hurtowo niechciane wiadomoci elektroniczne (tzw. spam). Jeli zdecydujesz si da czytelnikom
Twojej strony moliwo kontaktowania si z Tob, zadbaj o zabezpieczenie swojej
skrzynki pocztowej przed napywem spamu.

Deniowanie domylnego tematu wiadomoci pocztowej

75

Deniowanie domylnego tematu

wiadomoci pocztowej
Jeli chcesz jeszcze lepiej zautomatyzowa proces wysyania wiadomoci pocztowej,
moesz bezporednio w kodzie odnonika poda domylny temat tworzonej wiadomoci pocztowej.
3

1. Umie kursor wewntrz wartoci atrybutu href znacznika <a>, zaraz za wprowadzonym docelowym adresem pocztowym.
2. Wprowad tekst ?Subject= oraz domyln tre tematu wiadomoci pocztowej:
<a href=mailto:adres-pocztowy?Subject=temat wiadomosci pocztowej>
Staraj si zapisywa domylne tematy wiadomoci pocztowych wycznie z wykorzystaniem znakw alfabetu aciskiego, bez stosowania polskich znakw diakrytycznych.
Pozwoli Ci to unikn problemw zwizanych z rnorodnoci standardw kodowania znakw.

3. Zapisz wprowadzone zmiany.

4. Uaktywnij okno przegldarki.
4
5

5. Zaktualizuj wywietlan stron.

6. Wygld odnonika nie zmieni si.
Kliknij go jednak, aby przetestowa
jego dziaanie.

76

Deniowanie domylnego tematu wiadomoci pocztowej

7. Jeeli nie chcesz za kadym razem

potwierdza chci wysania wiadomoci, umie znacznik w polu
Nie pokazuj ostrzeenia dla tego
programu ponownie.
8

8. Zaakceptuj ostrzeenie.

9
10

9. Utworzona wiadomo pocztowa

zostaa teraz nie tylko prawidowo
zaadresowana
10. ale rwnie opatrzona odpowiednim tytuem.

Deniowanie etykiety

77

Deniowanie etykiety
Nie zawsze informacja, do ktrej naley zapewni szybki dostp za pomoc odnonika, znajduje si na innej stronie WWW. Czsto przydaje si moliwo zdefiniowania odnonika przenoszcego czytelnika do innego miejsca tej samej strony WWW.
Pierwszym krokiem przy tworzeniu takiego odnonika jest zdefiniowanie etykiety
(zwanej te czasem zakotwiczeniem od jej angielskiej nazwy anchor), czyli punktu
docelowego dla odnonikw.
Najczstszym zastosowaniem etykiet i prowadzcych do nich odnonikw s odnoniki
umoliwiajce czytelnikowi powrt na pocztek strony.

1. Umie kursor w tym miejscu

kodu, ktre ma zosta oznaczone
etykiet.

2. Wprowad kod elementu <a>

w postaci pojedynczego znacznika otwierajcego i zamykajcego
element.

3
2

3. Dodaj do utworzonego elementu

<a> atrybut name, ktrego warto
stanowi nazw tworzonej etykiety:
<a name=nazwa-etykiety />
Nazwa etykiety powinna skada si wycznie z liter alfabetu aciskiego i nie moe zawiera znakw spacji. Zastosowanie innych znakw moe spowodowa, e odnoniki
prowadzce do etykiety nie bd funkcjonowa.

4. Zapisz wprowadzone zmiany.

Etykiety s cakowicie niewidoczne podczas przegldania strony za pomoc przegldarki internetowej.

78

Tworzenie odnonika prowadzcego do etykiety

Tworzenie odnonika prowadzcego

do etykiety
1. Umie kursor w tym miejscu kodu,
w ktrym ma si pojawi odnonik.

2. Wprowad kod elementu <a>.

3. Rozbuduj element <a> o atrybut

href zawierajcy znak # oraz zapisan w cudzysowie nazw utworzonej wczeniej docelowej etykiety:

<a href=#etykieta-docelowa>

7
8

4. Wprowad tekst, ktry ma by wywietlany jako odnonik.

5. Zamknij element <a>.
6. Zapisz wprowadzone zmiany.
7. Uaktywnij okno przegldarki.

8. Zaktualizuj wywietlan stron.

9. Kliknij utworzony odnonik, by
przetestowa jego dziaanie.
10

11

10. Do adresu strony dopisana zostaa

nazwa etykiety
11. a zawarto okna przegldarki
przesuna si tak, by widoczny
sta si fragment strony oznaczony
w kodzie etykiet.

Pamitaj, e odnoniki prowadzce do etykiet bd dziaa tylko wtedy, gdy etykieta, do

ktrej prowadzi odnonik, umieszczona jest w miejscu strony niewidocznym w danym
momencie w oknie przegldarki. Nie zdziw si wic, jeli po utworzeniu bardzo krtkiej
strony testowej zawierajcej etykiet i prowadzcy do niej odnonik skorzystanie z odnonika nie da adnego efektu mechanizm ten zosta przystosowany do nawigowania
po wyjtkowo obszernych stronach WWW.

Tworzenie odnonika prowadzcego do etykiety zadeklarowanej na innej stronie WWW

79

Tworzenie odnonika prowadzcego

do etykiety zadeklarowanej na innej
stronie WWW
Etykiety i prowadzce do nich odnoniki najatwiej wykorzysta do uproszczenia nawigacji w ramach jednej strony WWW. Jednak odnonik moe rwnie prowadzi do
etykiety znajdujcej si na zupenie innej stronie! Wykorzystujc t moliwo jzyka
HTML, umoliwisz czytelnikowi Twojego serwisu WWW przechodzenie do okrelonego fragmentu dowolnej strony za pomoc jednego tylko kliknicia odnonika.
1. Umie kursor w tym miejscu
kodu, w ktrym ma si pojawi
odnonik.

Pamitaj odnonik musi znajdowa si w innym pliku ni etykieta. Krtko mwic,

musisz przygotowa dwie strony WWW (dwa pliki .html): jeden z etykiet (jak w poprzednim wiczeniu), a drugi z odnonikiem (przygotowywany tutaj).

2. Wprowad kod elementu <a>.

3. Rozbuduj element <a> o atrybut href zawierajcy zapisany w cudzysowie docelowy adres URL odnonika, znak # oraz nazw docelowej etykiety:
<a href=adres-docelowy#docelowa-etykieta>
Adresem docelowym moe by po prostu nazwa drugiego pliku .html oba pliki musz
si w takim przypadku znajdowa w tym samym folderze na dysku. To najprostsza posta odnonika o adresie wzgldnym.

4. Wprowad tekst, ktry ma by wywietlany jako odnonik.

5. Zamknij element <a>.
6. Zapisz wprowadzone zmiany.

80

Tworzenie odnonika prowadzcego do etykiety zadeklarowanej na innej stronie WWW

7. Uaktywnij okno przegldarki.

7
8
9

8. Zaktualizuj wywietlan stron

lub otwrz plik strony WWW zawierajcej utworzony przed chwil
odnonik.
9. Kliknij utworzony odnonik,
by przetestowa jego dziaanie.

10

11

10. W polu adresu pojawi si adres docelowej strony wraz z nazw wybranej etykiety
11. a zawarto okna przegldarki
zostanie przesunita tak, by widoczny sta si fragment strony
oznaczony w kodzie etykiet.

Otwieranie odnonika w nowym oknie

81

Otwieranie odnonika w nowym oknie

Domylnie odnoniki powoduj wywietlenie docelowej strony w tym samym oknie
przegldarki, w ktrym znajdowa si odnonik. Jeli chcesz, by cel odnonika otwarty
zosta w nowym oknie przegldarki, a na ekranie pozostao okno wywietlajce Twoj
stron, wystarczy, e dodasz do elementu <a> jeden atrybut z odpowiednim elementem.
7

1. Umie kursor w tym miejscu kodu,

w ktrym ma znale si odnonik.
2. Wprowad kod znacznika otwierajcego element <a>.

4
2

3. Uzupenij kod elementu <a> atrybutem href zawierajcym adres

docelowy odnonika:
<a href=adres-docelowy>

4. Uzupenij kod elementu <a> atrybutem target z parametrem _

blank. Informuje on przegldark,
e kliknicie odnonika powinno
powodowa otwarcie nowego okna:
<a href=adres-docelowy
target=_blank>
9

5. Wprowad tekst odnonika.

6. Zamknij element <a>. Kod odnonika powinien wyglda teraz
mniej wicej tak:

10

<a href=adres-docelowy
target=_blank>Tekst
odnonika</a>

7. Zapisz wprowadzone zmiany.

8. Uaktywnij okno przegldarki.
11

9. Zaktualizuj wywietlan stron.

10. Kliknij odnonik.
11. Docelowa strona WWW otwara
si w nowym oknie przegldarki.

82

Podsumowanie

Podsumowanie
Prawidowo skonstruowany system odnonikw moe znacznie polepszy jako
Twojego serwisu internetowego. Jeli dusze strony WWW wyposaysz w prosty spis
treci utworzony z odnonikw prowadzcych do fragmentw tekstu, a na kocu kadego fragmentu umiecisz dyskretny odnonik umoliwiajcy powrt do pocztku
strony oraz do gwnej strony serwisu, nawigacja bdzie znacznie przyjemniejsza
i efektywniejsza.
Postaraj si przewiczy najwaniejsze zagadnienia dotyczce odnonikw:
utwrz dug stron WWW (moesz j wypeni bezsensownym zbiorem
znakw), podziel j na fragmenty opatrzone tytuami, a nastpnie wykorzystujc etykiety i odnoniki opracuj na pocztku strony menu prowadzce do poszczeglnych czci tekstu,
przygotuj stron zawierajc odnoniki prowadzce do serwisw internetowych najczciej przez Ciebie odwiedzanych; jeli dobrze j przygotujesz, moesz nawet pokusi si o wykorzystanie jej jako Twojej strony domowej i rozpoczynanie surfowania po Sieci wanie od niej.