tworzenie stron metodą stopniowego ulepszania. witryny dostępne dla każdego ebook, ebooki6

[ Pobierz całość w formacie PDF ]
Spis treści
Podziękowania
11
Wstęp
13
CZĘŚĆ I
METODA STOPNIOWEGO ULEPSZANIA OPARTA NA TESTACH
Rozdział 1.
Nasze podejście
33
Sprawdzanie możliwości przeglądarek ...................................................................................34
Planowanie stopniowego ulepszania — prześwietlanie ........................................................36
Od prześwietlania do działania — technika stopniowego ulepszania ................................38
Praktyka.......................................................................................................................................40
Rozdział 2. Stopniowe ulepszanie w akcji — prześwietlanie 41
Prześwietlanie — informacje podstawowe .............................................................................42
Definiowanie hierarchii treści i znajdowanie odpowiedników HTML
dla komponentów .............................................................................................................43
Tworzenie bazowego kodu znaczników i bezpiecznych stylów ....................................45
Dodawanie rozszerzeń ........................................................................................................46
Przypadek 1. — Planowanie struktury i układu witryny z wiadomościami ......................48
Ocenianie organizacji treści i nadawanie nazw ...............................................................48
Organizowanie treści za pomocą standardowych elementów HTML .........................50
Struktura nawigacji..............................................................................................................50
Dodawanie treści warstwowej i animowanej ...................................................................51
Dynamiczne filtrowanie i sortowanie ...............................................................................52
Przypadek 2. — Kolejność czynności oraz sprawdzanie i wysyłanie danych
z formularza składania zamówienia .....................................................................................53
Rozkładanie na czynniki formularza składania zamówienia.........................................54
Stosowanie znaczników zapewniających dostępność .....................................................60
Definiowanie ograniczeń i walidacja.................................................................................62
Składanie wersji podstawowej i rozszerzonej...................................................................63
Przypadek 3. — Interaktywne wizualizowanie danych w kalkulatorze budżetu...............63
Wybór podstawowych elementów dla suwaków.............................................................64
Tworzenie dostępnych suwaków z kodu bazowego........................................................66
Tworzenie wykresu ..............................................................................................................67
 4
TWORZENIE STRON METODĄ STOPNIOWEGO ULEPSZANIA. WITRYNY DOSTĘPNE DLA KAŻDEGO
Przypadek 4. — Funkcjonalność zwykłych programów w oknie przeglądarki:
menedżer zdjęć ........................................................................................................................69
Znakowanie elementów nawigacji globalnej....................................................................70
Skomplikowane interakcje..................................................................................................71
Tworzenie niestandardowych formularzy i nakładek ....................................................75
Obsługa przycisku Wstecz ..................................................................................................76
Lista kontrolna prześwietlania .................................................................................................77
Rozdział 3.
Pisanie semantycznego kodu
79
Znakowanie tekstu i obrazów...................................................................................................80
Znakowanie tekstu...............................................................................................................81
Listy........................................................................................................................................86
Dane tabelaryczne................................................................................................................87
Obrazy ...................................................................................................................................89
Wstawianie plików multimedialnych ...............................................................................90
Osadzanie treści ze stron zewnętrznych ...........................................................................92
Znakowanie treści interaktywnej .............................................................................................93
Łącza ......................................................................................................................................93
Struktura formularza ...........................................................................................................94
Kontrolki formularza ..........................................................................................................96
Tworzenie kontekstu na stronie............................................................................................ 101
Elementy blokowe i śródliniowe..................................................................................... 102
Przypisywanie elementom identyfikatorów i klas........................................................ 103
Oznaczaj główne części strony za pomocą ról WAI-ARIA ........................................ 104
Kolejność elementów........................................................................................................ 105
Stosuj atrybut title ............................................................................................................. 107
Struktura dokumentu HTML................................................................................................ 108
Definiowanie typu dokumentu ....................................................................................... 109
Nagłówek dokumentu ...................................................................................................... 110
Dostępność............................................................................................................................... 115
Wytyczne dotyczące dostępności i regulacje prawne .................................................. 115
Wytyczne WCAG ............................................................................................................. 117
Rozdział 4.
Efektywne stosowanie stylów
119
Sposoby wstawiania arkuszy stylów na stronę .................................................................... 120
Zapisywanie stylów w plikach zewnętrznych................................................................ 120
Dołączanie zewnętrznych arkuszy stylów ..................................................................... 121
Konwencje nazewnicze .................................................................................................... 123
 5
SPIS TREŚCI
Style dla wersji podstawowej i rozszerzonej witryny ......................................................... 124
Bezpieczny arkusz stylów dla wersji podstawowej ....................................................... 124
Style w wersji rozszerzonej .............................................................................................. 125
Dostępność............................................................................................................................... 127
Błędy przeglądarek i różne sposoby interpretowania stylów............................................... 129
Komentarze warunkowe .................................................................................................. 129
Często spotykane problemy i ich rozwiązania .............................................................. 130
Rozdział 5.
Rozszerzenia skryptowe i elementy interaktywne
135
Dodawanie skryptów do strony ............................................................................................ 136
Nie wpisuj skryptów bezpośrednio w kodzie strony.................................................... 136
Dołączanie zewnętrznych skryptów ............................................................................... 136
Rola JavaScriptu w kodzie podstawowym ........................................................................... 137
Najlepsze praktyki pisania rozszerzeń.................................................................................. 137
Uruchamianie skryptów, gdy treść jest gotowa ............................................................ 137
Dodawanie elementów interaktywności........................................................................ 138
Budowanie rozszerzonego kodu znacznikowego przy użyciu JavaScriptu............... 140
Zapewnianie widoczności treści ..................................................................................... 143
Stosowanie rozszerzeń stylistycznych ............................................................................ 144
Dostępność i właściwości użytkowe ..................................................................................... 145
Implementacja dostępu za pomocą klawiatury ............................................................ 146
Definiowanie atrybutów WAI-ARIA............................................................................. 147
Testowanie dostępności ................................................................................................... 148
Dostępność i właściwości użytkowe ............................................................................... 149
Rozdział 6. Testowanie możliwości przeglądarek 151
EnhanceJS — pakiet testów możliwości przeglądarek ....................................................... 152
Sposób działania testów ................................................................................................... 153
Stosowanie rozszerzeń przy użyciu EnhanceJS................................................................... 155
Konfigurowanie skryptu EnhanceJS..................................................................................... 157
Wczytywanie dodatkowych arkuszy stylów .................................................................. 158
Wczytywanie dodatkowych skryptów ........................................................................... 160
Modyfikowanie odnośnika do przełączania wersji ...................................................... 161
Wymuszanie określonego wyniku testu EnhanceJS .................................................... 162
Rozszerzanie zestawu testów EnhanceJS ............................................................................. 163
Modyfikowanie pakietu testów za pomocą opcji EnhanceJS...................................... 163
Tworzenie nowych lub dodatkowych egzemplarzy EnhanceJS ................................. 164
Wyświetlanie powiadomień o błędach .......................................................................... 165
Optymalizowanie skryptu EnhanceJS na serwerze ............................................................ 165
 6
TWORZENIE STRON METODĄ STOPNIOWEGO ULEPSZANIA. WITRYNY DOSTĘPNE DLA KAŻDEGO
CZĘŚĆ II
STOPNIOWE ULEPSZANIE — ZAGADNIENIA PRAKTYCZNE
Rozdział 7.
Tworzenie komponentów techniką stopniowego ulepszania
169
Sposób pisania kodu komponentów .................................................................................... 170
Organizacja tej części książki................................................................................................. 171
Przykładowy kod do pobrania............................................................................................... 173
Rozdział 8.
Treść składana
175
Prześwietlanie .......................................................................................................................... 176
Tworzenie dostępnej treści zwijanej..................................................................................... 178
Kod bazowy ....................................................................................................................... 178
Wersja rozszerzona........................................................................................................... 179
Skrypt obsługujący zwijanie i rozwijanie treści ............................................................ 182
Korzystanie ze skryptu ........................................................................................................... 184
Rozdział 9.
Karty
187
Prześwietlanie .......................................................................................................................... 187
Tworzenie kart......................................................................................................................... 190
Kod bazowy ....................................................................................................................... 190
Wersja rozszerzona........................................................................................................... 192
Skrypt kart.......................................................................................................................... 196
Dalsze rozszerzanie kart ......................................................................................................... 199
Zakładki i historia ............................................................................................................. 199
Automatyczne obracanie kart ......................................................................................... 202
Wstawianie na karty treści zewnętrznej......................................................................... 203
Wyświetlanie kart jako harmonijki ................................................................................ 203
Korzystanie ze skryptu kart ................................................................................................... 204
Rozdział 10.
Chmurki
207
Prześwietlanie .......................................................................................................................... 208
Tworzenie chmurek za pomocą atrybutu title .................................................................... 211
Kod bazowy ....................................................................................................................... 211
Wersja rozszerzona........................................................................................................... 212
Skrypt.................................................................................................................................. 214
Tworzenie chmurki z kotwicy ............................................................................................... 216
Tworzenie chmurki przy użyciu treści zewnętrznej........................................................... 218
Korzystanie ze skryptu chmurek........................................................................................... 219
  [ Pobierz całość w formacie PDF ]