XHTML i CSS Dostepne witryny internetowe.pdf

(964 KB) Pobierz
XHTML i CSS. Dostêpne
witryny internetowe
Autor: Jon Duckett
T³umaczenie: Rados³aw Meryk
ISBN: 978-83-246-1293-2
Tytu³ orygina³u:
Accessible XHTML
and CSS Web Sites Problem Design Solution
Format: 168 x237, stron: 488
Wykorzystaj nowoczesne technologie, aby Twoje strony WWW sta³y siê bardziej dostêpne
Jak przekonwertowaæ witrynê zgodnie z wymaganiami dostêpnoœci?
Jak korzystaæ z technologii XHTML i CSS, aby tworzyæ przyjazne
dla wszystkich strony WWW?
Jak tworzyæ serwisy przeznaczone dla wielu platform?
Nowoczesne technologie zapewniania dostêpnoœci koncentruj¹ siê na umo¿liwieniu
korzystania z internetu wszystkim ludziom - w jak najwiêkszym zakresie. Szczególnie
istotne jest przystosowanie witryn do potrzeb osób niepe³nosprawnych. Tworzenie takich
stron ma istotne znaczenie nie tylko ze wzglêdów spo³ecznych, ale tak¿e ekonomicznych
i prawnych (Amerykanie i Brytyjczycy wprowadzili ustawê antydyskryminacyjn¹, która
nak³ada na przedsiêbiorstwa obowi¹zek posiadania witryn internetowych dostêpnych
dla wszystkich). Niektórzy twórcy stron WWW obawiaj¹ siê, ¿e ograniczy to ich
kreatywnoœæ. Jednak wspó³czesne narzêdzia sprawiaj¹, ¿e aplikacje nie tylko nie trac¹
na atrakcyjnoœci, ale jeszcze powiêksza siê grupa potencjalnych odbiorców, co mo¿e
przek³adaæ siê na wzrost zysków firmy.
Ksi¹¿ka, któr¹ trzymasz w rêkach, prezentuje ró¿ne zastosowania nowych technologii
na konkretnym przyk³adzie konwersji witryny napisanej w jêzyku HTML na nowoczesn¹
stronê w XHTML, wykorzystuj¹c¹ kaskadowe arkusze stylów o zwiêkszonej dostêpnoœci.
Utworzone w ten sposób strony nie dyskryminuj¹ niepe³nosprawnych u¿ytkowników,
maj¹cych trudnoœci z czytaniem ma³ych czcionek lub pos³ugiwaniem siê tradycyjnymi
urz¹dzeniami steruj¹cymi. Podrêcznik ten jest przeznaczony dla wszystkich, którzy
korzystali wczeœniej z HTML, a teraz chc¹ zaktualizowaæ swoj¹ wiedzê i umiejêtnoœci.
Dziêki tej ksi¹¿ce naprawdê szybko nauczysz siê pisania kodu w XHTML czy korzystania
z CSS przy zarz¹dzaniu uk³adem strony, a tak¿e poznasz regu³y i wytyczne dotycz¹ce
dostêpnoœci oraz technologie j¹ wspomagaj¹ce.
Transformacja kodu HTML na XHTML
Narzêdzia XML i mo¿liwoœci ich u¿ywania
Zastosowanie CSS do definiowania stylu dokumentów
Rodzaje selektorów
Czcionki i w³aœciwoœci tekstowe
Pseudoelementy tekstowe
Wymiary, kolor i t³o
Walidacja arkuszy CSS
Wykorzystanie CSS do zarz¹dzania uk³adem dokumentu
Regu³y i wytyczne dotycz¹ce dostêpnoœci
Aby Twoje strony by³y atrakcyjne i dostêpne dla wszystkich!
Wydawnictwo Helion
ul. Koœciuszki 1c
44-100 Gliwice
tel. 032 230 98 63
e-mail: helion@helion.pl
Spis treści
O autorze ................................................................................................................................................... 7
Przedmowa ............................................................................................................................................... 9
Wprowadzenie ..........................................................................................................................................11
Rozdział 1. Przedstawiamy witrynę ........................................................................................................17
Problemy z językiem HTML ............................................................................................ 18
Projekt ........................................................................................................................ 19
Terminologia ........................................................................................................... 20
Wprowadzenie do języka HTML ................................................................................. 21
Problemy związane z przeglądarkami ......................................................................... 25
Lekcje ze
środowiska
telefonów komórkowych ........................................................... 26
Dostępność ............................................................................................................ 27
Oddzielenie stylu od treści ....................................................................................... 29
„X” w nazwie XHTML ............................................................................................... 30
Historia technologii CSS ............................................................................................... 31
Korzystanie z arkuszy stylów ......................................................................................... 32
Wprowadzenie do przykładowej witryny ........................................................................... 34
Strona główna ........................................................................................................ 37
Strony z listami produktów ....................................................................................... 44
Strony ze szczegółowymi danymi o produktach .......................................................... 47
Struktura witryny ..................................................................................................... 51
Aktualizacja witryny ................................................................................................. 52
Podsumowanie ............................................................................................................ 54
Rozdział 2. Transformacja kodu HTML na XHTML ................................................................................. 55
Problem ....................................................................................................................... 56
Projekt ........................................................................................................................ 56
Strict XHTML .......................................................................................................... 58
Transitional XHTML ................................................................................................. 58
Frameset XHTML .................................................................................................... 59
Przykładowy dokument XHTML ................................................................................. 59
Pisanie dokumentów zgodnych ze składnią XML ........................................................ 61
4
XHTML i CSS. Dostępne witryny internetowe
Dlaczego XML? ....................................................................................................... 71
Różnice pomiędzy wersjami Transitional i Strict języka XHTML 1.0 .............................. 74
Obsługa XHTML w narzędziach do tworzenia stron WWW ............................................ 81
Walidacja ............................................................................................................... 83
Rozwiązanie ................................................................................................................. 87
Strona główna ........................................................................................................ 87
Strony z listą produktów .......................................................................................... 98
Strony ze szczegółowymi danymi o produktach ........................................................ 100
Walidacja ............................................................................................................. 104
Podsumowanie .......................................................................................................... 105
Rozdział 3. Zastosowanie CSS do definiowania stylu dokumentów ....................................................107
Problem ..................................................................................................................... 108
Projekt ...................................................................................................................... 108
Jak działa CSS? .................................................................................................... 108
Więcej informacji na temat dodawania reguł CSS ..................................................... 115
Selektory .............................................................................................................. 120
Czcionki ............................................................................................................... 124
Właściwości tekstowe ........................................................................................... 132
Pseudoelementy tekstowe ..................................................................................... 138
Model ramek ........................................................................................................ 139
Elementy <div> i <span> ....................................................................................... 142
Właściwości ramek ............................................................................................... 144
Wymiary ............................................................................................................... 150
Kolor i tło ............................................................................................................. 154
Rozwiązanie ............................................................................................................... 162
Strona główna ...................................................................................................... 163
Strony z listami produktów ..................................................................................... 173
Strony ze szczegółowymi danymi produktów ............................................................ 175
Podsumowanie .......................................................................................................... 178
Rozdział 4. Zaawansowane zastosowania języka CSS ........................................................................179
Problem ..................................................................................................................... 180
Projekt ...................................................................................................................... 180
Pseudoklasy i pseudoelementy .............................................................................. 180
Listy .................................................................................................................... 195
Właściwości tabel ................................................................................................. 198
Widoczność elementów ......................................................................................... 202
Wiele arkuszy stylów i reguła @import ..................................................................... 204
Priorytety reguł ...................................................................................................... 206
Walidacja arkuszy CSS .......................................................................................... 207
Rozwiązanie ............................................................................................................... 208
Poprawa wyglądu
łączy
.......................................................................................... 208
Obramowania tabel na stronach ze szczegółowymi danymi produktów ....................... 210
Podsumowanie .......................................................................................................... 213
Rozdział 5. Wykorzystanie CSS do zarządzania układem dokumentu ................................................215
Problem ..................................................................................................................... 216
Projekt ...................................................................................................................... 216
Schematy określania pozycji w CSS ........................................................................ 216
Warstwy nakładające się na siebie ......................................................................... 232
Spis treści
5
Popularne układy .................................................................................................. 235
Możliwości wyboru układu ...................................................................................... 251
Rozwiązanie ............................................................................................................... 253
Podsumowanie .......................................................................................................... 262
Rozdział 6. Dostępność .........................................................................................................................263
Problem ..................................................................................................................... 264
Projekt ...................................................................................................................... 265
Technologie wspomagające ................................................................................... 266
Dodatkowe korzyści ze stosowania się do reguł dostępności .................................... 267
Wytyczne dotyczące dostępności ............................................................................ 268
Tworzenie dostępnych stron WWW .......................................................................... 270
Rozwiązanie ............................................................................................................... 302
Zdefiniowanie odpowiedników tekstowych dla elementów nietekstowych ................... 302
Sprawdzenie dynamicznej zawartości oraz kolorów i kontrastu .................................. 303
Dodanie
łączy
w celu pominięcia powtarzających się
łączy
nawigacyjnych ................... 303
Podsumowanie .......................................................................................................... 306
Rozdział 7. Tworzenie dostępnych tabel i formularzy oraz testowanie witryny .............................307
Problem ..................................................................................................................... 308
Projekt ...................................................................................................................... 309
Tabele ................................................................................................................. 309
Formularze ........................................................................................................... 322
Zagadnienia dostępności witryn dla osób niesłyszących ........................................... 336
Dostępne ramki .................................................................................................... 337
Ostatnia deska ratunku — sam tekst ..................................................................... 340
Sprawdzanie zgodności witryny z wymogami dostępności ......................................... 341
Rozwiązanie ............................................................................................................... 344
Strony ze szczegółowymi danymi o produktach ........................................................ 344
Testowanie witryny za pomocą programu Bobby ....................................................... 346
Testowanie za pomocą LIFT ................................................................................... 347
Podsumowanie .......................................................................................................... 348
Rozdział 8. Spojrzenie w przyszłość ...................................................................................................349
Problem ..................................................................................................................... 350
Projekt ...................................................................................................................... 350
Sytuacja bieżąca ................................................................................................... 350
Nowe urządzenia ................................................................................................... 351
Lekcje ze
środowiska
urządzeń mobilnych ............................................................... 352
Moduły abstrakcyjne języka XHTML ......................................................................... 353
XHTML 1.1 ........................................................................................................... 355
XHTML Basic ........................................................................................................ 361
Dokumenty hybrydowe ........................................................................................... 363
Język XHTML na różnych urządzeniach .................................................................... 368
Rozwiązanie ............................................................................................................... 377
Podsumowanie .......................................................................................................... 381
Dodatek A Końcowy kod przykładu ......................................................................................................383
Strona główna ............................................................................................................ 384
Strony z listą produktów .............................................................................................. 386
Strony ze szczegółowymi danymi o produktach .............................................................. 389
Arkusz stylów CSS ...................................................................................................... 391
6
XHTML i CSS. Dostępne witryny internetowe
Dodatek B Elementy XHTML ...................................................................................................................397
Dodatek C Właściwości CSS .................................................................................................................435
Właściwości dotyczące czcionek .................................................................................. 435
Właściwości tekstowe ................................................................................................. 439
Właściwości dotyczące koloru i tła ............................................................................... 442
Właściwości dotyczące obramowania ........................................................................... 444
Wymiary .................................................................................................................... 446
Właściwości marginesów ............................................................................................ 449
Właściwości wypełnienia ............................................................................................. 449
Właściwości list ......................................................................................................... 450
Właściwości opisujące pozycje .................................................................................... 451
Właściwości obrysu .................................................................................................... 456
Właściwości tabel ....................................................................................................... 456
Właściwości dodatkowe .............................................................................................. 458
Właściwości międzynarodowe ...................................................................................... 460
Jednostki długości ...................................................................................................... 461
Dodatek D Sekwencje sterujące ..........................................................................................................463
Wbudowane sekwencje sterujące języka XML ............................................................... 464
Encje znakowe XHTML ................................................................................................ 464
Dodatek E Typy MIME ............................................................................................................................467
Tekst ........................................................................................................................ 468
Grafika ...................................................................................................................... 468
Dokumenty wieloczęściowe ......................................................................................... 468
Dźwięk ...................................................................................................................... 468
Wideo ....................................................................................................................... 469
Aplikacje .................................................................................................................... 469
Skorowidz ..............................................................................................................................................471
Zgłoś jeśli naruszono regulamin