You are on page 1of 22

IDZ DO

PRZYKADOWY ROZDZIA
SPIS TRECI

KATALOG KSIEK
KATALOG ONLINE

Po prostu Internet
Autor: Tomasz Trejderowski
ISBN: 83-7197-681-X
Format: B5, stron: okoo 330

ZAMW DRUKOWANY KATALOG

TWJ KOSZYK
DODAJ DO KOSZYKA

CENNIK I INFORMACJE
ZAMW INFORMACJE
O NOWOCIACH
ZAMW CENNIK

CZYTELNIA
FRAGMENTY KSIEK ONLINE

Wydawnictwo Helion
ul. Chopina 6
44-100 Gliwice
tel. (32)230-98-63
e-mail: helion@helion.pl

A wic chcesz pozna Internet i stworzy wasn stron internetow? aden problem!
Zapewne zastanawiasz si, jak duga bdzie lista umiejtnoci, ktre powiniene posiada,
by mc skorzysta z tej ksiki. Ot nic bardziej mylnego! Ksika jest tak napisana, aby
mg z niej skorzysta kady bez wzgldu na posiadany dotychczas zasb wiedzy.
Omwione jest w niej wszystko, co jest niezbdne, by mc wykreowa wasn witryn
internetow, posugiwa si poczt elektroniczn czy te ciga pliki przez FTP.
Ksika Po prostu Internet zostaa napisana z myl o wszystkich tych Czytelnikach,
ktrzy chc nalee lub od niedugiego czasu nale do spoecznoci internetowej w
Polsce. Gwn tematyk ksiki stanowi, opisane w sposb rzeczowy i bardzo bogato
ilustrowane, tworzenie stron WWW, lecz nie zabrako take niezbdnych informacji
podstawowych -- wprowadzajcych w tematyk zwizan z Internetem.
Ksika ta dotyczy tworzenia stron internetowych na komputerach klasy PC. Przeznaczona
jest gwnie dla pocztkujcych webmasterw, jednake osoby posiadajce ju pewne
dowiadczenie w tej materii rwnie mog znale w niej interesujce pozycje.

Po prostu Internet

Wstp

Dla kogo jest ta ksika?

11

Cz I

Wiadomoci

15

Rozdzia 1.

Po prostu... Internet
17
Genesis, czyli jak to wszystko si zaczo... .............................................18
Jak to dziaa? .............................................................................................24
www.fajna_nazwa.com .............................................................................26

Serwer co to takiego???........................................................................35
World Wide Web Consortium...................................................................36
Porzdek musi by! ........................................................................................... 36
Jzyk... ............................................................................................................... 37
Internet take dla niepenosprawnych ............................................................... 38

Internet wiat peen dziww.................................................................39


Internet2 znaczy przyszo............................................................................... 39
Czy Internet przetrwaby wojn nuklearn?...................................................... 40

Rozdzia 2.

Historie prze Internet pisane...


41
Jarkko Oikarinen: powstanie IRC-a ..........................................................42
Dariusz Majgier: jak to z Reporterem byo... ............................................45

Rozdzia 3.

Zaczynamy!
51
Modem ......................................................................................................52
A po co mi co takiego? .................................................................................... 52
Wybr modemu ................................................................................................. 53
Umieszczenie modemu w komputerze.............................................................. 57
Instalacja oprogramowania (sterowniki) ........................................................... 59
Konfiguracja poczenia z Internetem............................................................... 63
Koszt poczenia................................................................................................ 70
5

Spis treci

Ruch w sieci....................................................................................................... 26
Zamiana na adres IP .......................................................................................... 27
Adresy internetowe............................................................................................ 29
Koszt .................................................................................................................. 30
Domeny gwne................................................................................................. 31

Spis treci

Terminal SDI.............................................................................................72
Klasyfikacja ....................................................................................................... 72
Monta ............................................................................................................... 72
Instalacja oprogramowania (sterowniki) ........................................................... 74
Korzystanie z terminala ..................................................................................... 77

(Pierwsze) poczenie z Internetem...........................................................78


Logowanie ......................................................................................................... 78
Negocjacja modemw ....................................................................................... 79
Poczenie.......................................................................................................... 82
Testowanie poczenia....................................................................................... 83
Zakoczenie poczenia..................................................................................... 86

Rozdzia 4.

Przegldarki internetowe
87
Korzystanie z przegldarki........................................................................88
Strony internetowe............................................................................................. 88
On-line/Off-line ................................................................................................. 89

Spis treci

Wojny przegldarek ..................................................................................96


Wbudowane edytory .................................................................................97
Rozszerzone paski narzdziowe................................................................97
Microsoft Internet Explorer.......................................................................98
W dwch sowach.............................................................................................. 98
Instalacja.......................................................................................................... 100
Uytkowanie.................................................................................................... 101
Konfiguracja .................................................................................................... 105

Netscape Communicator 4.61 .................................................................109


Sylaba Komunikator 4.75........................................................................110
Netscape 6 ...............................................................................................112
Opera 4 ....................................................................................................115
Rozdzia 5.

Pi sw o poczcie elektronicznej
119
Adres pocztowy.......................................................................................121
Outlook Express ......................................................................................122
Konfiguracja programu ................................................................................... 122
Ksika adresowa ............................................................................................ 129
Zarejestrowanie nowego konta pocztowego w programie .............................. 130
Tworzenie i wysyanie nowej wiadomoci, odpowiadanie na wiadomo..... 133
Wirusy ............................................................................................................. 144
Wysyanie plikw ............................................................................................ 148
Grupy dyskusyjne ............................................................................................ 149

Po prostu Internet

Rozdzia 6.

Panie! A jak tam polskie ogonki?

151

Rozdzia 7.

Narzdzia do edycji HTML

155

Rozdzia 8.

Filozofia katalogw i plikw na serwerach internetowych


161
Krtka charakterystyka systemw uniksowych ......................................162
Adresy porednie i bezporednie...............................................................164
index.html................................................................................................165
Tylko NIE polskie ogonki!......................................................................166

Cz II

HTML

167

Rozdzia 9.

Co to jest ten HTML?

169

Rozdzia 10. Netykieta Webmastera

173

Rozdzia 12. Struktura pliku HTML


195
Do czego su edytory znacznikw HTML? .........................................198
Prologi .....................................................................................................200
Stae elementy jzyka HTML..................................................................202
Sekcja <HEAD> nagwek strony .....................................................203
Meta ................................................................................................................. 203
Tytu strony internetowej ................................................................................ 207
Adres bazowy .................................................................................................. 207

Sekcja <BODY> waciwa tre strony .............................................208


Kolory .............................................................................................................. 208

Grafika.....................................................................................................210
7

Spis treci

Rozdzia 11. HTML dla bardzo, bardzo niecierpliwych


179
Znaczniki HTML.....................................................................................180
Szkielet dokumentu .................................................................................181
Dodatkowe informacje dla przegldarki .................................................182
Tytuy ......................................................................................................184
Rozdzielanie linii i akapitw...................................................................185
Linie poziome..........................................................................................186
Numerowanie i wypunktowanie..............................................................187
Rne formatowanie tekstu .....................................................................188
Odnoniki ................................................................................................191
Grafika.....................................................................................................192
Zakoczenie ............................................................................................193

Spis treci

Rozdzia 13. Czcionki


211
Wprowadzanie tekstu ..............................................................................212
Oglnie ............................................................................................................ 212
Znaki specjalne ................................................................................................ 214

Spis treci

Format tekstu...........................................................................................215
Krj czcionki ...........................................................................................217
Rozmiar czcionki.....................................................................................218
Kolor czcionki .........................................................................................219
Znaczniki logiczne ..................................................................................220
Rozdzia 14. Bloki tekstu
221
Tytuy ......................................................................................................221
Pozioma linia rozdzielajca.....................................................................222
Blok pierwotnie formatowany.................................................................225
Blok cytowany.........................................................................................225
Adres .......................................................................................................226
Justyfikacja obiektw..............................................................................226
Komentarz ...............................................................................................227
Blok .........................................................................................................227
Obramowanie ..........................................................................................228
Rozdzia 15. Odnoniki
229
Odnoniki... .............................................................................................231
...do adresw sieciowych................................................................................. 232
...do innych dokumentw ................................................................................ 233
...do plikw na serwerach FTP ........................................................................ 233
...do plikw na dysku lokalnym....................................................................... 234
...do adresw e-mail......................................................................................... 234
...do grup dyskusyjnych................................................................................... 236
...do innych usug internetowych..................................................................... 236

Cel ...........................................................................................................237
Etykiety ...................................................................................................237
Mapy odsyaczy.......................................................................................239
Rozdzia 16. Listy
241
Lista nieuporzdkowana..........................................................................242
Lista uporzdkowana...............................................................................244
Lista definicji...........................................................................................245
8

Po prostu Internet

Rozdzia 17. Media


247
Wprowadzenie do grafiki ........................................................................248
Grafika w dokumentach HTML ..............................................................251
Animacja Marquee ..................................................................................256
Dwik i wideo........................................................................................257
Macromedia Flash ...................................................................................261
Rozdzia 18. Tabele
263
Wprowadzenie do tabel ...........................................................................264
Obramowanie i marginesy ......................................................................266
Wymiary tabeli........................................................................................267
Wyrwnanie tekstu..................................................................................268
Kolory .....................................................................................................270
Tytu tabeli ..............................................................................................270
Nagwki .................................................................................................271
czenie komrek ...................................................................................272
Teoretyczny podzia tabeli ......................................................................274

Rozdzia 20. Ramki


279
Znacznik <FRAMESET>........................................................................280
Znaczniki <FRAME>..............................................................................281
Znacznik <NOFRAMES>.......................................................................282
czenie ramek .......................................................................................283
Adresowanie ramek.................................................................................283
Cz III FTP

285

Rozdzia 21. Protok FTP

287

Rozdzia 22. WS_FTP LE

289

Rozdzia 23. Przykadowa sesja FTP

291

Dodatki

301

Dodatek A

Kolory na stronach WWW

303

Dodatek B

Lista domen

307
9

Spis treci

Rozdzia 19. Zagniedanie dokumentw HTML


275
Adresowanie pywajcych ramek............................................................277

Spis treci

Gdzie mam zaoy konto?


311
Hoga ........................................................................................................312
Onet.pl .....................................................................................................312
Poland.com..............................................................................................313
Wirtualna Polska .....................................................................................313
Inne......................................................................................................313
Rywalizacja na zachodzie .......................................................................314

Dodatek D

WAP co to takiego?

Dodatek E

Pobieranie plikw z Internetu


317
GetRight ..................................................................................................318
Net Vampire ............................................................................................321
Teleport Pro.............................................................................................323

Dodatek F

Kompresja plikw

327

Dodatek G

Emotikony

331

Skorowidz

333

Spis treci

Dodatek C

10

315

HTML dla bardzo, bardzo niecierpliwych

179

HTML dla bardzo, bardzo niecierpliwych

Rozdzia ten jest przeznaczony dla osb, ktre


chc si nauczy tworzy bardzo proste strony
internetowe, wykorzystujc minimum rodkw
i nakadw czasowych. Musz jednak przestrzec,
e, czytajc ten rozdzia, nie poznasz nawet
podstaw jzyka HTML, a jedynie kompletne
minimum wiedzy niezbdnej do tworzenia
najprostszego dokumentu hipertekstowego
(najprostszej strony internetowej). Jeeli mimo
wszystko planujesz powici wicej czasu na
nauk, zachcam Ci do przeczytania take tego
rozdziau w nastpnych prawie wszystkie
kwestie bd omwione ponownie (dokadniej
i bardziej obrazowo), ale mog te zdarzy si
odwoania do treci tutaj zawartej.

Rozdzia 11.

Znaczniki HTML

Znaczniki HTML

Znacznik jzyka HTML to specjalny cig


znakw (najczciej wyraz z jzyka angielskiego
lub literowy skrt go oznaczajcy), ujty
w nawiasy ostre (zwane niekiedy nawiasami
trjktnymi):  to jest nawias otwierajcy,
 to za nawias zamykajcy. Brak nawiasu
otwierajcego bd zamykajcego moe
(ale niekoniecznie musi) spowodowa
zignorowanie danego znacznika przez
przegldark internetow i w efekcie
bdy w sposobie wywietlania strony.
W wikszoci przypadkw znaczniki grupuje
si w pary, przy czym znacznik otwierajcy
piszemy bez zmian (), a nazw znacznika
zamykajcego poprzedzamy znakiem 
(). Zdarzaj si take znaczniki
jednokrotne nieposiadajce znacznika
zamykajcego (na przykad: 
). Ponadto
kady z nich moe (ale nie musi) posiada
jeden lub wicej atrybutw, ktre przyjmuj
rne wartoci, wpywajc odpowiednio
na zastosowanie danego znacznika na stronie
(na przykad:    
lub 
  ). Wartoci
atrybutw piszemy zawsze w nawiasach.
(Rysunek 11.1)
Nie jest wane, czy znaczniki piszemy duymi
czy maymi literami, w obu przypadkach s
interpretowane w ten sam sposb. (Rysunek 11.2)

180

Rysunek 11.1. Przykadowe znaczniki jzyka


HTML

Rysunek 11.2. Wielko liter w nazwach


znacznikw HTML nie ma wikszego znaczenia

HTML dla bardzo, bardzo niecierpliwych

Szkielet dokumentu

Rysunek 11.3. Uycie dwch podstawowych


znacznikw jzyka HTML ju klasyfikuje dokument
jako stron WWW...

Kady plik jzyka HTML musi zaczyna si


znacznikiem otwierajcym ! , a koczy
zamykajcym ! . Informacje poza
tymi dwoma znacznikami s ignorowane.
W nastpnych rozdziaach pokaemy, e nie jest
to do koca prawd, ale obecnie nie bdziemy
si tym zajmowa. (Rysunki 11.3 11.6)
Kada strona internetowa powinna skada si
ze specjalnie ustalonego szkieletu, w ktrym
mona wyrni dwie gwne czci: gow
(lub inaczej nagwek head) oraz
ciao (body), ktre powinny wystpowa
w niezmiennej konstrukcji. (Rysunek 11.7)

Rysunek 11.4. ...co mona sprawdzi w przegldarce Niektrzy uwaaj (i niektre edytory HTML
na to pozwalaj), e pomidzy !"# a $#%
internetowej

Szkielet dokumentu

Rysunek 11.5. Brak tych znacznikw powoduje


traktowanie zawartoci jako dokumentu tekstowego...

mona wprowadza jakie dodatkowe


informacje, ale zgodnie ze standardem nic
nie powinno si tam znajdowa, tak by
wyranie odrni informacje sterujce
(zawarte w gowie) od waciwej treci
strony (zawartej w ciele). (Rysunek 11.8)

Rysunek 11.6. ...co rwnie mona od razu


sprawdzi w przegldarce

Rysunek 11.7. Podstawowy szkielet kadego


dokumentu typu HTML

Rysunek 11.8. Zgodnie z zasadami tak robi


nie wolno...

181

Rozdzia 11.

Dodatkowe informacje dla przegldarki

Dodatkowe informacje
dla przegldarki
W czci nagwkowej warto doda kilka
informacji. Midzy innymi tytu naszej strony
internetowej. Dodajemy go, umieszczajc par
znacznikw   oraz  . Cay tekst
znajdujcy si pomidzy nimi bdzie
traktowany jako tytu strony internetowej
i najczciej wywietlany w pasku tytuowym
gwnego okna przegldarki. Jeeli ominiesz te
znaczniki, to w miejscu tytuu znajdzie si adres
pliku, ktrego tre jest obecnie wywietlona.
Pamitaj, e tytu nie ukae si w treci strony,
lecz jedynie na pasku tytuowym okna
przegldarki. Porwnaj rysunki 11.9 i 11.10.
Drugim (jeszcze waniejszym) elementem
sekcji nagwkowej jest informacja dla
przegldarki, w jakiej stronie kodowej zapisane
s znaki narodowej w danej stronie internetowej.
Jak powiedziaem w rozdziale 6., jedynym
poprawnym standardem kodowania polskich
liter jest ISO Latin 2 (oznaczenie kodowe
ISO-8859-2). Aby przykaza przegldarce
informacj o tym, e polskie litery s zapisane
wanie w tym standardzie, naley w czci
nagwkowej wstawi nastpujcy cig
znacznikw: (Rysunek 11.11)
 " !&'()*+,,'-.
/012 +344'556'7

Naley te zwrci uwag na to, czy strony


rzeczywicie s zapisywane w takim standardzie
(wikszo edytorw HTML nie ma z tym
adnych problemw), gdy samo dodanie tej
definicji nie spowoduje automatycznej
konwersji pliku i w przypadku innego ni
zdefiniowany kodowania polskich znakw,
bd one wywietlane nieprawidowo.

182

Rysunek 11.9. Znacznik powodujcy nadanie


stronie internetowej tytuu...

Rysunek 11.10. ...ktry jest najczciej


wywietlany na pasku tytuowym przegldarki

Rysunek 11.11. Bardzo wany znacznik (element


sekcji HEAD), ktrego nadanie jest niezbdne,
by polskie znaki na stronie internetowej byy
wywietlane w sposb prawidowy

HTML dla bardzo, bardzo niecierpliwych

Rysunek 11.12. Bez wzgldu na uyty sposb


zapisu ta przykadowa strona bdzie miaa czarny
kolor ta

Znacznik $#% ma kilka atrybutw


(dodatkowych informacji dla przegldarki),
ktre mog przyjmowa okrelone wartoci.
I tak, aby zmieni kolor ta na edytowanej
stronie (jeeli tego nie dokonasz, zostanie
przyjty kolor domylny przegldarki, zwykle
szary), naley, zamiast pustego znacznika
$#%, uy go wraz z atrybutem $
 
(background color kolor ta) i odpowiedni
dla tego znacznika wartoci, czyli wpisa:
$#% $
 13

Podstawowe kolory moliwe do stosowania


w przegldarkach (definiowane przez podanie
ich nazwy) to: black, silver, gray, white,
maroon, red, purple, fuchsia, green, lime, olive,
yellow, navy, blue, teal oraz aqua. Tabel
wszystkich kolorw dostpnych w jzyku
HTML oraz odpowiadajcych im wartoci
szesnastkowych znajdziesz na kocu ksiki
w dodatkach.

183

Dodatkowe informacje dla przegldarki

Jako warto atrybutu $


  mona uy albo
angielskiej nazwy koloru (gray, blue, yellow,
red itd.), albo wartoci liczbowej koloru
zapisanej w systemie szesnastkowym. W tym
przypadku podaje si wartoci kadej z trzech
barw podstawowych: czerwonej, zielonej i
niebieskiej (red, green i blue), ktre mog by
w zakresie od 0 (00 szesnastkowo) do 255
(FF szesnastkowo). Na przykad kolor czarny
mona zdefiniowa, podajc wartoci atrybutu
$
  jako black (nazwa) lub #000000
(szesnastkowo), za kolor biay jako white
lub #FFFFFF. Pamitaj, eby na w swoich
stronach zawsze wybiera tylko jedn form
zapisu koloru (albo nazw, albo szesnastkowo),
gdy uycie obu rwnoczenie jest bdem.
(Rysunek 11.12)

Rozdzia 11.

Tytuy
Tytuy (przez niektrych bdnie nazywane
nagwkami) to partie tekstu wyrniajce
si na stronie rozmiarem oraz sposobem
formatowania czcionki uytej do ich wypisania.
W jzyku HTML masz do dyspozycji sze
poziomw takich tytuw, przy czym poziom
pierwszy jest poziomem najwyszym (tekst
tytuu jest wypisywany czcionk o najwikszym
rozmiarze), a poziom szsty jest poziomem
najniszym (tekst tytuu jest wypisywany
czcionk o najmniejszym rozmiarze, przy czym
i tak z reguy jest ona wiksza ni domylna
czcionka uyta do zapisania treci strony).
Tytuy wraz z numerem poziomu definiujemy,
ujmujc tekst, ktry ma stanowi tre tytuu,
w par znacznikw w postaci !,4!,,
gdzie , to stopie (poziom) tytuu. Zmienna ta
moe przyjmowa wartoci od 1 do 6.
(Rysunki 11.13, 11.14)

Rysunek 11.13. Do dyspozycji masz sze


poziomw tytuw...

Tytuy

Rysunek 11.14. ...ktre rni si do znacznie


w przegldarce

184

HTML dla bardzo, bardzo niecierpliwych

Rozdzielanie linii i akapitw

Rysunek 11.15. Przykad zastosowania


znacznika <BR>

W domyle przegldarka, podczas interpretacji


kodu HTML, ignoruje wszelkie znaki przejcia
do nowej linii. Ma to na celu umoliwienie
projektantowi uzyskania czytelnego kodu,
umieszczajc jego fragmenty w osobnych
liniach. Co zrobi jednak, by zmusi przegldark
do rozpoczcia nowej linii tekstu? Trzeba
zama (break) tekst w danym miejscu,
przy uyciu znacznika <BR>. Stosuje si go
dokadnie tam, gdzie ma nastpi zamanie,
bez wzgldu na to, czy jest to pocztek, koniec
czy rodek zdania. (Rysunki 11.15, 11.16)

Rysunek 11.16. Jego dziaanie moe si wydawa


chaotyczne na pierwszy rzut oka, ale po dogbnej
analizie kodu, ktry daje taki efekt, wszystko
okazuje si by jasne

Przy uyciu pary znacznikw & oraz &


moesz obj fragment tekstu, traktowany
jako osobny akapit. Pomidzy akapitami
(parami powyszych znacznikw)
przegldarka automatycznie dodaje jedn
pust lini rozdzielajc (jak ma to miejsce
w wikszoci amerykaskich wypracowa. :)
(Rysunki 11.17, 11.18)

Rysunek 11.17. Wykorzystanie znacznikw <P>


oraz </P> do dzielenia tekstu na osobne akapity...

Rysunek 11.18. ...i efekt w przegldarce

185

Rozdzielanie linii i akapitw

Moesz zastosowa kilka nastpujcych


po sobie znacznikw $ nie tylko po to, by
zama tekst, ale take, by wizualnie wydzieli
(pionowo) pewne partie tekstu.

Rozdzia 11.

Linie poziome
Aby wydzieli fragment tekstu poziom
lini, naley zastosowa znacznik !.
(Rysunki 11.19, 11.20)
Rysunek 11.19. Uycie znacznika <HR>
do rozdzielenia waniejszych partii materiau

Linie poziome

Rysunek 11.20. Efekt uycia w przegldarce

186

HTML dla bardzo, bardzo niecierpliwych

Numerowanie
i wypunktowanie

Rysunek 11.21. Sposb otwierania i zamykania


listy nienumerowanej (wypunktowanej)

Numerowanie i wypunktowanie

Rysunek 11.22. Zamykanie znacznika <LI>


nie jest wymagane, ale zgodnie ze standardem
powiniene to robi

Czasami konieczne jest przedstawienie kilku


linii tekstu w formie listy numerowanej lub
punktowanej. W pierwszym przypadku naley
skorzysta z pary znacznikw )  oraz ) 
(unordered list lista nieporzdkowa).
W drugim przypadku naley uy pary
znacznikw   i   (ordered list lista
porzdkowa). W obrbie tych dwch par
znacznikw dodajesz nowe pozycje za pomoc
znacznika  , ktrego dziaanie jest prawidowe
nawet wtedy, gdy go nie zamkniesz, ale dla
porzdku naley jednak zamyka. Przykad listy
wypunktowanej wida na rysunku 11.23.
Za numerowanej, na rysunku 11.25.

Rysunek 11.23. liczna lista punktowana


w przegldarce

Rysunek 11.24. Zmiany, jakie naley wprowadzi


w kodzie HTML, aby przeksztaci list
wypunktowan w numerowan

Rysunek 11.25. Efekt wprowadzonych zmian


w przegldarce

187

Rozdzia 11.

R"ne formatowanie tekstu


Spord wielu moliwych formatowa, jakie
mona nada tekstowi, omwimy kilka
najwaniejszych. Ich uycie polega na
standardowym objciu fragmentu tekstu,
ktremu ma zosta nadane konkretne
formatowanie, par znacznikw: otwierajcym
i zamykajcym.

Rysunek 11.26. Sposb uycia podstawowych


znacznikw formatujcych tekst...

R ne formatowanie tekstu

Aby pogrubi fragment tekstu, obejmij go


znacznikami $ oraz $ (bold pogrubienie)
Podobnie ma si sprawa w przypadku
podkrelania tekstu (wtedy stosujesz znaczniki
) i ) underline) oraz wypisania go kursyw
(italic):  oraz . (Rysunki 11.26, 11.27)
Aby zdefiniowa justyfikacj tekstu (rozoenie
tekstu wzgldem lewego i prawego marginesu
strony), musisz skorzysta ze znanego ju
znacznika & i nada odpowiedni warto
jego atrybutowi " 
. Obejmij fragment tekstu
znacznikami & " 
3 oraz &,
by wymusi jego wyrwnanie do prawego
marginesu strony. Analogicznie uyj
& " 
+,3, by wypisa tekst centralnie
(na rodku) wzgldem obu marginesw oraz
& " 
1 , by wymusi wyrwnanie
tekstu do lewego marginesu strony. Jak
zapewne domylasz si, aby wypisa tekst
danego akapitu przy lewym marginesie,
wystarczy uy pary znacznikw & oraz &
bez adnego dodatkowego atrybutu.

Rysunek 11.27. ...oraz efekt ich dziaania


zaprezentowany w przegldarce Internet Explorer

Rysunek 11.28. Zastosowanie znacznikw


wyrwnujcych w kodzie HTML...

Moesz uy znacznika otwierajcego  


na pocztku danego fragmentu tekstu oraz
znacznika zamykajcego   na kocu
tego fragmentu, co ma identyczne dziaanie
jak & " 
+,3. Nie moesz niestety
stosowa znacznikw 
! i  .
(Rysunki 11.28, 11.29)

Rysunek 11.29. ...oraz efekt ich dziaania


w przegldarce

188

HTML dla bardzo, bardzo niecierpliwych


Sprawa si troch (ale tylko odrobin)
komplikuje, jeeli chcesz zmieni rozmiar
czcionki, jej kolor lub nazw (krj). W tym
celu trzeba zastosowa par znacznikw 
i  wraz z odpowiednimi atrybutami
i ich wartociami.

Rysunek 11.30. Znacznik <FONT> (w odrnieniu


od znacznikw tytuw <Hn>) umoliwia zmian
rozmiaru czcionki wewntrz danej linii tekstu

Rysunek 11.32. Zmiana koloru jest dziecinnie


prosta...

W podobny sposb zmienia si kolor czcionki,


nadajc odpowiedni warto (dokadnie
na tej samej zasadzie, jak miao to miejsce
w przypadku zmiany koloru ta strony)
atrybutowi  . Aby tego dokona, wpisz
  13, nastpnie fragment
tekstu, ktrego kolor chcesz zmieni, a cao
zakocz znacznikiem zamykajcym .
(Rysunki 11.32, 11.33)

Rysunek 11.33. ...i od razu mona obserwowa


efekt zmiany w przegldarce

189

R#ne formatowanie tekstu

Rysunek 11.31. A tu sposb jego uycia

Aby zmieni rozmiar czcionki, wpisz znacznik


otwierajcy w postaci  14+,
gdzie zmienna 14+ moe przyjmowa
wartoci w zakresie od 1 do 7 i nie naley
myli tego z tzw. punktami typograficznymi
stosowanymi na przykad w programie
Microsoft Word. Domylna czcionka
o rozmiarze 3 ( 8) odpowiada
rozmiarowi 10 (czasem 12) punktw
typograficznych. Naley te zwrci uwag,
e w tym przypadku numeracja postpuje
w odwrotnym kierunku, ni miao to miejsce
w przypadku tytuw. Tutaj czcionka
o rozmiarze 1 jest czcionk najmniejsz,
a czcionka o rozmiarze 7, najwiksz. Ponadto
zastosowanie ktrego ze znacznikw tytuu
(na przykad !9) nadaje dane sformatowanie
caej linijce oraz przenosi tekst do nowej linijki
nie mona uy tego sposobu, chcc zmieni
rozmiar czcionki wewntrz zdania bd linijki.
(Rysunki 11.30, 11.31)

Rozdzia 11.
Aby zmieni nazw czcionki (a tym samym
jej krj wygld), musisz odpowiednio
zmodyfikowa warto atrybutu " . Uwaaj
jednak! Nie wszystkie czcionki z Twojego
systemu bd dostpne rwnie w Internecie
dla przegldajcych stron. Najlepiej stosowa
najpopularniejsze nazwy (oprcz standardowej):
Arial, Courier, Tahoma lub Verdana. Aby
zmieni krj czcionki, obejmij dany fragment
tekstu znacznikiem otwierajcym 
" ,:, a zamknij znacznikiem
zamykajcym . (Rysunki 11.34, 11.35)

R ne formatowanie tekstu

Oczywicie atrybuty znacznika  (innych


take) moesz miesza i uywa kilku lub
wszystkich na raz wtedy naley kady z nich
oddzieli znakiem spacji, na przykad wpisujc
   .
Podsumowujc fragment o formatowaniu tekstu,
warto wspomnie o dwch sprawach. Wszelkie
omwione do tej pory znaczniki formatowania
(jak i wikszo pozostaych znacznikw
parowych) maj zastosowanie od znacznika
otwierajcego, a do miejsca wystpienia
znacznika zamykajcego, bez wzgldu na to,
czy wewntrz tekstu stosujesz takie znaczniki
jak amanie tekstu ($) czy wstawianie
poziomej linii (!). Ponadto przegldarka
powinna je rwnie zinterpretowa prawidowo,
gdy przekrocz granice akapitw, ale, zgodnie
z zasadami, wszelkie znaczniki otwarte
wewntrz nowego akapitu (po znaczniku &)
powinno si zamyka przed zakoczeniem
tego akapitu (przed znacznikiem &).
Ponadto pamitaj o tym, e obowizujcym
obecnie standardem jest standard HTML 4.0,
ktry wprowadza bardzo szerokie zastosowanie
Kaskadowych arkuszy stylw (Cascade Style
Sheets CSS) wanie miedzy innymi
do formatowania tekstu. Moe to si wyda
dziwne, ale wikszo z omwionych do tej
pory znacznikw ju nie obowizuje i jeeli
chcesz by rasowym webmasterem, musisz
nauczy si formatowa tekst przy uyciu CSS.
Informacje na ten temat znajdziesz w ksice
Po prostu Internet. Techniki zaawansowane,
mojego autorstwa, ktra ju niebawem ukae si
nakadem wydawnictwa Helion.

190

Rysunek 11.34. Rne przykady uycia atrybutu


FACE znacznika <FONT>

Rysunek 11.35. Uwaaj! Zastosowanie zbyt


duego wachlarza czcionek moe spowodowa
bdy w wywietlaniu strony i zniechci do niej
odwiedzajcych

HTML dla bardzo, bardzo niecierpliwych

Odno%niki

Rysunek 11.36. Sposb dodawania odnonikw


do innych obiektw (stron, adresw, plikw)

Rysunek 11.37. Uytkownik po najechaniu


wskanikiem myszy na utworzony odnonik bdzie
mg odczyta adres, na jaki masz zamiar go
wysa

Popularnie nazywane te linkami lub


odsyaczami, su do powizania kilku stron
(kilku dokumentw) w funkcjonaln cao.
Dziki nim odwiedzajcy Twoj stron moe
(klikajc odpowiednio wyrniony fragment
tekstu) przenie si do innego dokumentu,
ktry znajduje si w zasobach Twojej wasnej
strony internetowej (wtedy mamy do czynienia
z odnonikiem lokalnym, nazywanym rwnie
adresem wzgldnym) lub na innym serwerze
(znajdujcym si moe tysice kilometrw
dalej) wtedy mamy do czynienia z adresem
absolutnym lub bezwzgldnym. Wicej na ten
temat znajdziesz w rozdziale 8.
Utworzenie odnonika jest w sumie bardzo
proste i polega na dodaniu jednej pary
znacznikw oraz zmodyfikowaniu jednego
atrybutu znacznika otwierajcego. Oglnie
wyglda to tak:

Rysunek 11.38. Przykad zdefiniowania odnonika


do konkretnego pliku

Rysunek 11.39. Dodanie odnonika, po klikniciu


ktrego bdzie mona wysa list e-mail na podany
adres

Warto atrybutu ! moe by albo adresem


do strony (patrz rysunek 11.36), albo
odnonikiem do jakiego lokalnego pliku,
znajdujcego si w zasobach Twojej strony
internetowej. (Rysunki 11.37, 11.38)
Dosy wanym odnonikiem jest rwnie ten,
ktry, zamiast otworzy okrelon stron
internetow, umoliwia wysanie do autora
strony listu e-mail. Suy do tego protok
mailto:, a znacznik konstruuje si tak jak
poprzednio, tylko tym razem poprzedzajc
adres wanie wyraeniem mailto:, a sam adres
podajc w postaci adresu e-mail (przykad
takiego znacznika znajduje si na rysunku 11.39).

191

Odno&niki

" !;34<43,-<,3,=4
0=>+- -? ;,@,0"

Rozdzia 11.

Grafika

Grafika

Przestrzegaj podstawowej zasady, e choby


nie wiem jak pikne byo logo firmy i zdjcia
biurowca, jakimi dysponujesz, powanie
zastanw si nad ich umieszczeniem na stronie
internetowej. Grafika na stronach WWW ma to
do siebie, e nawet najmniejsze obrazki potrafi
mie taki rozmiar jak kilka stron tekstowych,
a co za tym idzie, ich zaadowanie na komputerze
klienta moe trwa wystarczajco dugo, by go
to znudzio i przeszed na stron konkurencji,
zbudowan w o wiele lepszy sposb i odczytywan
nieporwnywalnie szybciej ni Twoja. Jest to ta
sama kwestia, ktr poruszyem w rozdziale 10.
za le skonstruowan stron (na ktrej jest na
przykad stanowczo zbyt duo grafiki) zapacisz
tylko Ty, nisk lub zerow ogldalnoci.
Aby wstawi grafik na stron internetow,
naley skorzysta ze znacznika 
 (image
obraz; jest to znacznik jednokrotny, nie
posiada znacznika zamykajcego) oraz jego
atrybutu  (source rdo). A wic:

 ,:<.1A

Jeeli plik nie znajduje si w tym samym


katalogu, co wywoujca go strona, naley
doda jeszcze ciek dostpu (wedug zasad
omwionych w rozdziale 8.). W przypadku
gdy i grafika, i wywoujca j strona zostay
umieszczone na serwerze w tym samym
katalogu, wystarczy poda sam nazw pliku.
(Rysunki 11.40, 11.41)
Powiniene wykorzystywa wycznie
grafik w formacie GIF (*.gif) lub JPEG
(*.jpg, *.jpeg, *.jpe).

192

Rysunek 11.40. Grafik mona umieszcza


bezporednio w tym samym katalogu, co pliki
strony internetowej lub odpowiednio posortowan
(wtedy naley doda ciek dostpu do pliku,
ktry chcemy pokaza)

Rysunek 11.41. Czasami twrcy do tego stopnia


przesadzaj z grafik, e nawet wywietlenie strony
na penym ekranie nie pokazuje caoci
wystrzegaj si takich sytuacji jak ognia!

HTML dla bardzo, bardzo niecierpliwych

Zako'czenie
Oto wszystkie najbardziej podstawowe informacje
na temat tworzenia wasnej (najprostszej!) strony
internetowej. Jeeli chcesz dowiedzie si wicej,
powiniene zajrze do nastpnych rozdziaw,
gdzie kade z poruszonych tu zagadnie zostao
omwione w sposb szczegowy.

Rysunek 11.42. Serwis WebHelp doskonaa


baza informacji dla pocztkujcych twrcw stron
internetowych

Nie masz czasu? Wic pozostaje Ci tylko


Internet. W nim znajdziesz bardzo duo dobrych
poradnikw dla pocztkujcych webmasterw,
a wrd dobrych podrcznikw kilka pereek.
Ja osobicie polecam doskonay kurs jzyka
HTML Pawa Wimmera oraz serwis WebHelp,
ktry udziela porad nie tylko w tematyce HTML,
ale take na temat JavaScript, ASP, PHP
i w wielu, wielu innych. (Rysunki 11.42, 11.43)

Zako(czenie

Rysunek 11.43. Kurs Pawa Wimmera najlepszy


znany mi przewodnik na temat jzyka HTML

193

You might also like