HTML, XHTML i CSS.
Biblia. Wydanie IV

Autor: Steven M. Schafer
T³umaczenie: Piotr Rajca, Tomasz Walczak
ISBN: 978-83-246-2023-4
Tytu³ orygina³u:

HTML, XHTML, and CSS Bible, 4th Edition

Format: 172

×245, stron: 728

Kompendium wiedzy na temat projektowania nowoczesnych stron WWW!

• Jak wykorzystaæ potencja³ jêzyka HTML?
• Jak tworzyæ kod zgodny ze standardami W3C?
• Jak przygotowaæ witrynê dla urz¹dzeñ przenoœnych?

Jêzyk HTML wraz z odpowiednimi arkuszami stylów odpowiada za sposób prezentacji
danych w przegl¹darce internetowej. Je¿eli chcesz tworzyæ profesjonalne witryny WWW,
musisz dok³adnie poznaæ przeznaczenie poszczególnych znaczników tego jêzyka. A jest
nad czym pracowaæ! Ju¿ sama mnogoœæ elementów HTML oraz atrybuty dla ka¿dego
z nich to spora dawka wiedzy... A jeszcze musisz poznaæ kaskadowe arkusze stylów…

W ksi¹¿ce „HTML, XHTML i CSS. Biblia. Wydanie IV” znajdziesz wszystkie niezbêdne
informacje, dziêki którym stworzysz profesjonaln¹, zgodn¹ ze standardami witrynê WWW.
Autorzy omawiaj¹ tu tak istotne kwestie, jak jednostki miary wykorzystywane
w projektowaniu stron, formatowanie tekstów, prezentacja danych tabelarycznych
i wszystkie inne problemy, które spotkasz w swojej codziennej pracy. Ponadto w trakcie
lektury nauczysz siê projektowaæ formularze oraz osadzaæ elementy multimedialne.
Najnowsze wydanie tej cenionej ksi¹¿ki poszerzone zosta³o o takie tematy, jak
wykorzystanie mikroformatów, przygotowanie stron dla urz¹dzeñ przenoœnych oraz
obs³uga modelu DOM. Podrêcznik ten stanowi niezast¹pione Ÿród³o wiedzy na temat
HTML, XHTML oraz CSS. Jego zawartoœæ z pewnoœci¹ doceni ka¿dy profesjonalista,
a osoby pocz¹tkuj¹ce w jednym miejscu znajd¹ odpowiedŸ na wszystkie pytania.

• Zasady rz¹dz¹ce jêzykiem znaczników
• Struktura dokumentu HTML
• Rodzaje elementów na stronie
• Formatowanie tekstów
• Wykorzystanie list punktowanych i numerowanych
• Prezentacja danych tabelarycznych
• Zastosowanie ramek
• Przygotowanie plików graficznych dla stron WWW
• Osadzanie obiektów multimedialnych na witrynie WWW
• Sposoby kodowania znaków narodowych
• Wykorzystanie jêzyka Javascript - operacje na modelu DOM
• Zastosowanie mikroformatów
• Tworzenie stron dla urz¹dzeñ przenoœnych
• Kontrola strony pod k¹tem zgodnoœci ze standardami
• Definiowanie sposobu prezentacji za pomoc¹ arkuszy CSS
• Okreœlanie arkuszy dla ró¿nych mediów
• Narzêdzia wspomagaj¹ce pracê z HTML

Twórz i publikuj w sieci Internet strony zgodne ze standardami W3C – to wa¿ne!

Spis treci

O autorze ......................................................................................................... 19

Wprowadzenie ................................................................................................. 21

Cz I Tworzenie treci z wykorzystaniem jzyka HTML ........... 29

Rozdzia 1. Czym jest jzyk znaczników? ........................................................ 31

Co tu robimy? .....................................................................................................................................31
Przedstawienie hipertekstu ..................................................................................................................32
Przedstawienie instrukcji znacznikowych ...........................................................................................33
Przedstawienie jzyka znaczników .....................................................................................................34
Podsumowanie ....................................................................................................................................36

Rozdzia 2. Wartoci i jednostki w HTML-u ...................................................... 37

Podstawowa posta zapisu atrybutów .................................................................................................37
Wspólne atrybuty ................................................................................................................................40

Identyfikacja znaczników — identyfikatory i klasy ......................................................................40

Teksty i komentarze ............................................................................................................................41

Komentarze ...................................................................................................................................42
Sekcje CDATA .............................................................................................................................42

Jednolite identyfikatory zasobów ........................................................................................................43
Opcje jzyka i ustawienia midzynarodowe .......................................................................................44

Kod jzyka ....................................................................................................................................44
Kierunek tekstu .............................................................................................................................44

Podsumowanie ....................................................................................................................................44

Rozdzia 3. Co jest umieszczane w dokumentach HTML? ................................ 45

Okrelanie typu dokumentu ................................................................................................................46
Ogólna struktura dokumentu: HTML, nagówek i tre ......................................................................46

Znacznik <html> ...........................................................................................................................47
Znacznik <head> ..........................................................................................................................47
Znacznik <body> ..........................................................................................................................48

Definicje stylów ..................................................................................................................................49
Elementy blokowe: oznaczenia definiujce akapity oraz inne bloki treci ..........................................49

Sformatowane akapity ..................................................................................................................50
Nagówki ......................................................................................................................................51
Cytaty ...........................................................................................................................................52

8

HTML, XHTML i CSS. Biblia

Elementy list .................................................................................................................................52
Tekst preformatowany ..................................................................................................................54
Sekcje strony .................................................................................................................................55

Elementy wewntrzwierszowe: oznaczenia znaków ...........................................................................57

Podstawowe znaczniki wewntrzwierszowe .................................................................................57
Fragmenty tekstu ..........................................................................................................................59
Znaki specjalne (symbole znakowe) .............................................................................................59

Elementy organizacyjne ......................................................................................................................60

Tabele ...........................................................................................................................................60
Formularze ....................................................................................................................................62

cza do innych stron .........................................................................................................................64
Obrazy .................................................................................................................................................65
Komentarze .........................................................................................................................................65
Skrypty ................................................................................................................................................66
Poczenie wszystkich elementów ......................................................................................................67
Podsumowanie ....................................................................................................................................68

Rozdzia 4. Elementy nagówka ........................................................................ 69

Okrelanie tytuu dokumentu ..............................................................................................................69
Podawanie informacji uywanych przez wyszukiwarki ......................................................................70
Okrelanie domylnej cieki ..............................................................................................................71
Stosowanie automatycznego odwieania i przekierowywania ..........................................................72
Sekcje skryptów ..................................................................................................................................73
Sekcje stylów ......................................................................................................................................73
Okrelanie profili ................................................................................................................................74
Kolor i obraz ta ..................................................................................................................................74

Okrelanie koloru ta dokumentu ..................................................................................................75
Okrelanie obrazu ta dokumentu .................................................................................................75

Podsumowanie ....................................................................................................................................76

Rozdzia 5. Podstawy okrelania struktury tekstów ...................................... 77

Formatowanie akapitów ......................................................................................................................77
Podzia wiersza ...................................................................................................................................79
Sekcje ..................................................................................................................................................80
Poziome linie ......................................................................................................................................84
Cytaty blokowe ...................................................................................................................................84
Tekst preformatowany ........................................................................................................................85
Podsumowanie ....................................................................................................................................86

Rozdzia 6. Tekst ............................................................................................... 87

Metody formatowania tekstu ...............................................................................................................87

Znacznik <font> ...........................................................................................................................88
Akcentowanie i inne znaczniki dotyczce tekstu ..........................................................................88
Formatowanie tekstu przy uyciu CSS .........................................................................................88

Pogrubienie i kursywa .........................................................................................................................91
Stosowanie uwypuklenia zamiast kursywy .........................................................................................91
Czcionka o staej szerokoci ...............................................................................................................92
Indeksy — górny i dolny ....................................................................................................................92
Skróty ..................................................................................................................................................92
Oznaczanie zmian w dokumencie — wstawianie i usuwanie tekstu ...................................................93
Grupowanie elementów tekstowych znacznikiem <span> ..................................................................94
Podsumowanie ....................................................................................................................................95

Spis treci

9

Rozdzia 7. Listy ................................................................................................. 97

Omówienie list ....................................................................................................................................97
Listy uporzdkowane (numerowane) ..................................................................................................98
Listy nieuporzdkowane (punktowane) ............................................................................................103
Listy definicji ....................................................................................................................................106
Listy zagniedone ............................................................................................................................108
Podsumowanie ..................................................................................................................................109

Rozdzia 8. cza .............................................................................................. 111

Czym s cza? ..................................................................................................................................112
cza do stron WWW .......................................................................................................................113
cza wzgldne i bezwzgldne .........................................................................................................114
Docelowe okna czy ........................................................................................................................116
Tekst podpowiedzi cza ...................................................................................................................117
Skróty klawiaturowe i kolejno uaktywniania czy .......................................................................118

Skróty klawiaturowe ...................................................................................................................118
Kolejno uaktywniania czy ....................................................................................................119

Tworzenie kotwic ..............................................................................................................................120
Dobór kolorów czy .........................................................................................................................120
Parametry dokumentu docelowego ...................................................................................................122
Znacznik <link> ................................................................................................................................122
Podsumowanie ..................................................................................................................................124

Rozdzia 9. Tabele ........................................................................................... 125

Czci skadowe tabeli HTML ..........................................................................................................125
Szeroko i wyrównanie tabeli ..........................................................................................................127
Odstpy i otaczanie komórek ............................................................................................................130
Obramowanie i krawdzie ................................................................................................................132

Obramowanie tabeli ....................................................................................................................132
Krawdzie tabeli .........................................................................................................................133

Wiersze .............................................................................................................................................134
Komórki ............................................................................................................................................135
Podpis tabeli ......................................................................................................................................137
Grupowanie wierszy — nagówek, tre i stopka tabeli ....................................................................139
Kolor ta ............................................................................................................................................142
Komórki rozcigajce si na kilka wierszy lub kolumn ....................................................................143
Grupowanie kolumn ..........................................................................................................................147
Podsumowanie ..................................................................................................................................148

Rozdzia 10. Ramki ........................................................................................... 149

Omówienie ramek .............................................................................................................................149
Zbiory ramek i zawarto ramek .......................................................................................................150

Tworzenie zbioru ramek .............................................................................................................152
Marginesy, obramowania i paski przewijania ramek ..................................................................154
Modyfikacja rozmiaru ramek ......................................................................................................156

Odsyacze do ramek ..........................................................................................................................156
Zagniedone zbiory ramek ..............................................................................................................160
Ramki pywajce ...............................................................................................................................161
Podsumowanie ..................................................................................................................................163

10

HTML, XHTML i CSS. Biblia

Rozdzia 11. Formularze .................................................................................. 165

Podstawowe informacje o formularzach ...........................................................................................166
Wstawianie formularzy .....................................................................................................................168

Metoda GET ...............................................................................................................................169
Metoda POST .............................................................................................................................169
Dodatkowe atrybuty znacznika <form> ......................................................................................170

Etykiety pól .......................................................................................................................................170
Pola tekstowe ....................................................................................................................................171
Pola hase ..........................................................................................................................................171
Przyciski opcji ...................................................................................................................................171
Pola wyboru ......................................................................................................................................172
Listy wyboru .....................................................................................................................................173
Obszary tekstowe ..............................................................................................................................175
Pola ukryte ........................................................................................................................................176
Przyciski ...........................................................................................................................................177
Rysunki .............................................................................................................................................177
Pola plików .......................................................................................................................................178
Przyciski przesyania danych i czyszczenia pól ................................................................................179
Kolejno uaktywniania kontrolek i skróty klawiaturowe ................................................................180
Uniemoliwienie wprowadzania zmian ............................................................................................180
Grupy pól i ich opis ...........................................................................................................................182
Stosowanie zdarze do obsugi formularzy .......................................................................................184
Skrypty formularzy i usugi skryptowe .............................................................................................186

Pobranie programu obsugi formularza .......................................................................................187
Wykorzystanie usug skryptowych .............................................................................................187

Podsumowanie ..................................................................................................................................188

Rozdzia 12. Kolory i rysunki ........................................................................... 189

Podstawowe informacje o kolorach ..................................................................................................190
Inne sposoby okrelania kolorów ......................................................................................................190
Ewolucja kolorów uywanych na stronach WWW ...........................................................................191
Stosowanie odpowiednich metod okrelania kolorów ......................................................................197
Formaty graficzne stosowane w dokumentach WWW .....................................................................199

Kompresja obrazu .......................................................................................................................199
Opcje kompresji ..........................................................................................................................200
Format GIF .................................................................................................................................201
Format JPEG ...............................................................................................................................201
Format PNG ................................................................................................................................202

Przygotowanie plików graficznych ...................................................................................................202

Najwaniejsze funkcje ................................................................................................................202
Progresywne obrazy JPEG i rysunki GIF z przeplotem ..............................................................203
Wykorzystanie efektu przezroczystoci ......................................................................................204

Wstawianie rysunków .......................................................................................................................206
Rozmieszczanie rysunków ................................................................................................................206
Opis wywietlany w przegldarkach tekstowych ..............................................................................209
Wymiary i skalowanie rysunków ......................................................................................................210
Obramowanie rysunków ...................................................................................................................212
Mapy obrazu .....................................................................................................................................214

Definiowanie mapy obrazu .........................................................................................................214
Definiowanie obszarów aktywnych ............................................................................................215
Poczenie poszczególnych rozwiza .......................................................................................217

Spis treci

11

Animacje ...........................................................................................................................................218
Podsumowanie ..................................................................................................................................218

Rozdzia 13. Obiekty multimedialne ............................................................... 221

Animowane obrazy ...........................................................................................................................222
Formaty animacji i klipów wideo, pluginy oraz odtwarzacze ...........................................................224

Popularne formaty i odtwarzacze ................................................................................................226
Windows Media Player ...............................................................................................................226

Osadzanie multimediów przy uyciu znacznika <object> ................................................................227
Osadzanie odtwarzacza Windows Media Player przy uyciu znacznika <object> ...........................230
Umieszczanie plików dwikowych na stronach WWW ..................................................................234
Tworzenie plików multimedialnych ..................................................................................................234
Podsumowanie zagadnie wykorzystania multimediów na stronach WWW ....................................235
Podsumowanie ..................................................................................................................................235

Rozdzia 14. Znaki specjalne ........................................................................... 237

Kodowanie znaków ...........................................................................................................................237
Znaki specjalne .................................................................................................................................238
Znaki spacji i mylników ..................................................................................................................240
Symbol praw autorskich i znaku towarowego ...................................................................................240
Symbole walut ..................................................................................................................................241
Rzeczywiste znaki cudzysowu .........................................................................................................242
Strzaki ..............................................................................................................................................242
Znaki zawierajce symbole akcentu ..................................................................................................242
Litery alfabetu greckiego i symbole matematyczne ..........................................................................242
Inne uyteczne symbole ....................................................................................................................248
Podsumowanie ..................................................................................................................................250

Rozdzia 15. Projektowanie stron WWW dla obcokrajowców ...................... 251

Projektowanie serwisów wielojzycznych i zasady lokalizacji serwisów .........................................251
Wprowadzenie do projektowania serwisów wielojzycznych ..........................................................253
Tumaczenie strony internetowej ......................................................................................................253
Standard Unicode ..............................................................................................................................254

Basic Latin (podstawowy aciski, U+0000 – U+007F) .............................................................259
Kodowanie polskich znaków diakrytycznych .............................................................................265

Podsumowanie ..................................................................................................................................266

Rozdzia 16. Skrypty ........................................................................................ 269

Skrypty serwerowe i skrypty klienckie .............................................................................................269

Skrypty klienckie ........................................................................................................................269
Skrypty serwerowe .....................................................................................................................270

Okrelanie domylnego jzyka skryptowego ....................................................................................270
Doczanie skryptów .........................................................................................................................271
Wywoywanie zewntrznych skryptów .............................................................................................272
Wywoywanie skryptów za pomoc zdarze ....................................................................................272
Ukrywanie skryptów przed starszymi przegldarkami ......................................................................276
Podsumowanie ..................................................................................................................................277

Rozdzia 17. Dynamiczny HTML ....................................................................... 279

Czemu suy dynamiczny HTML? ...................................................................................................280
Jak dziaa DHTML? ..........................................................................................................................280

12

HTML, XHTML i CSS. Biblia

Obiektowy model dokumentu ...........................................................................................................280

Historia DOM .............................................................................................................................281
Opis obiektowego modelu dokumentu ........................................................................................282
Waciwoci i metody wzów DOM .........................................................................................284
Poruszanie si po drzewie DOM i modyfikacja wzów .............................................................284

Obiektowy model dokumentu jzyka JavaScript ..............................................................................289

Obiekt window ...........................................................................................................................289
Obiekt document .........................................................................................................................291
Obiekt form .................................................................................................................................292
Obiekt location ...........................................................................................................................293
Obiekt history .............................................................................................................................294
Obiekt this ..................................................................................................................................294

Dostp do elementów przy wykorzystaniu ich identyfikatorów .......................................................294
Stosowanie procedur obsugi zdarze ...............................................................................................295
Zagadnienia zgodnoci z rónymi przegldarkami ...........................................................................297

Wykrywanie uywanej przegldarki ...........................................................................................297
Wykrywanie obiektów ................................................................................................................297

Przykady rozwiza DHTML ..........................................................................................................298

Wskanik pooenia strony .........................................................................................................298
Tworzenie efektów podmiany przy wykorzystaniu JavaScriptu .................................................302
Rozwijane menu .........................................................................................................................303

Podsumowanie ..................................................................................................................................305

Cz II Narzdzia oraz inne wersje jzyka HTML ...................... 307

Rozdzia 18. Programy do projektowania stron internetowych ................. 309

Edytory tekstowe ..............................................................................................................................310

Proste edytory tekstowe ..............................................................................................................310
Inteligentne edytory tekstowe .....................................................................................................310
Edytory HTML ...........................................................................................................................311

Edytory HTML pracujce w trybie WYSIWYG ...............................................................................313

NetObjects Fusion ......................................................................................................................313
Dreamweaver firmy Macromedia ...............................................................................................314

Inne narzdzia ...................................................................................................................................315

Programy graficzne .....................................................................................................................316
Flash firmy Adobe ......................................................................................................................318

Podsumowanie ..................................................................................................................................318

Rozdzia 19. Publikacja witryn ........................................................................ 321

Wprowadzenie do FTP ......................................................................................................................321
Programy-klienty FTP ......................................................................................................................322
Popularne programy-klienty FTP ......................................................................................................324
Podstawowe zasady organizacji plików w obrbie witryny WWW ..................................................326
Podsumowanie ..................................................................................................................................327

Rozdzia 20. Wykorzystanie danych przy uyciu mikroformatów ............... 329

Dlaczego mikroformaty? ...................................................................................................................329
Przykadowy mikroformat — hCard .................................................................................................331

Obsuga mikroformatów w przegldarce Firefox .......................................................................333

Kolejny przykad — dane o lokalizacjach geograficznych ...............................................................334
W jaki sposób mona uywa mikroformatów? ...............................................................................335
Podsumowanie ..................................................................................................................................336

Spis treci

13

Rozdzia 21. Wprowadzenie do jzyka XML ................................................... 337

Podstawy jzyka XML ......................................................................................................................338
Skadnia jzyka XML .......................................................................................................................339

Deklaracje XML i DOCTYPE ....................................................................................................340
Elementy .....................................................................................................................................340
Atrybuty ......................................................................................................................................342
Komentarze .................................................................................................................................342
Dane nieprzetwarzane .................................................................................................................343
Stae tekstowe .............................................................................................................................343
Przestrzenie nazw .......................................................................................................................344
Arkusze stylów ...........................................................................................................................345

Definicje typu dokumentu (DTD) .....................................................................................................345

Uycie elementów w definicji typu dokumentu ..........................................................................347
Definiowanie atrybutów w DTD .................................................................................................349
Definiowanie i uycie staych tekstowych w definicji DTD .......................................................350
Uycie danych typu PCDATA i CDATA w definicji typu .........................................................351

Schematy XML .................................................................................................................................351
Uycie schematów ............................................................................................................................352
Zastosowanie dokumentów XML .....................................................................................................354

Przeksztacenia XLST .................................................................................................................355
Edycja kodu XML ......................................................................................................................355
Analiza kodu XML .....................................................................................................................355

Podsumowanie ..................................................................................................................................356

Rozdzia 22. Tworzenie stron dla urzdze przenonych ............................ 357

Ewolucja internetu mobilnego ..........................................................................................................357

Mroczne pocztki internetu mobilnego .......................................................................................358
Organizacja Open Mobile Alliance i nowe standardy .................................................................358
Podsumowanie ............................................................................................................................359

Jzyk XHTML Basic 1.1 ..................................................................................................................359

Deklaracja doctype XHTML Basic 1.1 .......................................................................................359
Elementy jzyka XHTML Basic 1.1 ...........................................................................................360
Zagadnienia wymagajce szczególnej uwagi ..............................................................................361

Narzdzia do tworzenia stron dla urzdze przenonych ..................................................................363
Podsumowanie ..................................................................................................................................364

Rozdzia 23. Porzdkowanie i walidacja dokumentów ................................. 365

Porzdkowanie kodu HTML .............................................................................................................365

HTML Tidy ................................................................................................................................368
Pobieranie narzdzia HTML Tidy ..............................................................................................368
Uruchamianie narzdzia HTML Tidy .........................................................................................368

Sprawdzanie poprawnoci kodu ........................................................................................................371

Okrelanie poprawnego typu dokumentu ....................................................................................371
Narzdzia do weryfikacji poprawnoci kodu ..............................................................................371
Jak weryfikowa dokumenty? .....................................................................................................371

Dodatkowe testy i walidacja .............................................................................................................373

Testowanie kodu w rónych przegldarkach ..............................................................................373
Testowanie w rónych rozdzielczociach ekranu .......................................................................374

Podsumowanie ..................................................................................................................................374

14

HTML, XHTML i CSS. Biblia

Rozdzia 24. Sztuczki i triki w jzyku HTML .................................................... 375

Wstpne wczytywanie rysunków ......................................................................................................375
Kontrolowanie podziau tekstu w komórkach tabeli .........................................................................377
Paski tytuu o zmiennej szerokoci ...................................................................................................378
Symulowanie gazetowego ukadu kolumn ........................................................................................381
Doczanie rozmiaru rysunków w celu przyspieszenia ich wczytywania .........................................383
Zabezpieczenia adresów e-mail ........................................................................................................383
Podsumowanie ..................................................................................................................................385

Cz III Kontrolowanie prezentacji za pomoc CSS .................. 387

Rozdzia 25. Wprowadzenie do kaskadowych arkuszy stylów ..................... 389

Przeznaczenie CSS ............................................................................................................................389
Style i HTML ....................................................................................................................................390
1., 2. i 3. poziom CSS .......................................................................................................................392
Definiowanie stylów .........................................................................................................................393
Kaskada stylów .................................................................................................................................394
Podsumowanie ..................................................................................................................................396

Rozdzia 26. Tworzenie regu stylów ............................................................. 397

Zapis definicji stylów ........................................................................................................................397
Przedstawienie selektorów ................................................................................................................399

Dopasowywanie elementów wedug typu ...................................................................................399
Korzystanie z selektora uniwersalnego .......................................................................................399
Dopasowywanie elementów wedug klasy .................................................................................400
Dopasowywanie elementów przy uyciu identyfikatora .............................................................401
Dopasowywanie elementów, które zawieraj okrelony atrybut ................................................401
Korzystanie z elementów dzieci, potomków oraz elementów przystajcych ..............................402

Omówienie dziedziczenia .................................................................................................................404
Pseudoklasy i ich stosowanie ............................................................................................................404

Definiowanie stylów czy ..........................................................................................................405
Pseudoklasa :first-child ...............................................................................................................406
Pseudoklasa :lang ........................................................................................................................406

Pseudoelementy ................................................................................................................................406

Stosowanie stylów dla pierwszego wiersza tekstu w elemencie .................................................407
Stosowanie stylów dla pierwszej litery elementu ........................................................................408
Definiowanie przed danym tekstem i po nim ..............................................................................409

Wyraenia skrótowe ..........................................................................................................................410
Podsumowanie ..................................................................................................................................412

Rozdzia 27. Wartoci i jednostki w jzyku CSS ............................................. 413

Ogólne zasady podawania wartoci waciwoci ..............................................................................413
Jednostki wartoci waciwoci .........................................................................................................415

Wartoci w postaci sów kluczowych .........................................................................................416
Standardowe jednostki miar ........................................................................................................416
Miary rozdzielczoci ekranu .......................................................................................................417
Miary wzgldne ..........................................................................................................................418
Funkcje zwizane z kolorami i adresami URL ...........................................................................420
Jednostki dwikowe ..................................................................................................................421

Podsumowanie ..................................................................................................................................421

Spis treci

15

Rozdzia 28. Dziedziczenie i kaskadowanie w jzyku CSS ............................. 423

Dziedziczenie ....................................................................................................................................423
Kaskadowanie ...................................................................................................................................425
Specyficzno selektorów .................................................................................................................427
Podsumowanie ..................................................................................................................................428

Rozdzia 29. Waciwoci czcionek ................................................................. 429

Wprowadzenie do czcionek ..............................................................................................................429
Rodzaje czcionek ..............................................................................................................................430
Okrelanie rozmiaru czcionki ...........................................................................................................432
Okrelanie stylu czcionki ..................................................................................................................433
Interlinie ............................................................................................................................................434
Zagniedanie czcionek w dokumencie ............................................................................................434
Podsumowanie ..................................................................................................................................436

Rozdzia 30. Formatowanie tekstu ................................................................ 437

Wyrównywanie tekstu .......................................................................................................................437

Kontrolowanie wyrównania poziomego .....................................................................................438
Kontrolowanie wyrównania pionowego .....................................................................................440

Tworzenie wcicia w tekcie ............................................................................................................442
Kontrolowanie znaków niewidocznych w tekcie .............................................................................443

Obiekty przestawne ....................................................................................................................443
Waciwo white-space .............................................................................................................445

Kontrolowanie odstpów midzy literami i sowami ........................................................................447
Definiowanie wielkich liter ...............................................................................................................448
Dekorowanie tekstu ..........................................................................................................................450
Tekst generowany automatycznie .....................................................................................................451
Definiowanie stylów tabeli ...............................................................................................................451
Kontrolowanie atrybutów tabeli ........................................................................................................452

Obramowanie tabeli ....................................................................................................................453
Odstpy w ramce tabeli ...............................................................................................................454
Pojedyncze obramowanie ...........................................................................................................455
Obramowania wokó pustych komórek ......................................................................................456

Ukad graficzny tabeli .......................................................................................................................457
Wyrównywanie i pozycjonowanie podpisów ....................................................................................457
Podsumowanie ..................................................................................................................................459

Rozdzia 31. Formatowanie list ...................................................................... 461

Ogólne informacje o listach ..............................................................................................................461
CSS — kady element pasuje ...........................................................................................................462
Waciwo list-style-type ................................................................................................................463
Pozycjonowanie markerów ...............................................................................................................464
Punktory rysunkowe .........................................................................................................................464
Podsumowanie ..................................................................................................................................466

Rozdzia 32. Obramowania, odstpy i marginesy ......................................... 467

Omówienie modelu formatowania pojemnika ..................................................................................467
Dodawanie odstpu do elementu .......................................................................................................469
Dodawanie obramowania ..................................................................................................................471

Szeroko obramowania .............................................................................................................471
Styl obramowania .......................................................................................................................472

16

HTML, XHTML i CSS. Biblia

Kolor ramki .................................................................................................................................473
Najwikszy skrót: waciwo border .........................................................................................474
Dodatkowe waciwoci obramowa ..........................................................................................475

Definiowanie marginesów elementu .................................................................................................475
Wykorzystywanie dynamicznego obramowania ...............................................................................476
Podsumowanie ..................................................................................................................................477

Rozdzia 33. Kolory i to .................................................................................. 479

Kolory elementów .............................................................................................................................479

Kolor pierwszoplanowy ..............................................................................................................479
Kolory ta ....................................................................................................................................480

Obrazy ta ..........................................................................................................................................482

Jednoczesne stosowanie koloru i obrazu ta ................................................................................485
Powtarzanie i przewijanie obrazów ta .......................................................................................487
Okrelanie pozycji obrazów ta ...................................................................................................490
Skrótowa waciwo background ..............................................................................................490

Podsumowanie ..................................................................................................................................491

Rozdzia 34. Definiowanie ukadów z uyciem elementów dryfujcych

i pozycjonowania ......................................................................... 493

Omówienie pozycjonowania elementów ...........................................................................................493

Pozycjonowanie statyczne ..........................................................................................................494
Pozycjonowanie wzgldne ..........................................................................................................495
Pozycjonowanie bezwzgldne ....................................................................................................496
Pozycjonowanie stae ..................................................................................................................496

Okrelanie pozycji elementu .............................................................................................................498
Elementy dryfujce do lewej lub prawej strony ................................................................................501
Definiowanie szerokoci i wysokoci elementu ................................................................................502

Dokadne definiowanie rozmiarów .............................................................................................503
Definiowanie rozmiaru maksymalnego oraz minimalnego .........................................................504
Kontrola przepenienia elementu ................................................................................................505

Ukadanie elementów na stosie .........................................................................................................506
Kontrolowanie widocznoci elementu ..............................................................................................511
Podsumowanie ..................................................................................................................................512

Rozdzia 35. Pseudoelementy i wygenerowane treci ................................. 513

Waciwo content ..........................................................................................................................513
Pseudoelementy ................................................................................................................................515

Stosowanie stylów dla pierwszego wiersza tekstu w elemencie .................................................516
Stosowanie stylów dla pierwszej litery elementu ........................................................................517
Pseudoelementy :before i :after ..................................................................................................518

Definiowanie znaków cudzysowu ....................................................................................................519
Automatyczne numerowanie elementów ..........................................................................................520

Obiekt counter ............................................................................................................................520
Zmienianie wartoci obiektu counter ..........................................................................................520
Przykad zastosowania liczników: numery rozdziaów i podrozdziaów ....................................521
Wasne numerowanie list ............................................................................................................523

Podsumowanie ..................................................................................................................................524

Spis treci

17

Rozdzia 36. Dynamiczny HTML i CSS ............................................................... 525

Korzystanie z waciwoci CSS w kodzie JavaScript .......................................................................525
Uyteczne operacje z uyciem CSS ..................................................................................................531

Ukrywanie i wywietlanie tekstu ................................................................................................531
Powikszanie obrazków ..............................................................................................................533
Podmieniane menu ......................................................................................................................535

Podsumowanie ..................................................................................................................................538

Rozdzia 37. Typy mediów i definiowanie stron do druku ........................... 539

Typy mediów obsugiwane przez CSS ..............................................................................................540

Okrelanie typu mediów .............................................................................................................540

Przygotowywanie dokumentu do drukowania ..................................................................................543

Model formatowania pojemnika strony ......................................................................................543
Definiowanie rozmiaru strony ....................................................................................................543
Waciwoci page-break .............................................................................................................546
Waciwo page-break-inside ....................................................................................................549
Zarzdzanie wdowami i sierotami ..............................................................................................549
Przygotowanie dokumentu do drukowania dwustronnego ..........................................................550

Tworzenie dokumentów dla rónych mediów ..................................................................................551

Dokument do prezentacji w internecie ........................................................................................551
Ponowne formatowanie strony ...................................................................................................555

Podsumowanie ..................................................................................................................................556

Cz IV Dodatkowe narzdzia CSS ............................................. 557

Rozdzia 38. Rozmieszczanie elementów strony za pomoc tabel .............. 559

Podstawy formatowania z wykorzystaniem tabel .............................................................................560
Przykady stron dostpnych w internecie ..........................................................................................562
Strony pywajce ...............................................................................................................................563
Niestandardowe poczenie grafiki i tekstu .......................................................................................567
Menu nawigacyjne i bloki dokumentów ...........................................................................................571
Dokumenty wielokolumnowe ...........................................................................................................572
Podsumowanie ..................................................................................................................................573

Rozdzia 39. Style interfejsu uytkownika .................................................... 575

Modyfikacje wygldu wskanika myszy ..........................................................................................575
Kolory interfejsu uytkownika ..........................................................................................................577
Czcionki interfejsu uytkownika .......................................................................................................580
Podsumowanie ..................................................................................................................................581

Rozdzia 40. Testowanie i walidacja kodu CSS ............................................... 583

Sprawdzanie skadni w czasie tworzenia stylów ...............................................................................583
Sowo o formatowaniu ......................................................................................................................584
Walidacja kodu CSS .........................................................................................................................586
Podsumowanie ..................................................................................................................................587

Rozdzia 41. Sztuczki i triki w jzyku CSS ....................................................... 589

Wysunicie .......................................................................................................................................589
Rozszerzajce si przyciski ...............................................................................................................591
Wyrónione cytaty ............................................................................................................................594
Menu w formie zakadek ...................................................................................................................596
Podsumowanie ..................................................................................................................................598

18

HTML, XHTML i CSS. Biblia

Dodatki ....................................................................................... 599

Dodatek A Krótki przegld elementów jzyka HTML .................................... 601

Lista elementów ................................................................................................................................602
Atrybuty zdarze ...............................................................................................................................651

Zdarzenia standardowe ...............................................................................................................651
Inne zdarzenia .............................................................................................................................651

Inne czsto spotykane atrybuty .........................................................................................................652

Atrybuty podstawowe .................................................................................................................652
Atrybuty umidzynarodawiania ..................................................................................................652
Kody czsto uywanych kolorów ...............................................................................................652

Dodatek B Krótki przegld znaków specjalnych jzyka HTML ..................... 657

Dodatek C Krótki przegld waciwoci jzyka CSS ...................................... 667

Lista waciwoci ..............................................................................................................................667

To ..............................................................................................................................................668
Listy ............................................................................................................................................669
Wygenerowane dane ...................................................................................................................671
Czcionki i tekst ...........................................................................................................................672
Kierunek tekstu ...........................................................................................................................676
Bloki ...........................................................................................................................................677
Okrelanie pozycji elementów ....................................................................................................680
Obramowania ..............................................................................................................................683
Tabele .........................................................................................................................................685
Druk ............................................................................................................................................686
Róne ..........................................................................................................................................688

Dodatek D Krótki przegld selektorów jzyka CSS ....................................... 689

Podstawowe selektory elementów ....................................................................................................690
Selektory potomków .........................................................................................................................690
Selektory dzieci .................................................................................................................................690
Selektory pierwszego brata ...............................................................................................................691
Selektory klas ....................................................................................................................................691
Selektory identyfikatorów .................................................................................................................691
Selektory atrybutów ..........................................................................................................................692

Dodatek E Krótki przegld pseudoelementów i pseudoklas ....................... 693

Pseudoelementy ................................................................................................................................694
Pseudoklasy ......................................................................................................................................694

Skorowidz ...................................................................................................... 695

Rozdzia 22.

Tworzenie stron dla
urzdze przenonych

W tym rozdziale:



Ewolucja internetu mobilnego



Jzyk XHTML Basic 1.1



Narzdzia do tworzenia stron dla urzdze przenonych

Jak ju wielokrotnie wspominano, sie WWW i zwizane z ni technologie dojrzay.
Pocztkowo sie ta bya prostym, tekstowym medium, natomiast obecnie suy do przeka-
zywania danych niemal kadego rodzaju. Rozwój ten wspomagaj zmiany w technologiach
HTML i HTTP, na których oparta jest sie WWW.

Nieuniknionym skutkiem ubocznym powstania popularnej technologii przekazywania
danych jest jej szybkie przeniesienie na inne urzdzenia. Dzi do uywania materiaów
i rozwiza sieciowych su nie tylko przegldarki na komputerach PC, ale te telefony
komórkowe, kioski internetowe, a nawet bankomaty. Jednak sprzt tego rodzaju czsto ma
ograniczone zasoby, dlatego nie obsuguje caego jzyka HTML i nie wywietla tych
samych bogatych materiaów, co dostosowane do nich przegldarki na komputerach PC.
Jeli programista zamierza udostpnia dane dla jednego z takich urzdze, musi odpo-
wiednio ograniczy kod.

W tym rozdziale opisano specyfikacj jzyka XHTML Basic, zaprojektowanego z myl
o mniejszych urzdzeniach. Omówiono te wybrane technologie pomocnicze, które umo-
liwiaj przesyanie materiaów do sprztu tego typu.

Ewolucja internetu mobilnego

Twórcy stron WWW dla urzdze przenonych powinni zrozumie ewolucj sprztu tego
typu i jego zwizki z sieci WWW. Historia jest wana, poniewa rodowisko urzdze
przenonych znacznie róni si od mechanizmów zwizanych z tradycyjn sieci WWW.
Moliwoci omawianego sprztu s czsto ograniczone, a midzy poszczególnymi urz-
dzeniami wystpuj due rónice, midzy innymi w zakresie obsugiwanych jzyków, udo-
stpnianych funkcji i sposobu czenia si z internetem (lub braku takiej moliwoci).

358

Cz II  Narzdzia oraz inne wersje jzyka HTML

Nastpne punkty zawieraj krótkie wprowadzenie do tych zagadnie.

Mroczne pocztki internetu mobilnego

Urzdzenia przenone dostosowane do sieci WWW s dostpne ju od dawna. Pod koniec
lat 90. kilka telefonów komórkowych wyposaono w funkcje sieciowe. W Stanach Zjed-
noczonych wsparcie tej technologii zapewni czoowy producent telefonów (Nokia) i firma
obsugujca czno mobiln (Openware). Te dwie organizacje opracoway protokó
cznoci bezprzewodowej — WAP (ang. Wireless Access Protocol). Utworzono te nowy,
ograniczony do minimum jzyk znaczników — WML (ang. Wireless Markup Language).
Protokó WAP uywa specjalnych bram, aby umoliwia urzdzeniom przenonym nawi-
zywanie pocze i pobieranie danych, a jzyk WML znacznie róni si od standardowych
specyfikacji sieciowych jzyków znaczników (takich jak HTML). Dziki tym technolo-
giom uytkownicy urzdze przenonych uzyskali dostp do informacji przypominajcych
materiay z sieci WWW.

Mniej wicej w tym samym czasie japoska firma z brany komunikacji bezprzewodowej,
NTT DoCoMo, udostpnia w Japonii usug i-Mode, która pozwalaa odbiera w urz-
dzeniach przenonych materiay podobne do tych z sieci WWW. Organizacja ta na potrzeby
dostarczania danych opracowaa now odmian jzyka HTML — Compact HTML.

W tym punkcie pojawia si zwrot „materiay zblione do tych z sieci WWW”. To celowy
zabieg, poniewa pocztkowo dane dla urzdze przenonych nie byy dostarczane
za pomoc podstawowego jzyka znaczników (HTML) ani standardowych bram
internetowych. Materiay miay format WML lub Compact HTML, dlatego byy do ubogie.
Ponadto dostarczanie odbywao si przez zastrzeone bramy, dlatego dane byy naraone
na filtrowanie. Poniewa za generowanie i dostarczanie wikszoci informacji odpowiadali
dostawcy usug, uytkownik czsto nie móg uzyska dostpu do wybranej przez siebie
witryny. Std materiay byy tylko „zblione do tych z sieci WWW”.

Wraz ze wzrostem popularnoci pocze bezprzewodowych zaczy pojawia si nowe
urzdzenia z bogatszymi moliwociami w tym zakresie. Jednak wiksza liczba producen-
tów oznaczaa te wicej zastrzeonych rozwiza. Okazao si, e mechanizmy dziaajce
w jednym telefonie czsto nie s dostpne w innych urzdzeniach, a klienci wci nie
mogli przeglda sieci WWW. Na szczcie problemy uytkowników zostay zauwaone.

Organizacja Open Mobile Alliance i nowe standardy

Kilka firm zauwayo wady pocze mobilnych i wzrost zrónicowania technologii. Przed-
sibiorstwa te utworzyy organizacj Open Mobile Alliance (OMA). Miaa ona dopro-
wadzi do powstania lepszych, powszechnie przyjtych standardów, a take zwikszy
komfort korzystania z pocze mobilnych. W urzdzeniach pojawiy si nowe przegldarki
o duych moliwociach, a zastrzeone bramy zaczy znika .

Mniej wicej w czasie powstania OMA organizacja W3C opracowaa jzyk znaczników
dla urzdze przenonych, który mia uporzdkowa rynek. Standard ten pojawi si pod
nazw HTML Basic. Jzyk ten zaprojektowano jako minimalny zbiór znaczników XHTML,
które miay obsugiwa przegldarki dla urzdze przenonych. Organizacja OMA przy-

Rozdzia 22.  Tworzenie stron dla urzdze przenonych

359

ja ten standard i rozszerzya go do specyfikacji XHTML Mobile Profile. Rozwijane od
tej pory przegldarki dla urzdze przenonych miay obsugiwa t specyfikacj, co miao
zaowocowa wikszymi moliwociami w zakresie przegldania danych.

Podobnie jak inne nowinki w rodowisku urzdze przenonych, tak i nowe standardy nie
spotkay si z pen akceptacj i przyjciem. Wikszo producentów przegldarek zde-
cydowaa si na obsug jzyka XHTML Basic, a nie wzbogaconej specyfikacji Mobile
Profile. Kilka firm rozwijajcych bardziej rozbudowane przegldarki (byli to czonkowie
OMA) wprowadzio rozszerzony standard, aby zapewni uytkownikom wiksze mo-
liwoci, przy czym zachowao zgodno z jzykiem XHTML Basic.

atwo mona si domyli , e wikszo dostawców informacji tworzyo strony w jzyku
XHTML Basic, co zapewniao najwiksze grono odbiorców.

Starsze urzdzenia, powstae ponad dwa lata przed napisaniem tej ksiki, obsuguj
tylko WML lub starsz wersj WAP. Nawet przegldarki, które niemal idealnie przetwarzaj
kod XHTML, wywietlaj strony na maych ekranach, maj dostp do mniejszej pamici
itd. Warto o tym pamita w czasie tworzenia stron (zwaszcza jeli docelowi odbiorcy
to uytkownicy starszych urzdze ).

Podsumowanie

Oto podsumowanie historii internetu mobilnego — cho standardy dojrzay, a producenci
przegldarek je przyjmuj, nie mona mie pewnoci, jakie moliwoci w zakresie prze-
gldania stron maj ich odbiorcy.

Korzystanie z jzyka XHTML Basic to do bezpieczne podejcie, jednak jeli to moliwe,
warto przetestowa pod ktem zgodnoci z kodem kilka urzdze uywanych przez doce-
lowych odbiorców.

Jzyk XHTML Basic 1.1

XHTML Basic to podzbiór jzyka XHTML zdefiniowany przy uyciu modularyzacji
XHTML. Technika ta polega na budowaniu jzyka znaczników przez tworzenie najpierw
mniejszych komponentów, a nastpnie okrelanie ich powiza w celu opracowania caego
jzyka.

Aktualna specyfikacja XHTML Basic 1.1 jest dostpna na stronie www.w3.org/TR/
xhtml-basic/.

Deklaracja doctype XHTML Basic 1.1

Podobnie jak kady inny dokument sieciowy, strona XHTML Basic musi rozpoczyna
si od waciwej deklaracji

doctype

. W przypadku jzyka XHTML Basic 1.1 nagówek

dokumentu powinien wyglda nastpujco:

360

Cz II  Narzdzia oraz inne wersje jzyka HTML

<?xml version="1.0" charset="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.1//EN"
"http://www.w3.org/TR/xhtml-basic/xhtml-basic11.dtd">

Ponadto, aby mie pewno , e sama nazwa pliku pozwoli poprawnie go zinterpretowa ,
naley zapisa dokument z rozszerzeniem .xhtml, a nie .htm lub .html.

Elementy jzyka XHTML Basic 1.1

Poniewa jzyk XHTML Basic oparto na XHTML-u, struktura, zasig i sposób uywania
wikszoci elementów w obu specyfikacjach s podobne. Tabela 22.1 zawiera list modu-
ów jzyka XHTML Basic i elementy dostpne w kadym z nich.

Tabela 22.1. Moduy i elementy jzyka XHTML Basic 1.1

Modu

Elementy

Modu Structure

body

,

head

,

html

,

title

Modu Text

abbr

,

acronym

,

address

,

blockquote

,

br

,

cite

,

code

,

dfn

,

div

,

em

,

h1

,

h2

,

h3

,

h4

,

h5

,

h6

,

kbd

,

p

,

pre

,

q

,

samp

,

span

,

strong

,

var

Modu Hypertext

a

Modu List

dl

,

dt

,

dd

,

ol

,

ul

,

li

Modu Forms

button

,

fieldset

,

form

,

input

,

label

,

legend

,

select

,

optgroup

,

option

,

textarea

Modu Basic Tables

caption

,

table

,

td

,

th

,

tr

Modu Image

img

Modu Object

object

,

param

Modu Presentation

b

,

big

,

hr

,

i

,

small

,

sub

,

sup

,

tt

Modu Meta Information

meta

Modu Link

link

Modu Base

base

Modu Intrinsic Events

Atrybuty

event

Modu Scripting

script

,

noscript

Modu Stylesheet

Atrybut

style

Modu Style Attribute (przestarzay)

Atrybut

style

Modu Target

Atrybut

target

Jeli w tabeli 22.1 nie okrelono inaczej, pozycje w kolumnie Elementy to znaczniki:

<br />

,

<h5>

,

<ol>

itd. Atrybuty s odpowiednio opisane.

Rozdzia 22.  Tworzenie stron dla urzdze przenonych

361

Warto zauway , e jzyk XHTML Basic zachowa wszystkie elementy do formatowa-
nia tekstu (w tym kilka uznanych za przestarzae w jzyku HTML 4.01), jednak wyco-
fano z niego atrybut

style

, dlatego nie mona umieszcza definicji stylów bezporednio

w znacznikach.

Wikszo urzdze przenonych nie obsuguje jzyka JavaScript, dlatego nie naley
uywa go w dokumentach przeznaczonych dla takich sprztów. W zamian mona
zastosowa jedn z technologii wykonywania skryptów po stronie serwera (jzyk PHP,
Perl, Python itd.) do przetwarzania danych na zapleczu i dynamicznego wywietlania
dokumentów zgodnych z jzykiem HTML Basic.

Zagadnienia wymagajce szczególnej uwagi

Cho specyfikacja XHTML Basic obejmuje wiele elementów jzyka HTML, przy jej uy-
waniu warto pamita o kilku zagadnieniach.

Doskonae wskazówki na temat tworzenia stron dla urzdze przenonych zawiera
strona www.w3.org/TR/mobile-bp/ w witrynie organizacji W3C.

Wielko ekranu

Urzdzenia przenone maj mae wywietlacze. Jednak aby w peni zrozumie problemy
zwizane z brakiem miejsca na ekranie w niektórych urzdzeniach, warto otworzy ulu-
bion witryn i zmniejszy okno przegldarki na komputerze PC do mniej ni 200 pikseli.
Rysunek 22.1 przedstawia stron gówn witryny Yahoo.com w takim oknie.

Rysunek 22.1.
Wikszo stron
WWW wyglda inaczej
w maym oknie

Uwzgldnianie przepustowoci i kosztów
przy tworzeniu stron

W czasie tworzenia stron WWW atwo dodawa do nich coraz to wicej materiaów, przyj-
mujc, e wikszo odbiorców korzysta z szybkich komputerów podczonych do internetu
czem szerokopasmowym. Jednak w przypadku urzdze przenonych sytuacja wyglda
inaczej. Niektórzy ich uytkownicy ponosz dodatkowe opaty za poczenia z internetem.

Przy rozwijaniu stron przeznaczonych do wywietlania w urzdzeniach przenonych naley
pamita zarówno o jakoci materiaów, jak i o kosztach ponoszonych przez uytkowników.
Dlatego warto dokona autocenzury i zrezygnowa z dodatkowych oraz niezwizanych

362

Cz II  Narzdzia oraz inne wersje jzyka HTML

z tematem strony danych. Naley te pamita o tym, e informacje powinny by zwize.
Na razie trzeba zrezygnowa z nadmiernego wzbogacania materiaów dla urzdze prze-
nonych.

Ograniczenia zwizane z danymi wejciowymi

Atrakcyjny jest pomys pobierania rónych danych od uytkowników urzdze przeno-
nych — informacji o lokalizacji w celu znalezienia lokalnych usug, nazwisk przy reje-
strowaniu osób w bazie itd. Trzeba jednak pamita , e wikszo urzdze przenonych
nie ma prawdziwej klawiatury, co utrudnia wpisywanie nawet najprostszych informacji.
Dlatego naley ograniczy ilo wpisywanych danych i stosowa inne techniki ich pobie-
rania, na przykad listy opcji, przyciski opcji, odnoniki itd.

atwe adresy URL

Cho warto umieszcza dokumenty dla urzdze przenonych w odrbnym katalogu ser-
wera sieciowego, naley pamita , e nazwy takich folderów (i pene adresy URL) powinny
by jak najatwiejsze do wpisania. Poniej znajduje si lista wskazówek z tego obszaru:



Nazwy katalogów powinny by krótkie.



Nie naley umieszcza materiaów dalej ni jeden poziom od katalogu gównego
serwera.



W adresach URL naley unika znaków specjalnych.



W adresach URL naley stosowa skróty zamiast penych nazw (na przykad dev
zamiast developer).



Warto rozway tworzenie skróconych adresów URL, dekodowanych przez serwer.

Inna moliwo to umieszczenie materiaów dla urzdze przenonych w okrelonej loka-
lizacji i kierowanie do niej przegldarki przez serwer sieciowy na podstawie moliwoci
danego programu. Wikszo przegldarek przy zgaszaniu dania informuje o swych
funkcjach i okrela, czy obsuguje jzyk HTML, XHTML MP, WML itd. Serwery potrafi
odczyta te informacje i odpowiednio na nie zareagowa . Na przykad modu

rewrite

serwera Apache moe uy poniszego kodu do wykrycia przegldarki, która obsuguje
formaty XHTML Mobile Profile i WML, a nastpnie zwróci dokument index.xhtml
zamiast standardowego pliku index.html:

# Sprawdzanie obsugi formatów xhtml+xml (MP) i WML
RewriteCond %{HTTP ACCEPT} application/xhtml+xml
RewriteCond %{HTTP ACCEPT} text/vnd

\.wap\.wml

# Jeli przegldarka obsuguje obie potrzebne specyfikacje, zrozumie format MP
# Naley przesa plik xhtml zamiast html
RewriteRule index.html$ index.xhtml [L]

Pene omówienie moduu rewrite serwera Apache i uywania go do przekierowywania
przegldarek dla urzdze przenonych wykracza poza zakres tej ksiki. Wicej informacji
o module

mod_rewrite zawiera strona http://httpd.apache.org/docs/2.2/misc/

rewriteguide.html. Doskonae wprowadzenie do kilku opartych na serwerze metod
przekierowywania znajduje si na stronie www.oreillynet.com/pub/a/wireless/2004/
02/20/mobile_browsing.html

.

Rozdzia 22.  Tworzenie stron dla urzdze przenonych

363

Mae rysunki

Ze wzgldów praktycznych rysunki powinny mie niewielkie rozmiary, jednak warto
te pamita o tym, aby jak najmniejsze byy pliki graficzne. Naley sprawdzi kady
obrazek w optymalizatorze palety kolorów i rozway uycie wszdzie tam, gdzie to
moliwe, rysunków w odcieniach szaroci.

Opisowe atrybuty alt i tekst odnoników

W czasie tworzenia stron dla urzdze przenonych naley te doda do wszystkich rysun-
ków krótkie, ale opisowe atrybuty

alt

. Gwarantuje to, e urzdzenia z wyczon obsug

grafiki i dziaajce w sieci o maej przepustowoci (w której wczytywanie rysunków
trwa dugo) bd mogy co wywietli i zasygnalizowa waciw tre strony. Ponadto
wszystkie odnoniki powinny mie opisowy tekst, aby uytkownik wiedzia, gdzie moe
przej .

Niezawodna nawigacja

Kiedy wywietlacz jest may i atwo korzystania z witryny spada, niezawodna nawigacja
staje si duo waniejsza. Logiczne klawisze dostpu i sensowna kolejno tabulacji to
dwie atwe metody poprawy uytecznoci witryny. Umieszczenie czsto uywanych opcji
w górnej czci strony, gdzie mona je atwo znale , to nastpny sposób na usprawnienie
nawigacji.

Unikanie stron o zoonej strukturze

W3C niechtnie wczya tabele do specyfikacji XHTML Basic 1.1. Mechanizm ten
mia pomóc w wywietlaniu danych tabelarycznych w dokumentach dla urzdze prze-
nonych. Jednak — jak opisano to w rozdziale 38. — nie naley uywa tabel do for-
matowania caych dokumentów. Aby zapewni komfort pracy uytkownikom, naley
umieszcza w tabelach tylko dane tekstowe.

Narzdzia do tworzenia stron
dla urzdze przenonych

Przy tworzeniu stron WWW mona korzysta z wielu narzdzi programistycznych. Prawie
kady producent telefonów udostpnia aplikacje wspomagajce rozwijanie materiaów
przeznaczonych dla danego urzdzenia. Tabela 22.2 zawiera list kilku najbardziej war-
tociowych witryn dla projektantów stron.

Kada z tych witryn zawiera wiele zasobów, jednak s one dostpne dopiero po zarejestro-
waniu si w programie dla projektantów. Firmy Openwave i Nokia udostpniaj emulatory
urzdze. Rysunek 22.2 przedstawia okno diagnostyczne i emulator Openwave.

364

Cz II  Narzdzia oraz inne wersje jzyka HTML

Tabela 22.2. Popularne witryny z narzdziami do tworzenia stron dla urzdze przenonych

Firma

URL

Ericsson Mobility World Developer Program

www.ericsson.com/developer

ForumNokia

http://www.forum.nokia.com/

Motodev the Motorola Developer Network

http://developer.motorola.com/

Openwave Developer Network

http://developer.openwave.com/dvl/

Rysunek 22.2. Emulator i konsola Openwave

Niektóre pakiety narzdzi udostpniane przez producentów urzdze przenonych
obejmuj pene rodowiska IDE i narzdzia diagnostyczne, które umoliwiaj pisanie
zgodnego z XHTML-em kodu dla rónych urzdze tego rodzaju.

Podsumowanie

W tym rozdziale opisano mobilny aspekt stron HTML — od pocztków mobilnego inter-
netu i jego dojrzewania dziki wprowadzaniu komponentów jzyka XHTML Basic.
Czytelnik wie ju, jak atwe moe by tworzenie stron wywietlanych w rónych urz-
dzeniach przenonych, a jednoczenie jak trudno jest przygotowywa materiay dla sprztu
o ograniczonych zasobach. Nastpny rozdzia opisuje porzdkowanie kodu i sprawdzanie
jego poprawnoci. Na kocu niniejszej czci opisano kilka sztuczek zwizanych z jzy-
kiem HTML.