Kurs projektowania dostępnych stron internetowych

Lekcja 1 • Biznesowy i etyczny aspekt

Przedstawia moralne, społeczne i komercyjne argumenty na rzecz dostępności. Motywuje uczniów do traktowania dostępności jako priorytetu zawodowego.

Lekcja 2 • Przegląd globalnych standardów dostępności

Przegląd międzynarodowych wytycznych i ram zgodności. Łączy oczekiwania regulacyjne z praktycznymi decyzjami projektowymi.

Lekcja 3 • Perspektywy osób z niepełnosprawnościami i badania użytkowników

Analizuje, jak różni użytkownicy doświadczają sieci. Buduje empatię i wprowadza metody zorientowane na użytkownika, stosowane w dalszych rozdziałach.

Lekcja 4 • Cztery zasady POUR

Wprowadza postrzegalność, funkcjonalność, zrozumiałość i solidność jako ramy organizacyjne. Zapewnia perspektywę stosowaną w całym kursie.

Lekcja 1 • Dostępne obrazy i elementy multimedialne

Obejmuje tekst alternatywny, figury i znaczniki osadzonych multimediów. Łączy treści wizualne z ich tekstowymi odpowiednikami dla użytkowników niewidomych.

Lekcja 2 • Dlaczego semantyka napędza dostępność

Wyjaśnia, jak przeglądarki i technologie asystujące interpretują semantykę HTML. Ustanawia, dlaczego prawidłowy wybór elementu ma większe znaczenie niż stylizacja wizualna.

Lekcja 3 • Dostępne listy, tabele i dane

Uczy prawidłowego oznaczania list i złożonych tabel danych. Zapewnia użytkownikom czytników ekranu dokładny kontekst strukturalny.

Lekcja 4 • Struktura dokumentu i punkty orientacyjne

Obejmuje hierarchię nagłówków, elementy orientacyjne i regiony strony. Umożliwia użytkownikom efektywne nawigowanie po dokumentach za pomocą technologii asystujących.

Lekcja 1 • Wzorce projektowe ARIA w praktyce

Stosuje wzorce ARIA do rzeczywistych komponentów, takich jak zakładki, akordeony i menu. Łączy wiedzę o specyfikacji z wdrożeniem gotowym do produkcji.

Lekcja 2 • Role punktów orientacyjnych i widżetów

Obejmuje role orientacyjne ARIA oraz role interaktywnych widżetów. Umożliwia prawidłowe przypisywanie ról niestandardowym komponentom UI.

Lekcja 3 • Podstawy i reguły ARIA

Wprowadza specyfikację ARIA i jej pięć zasad użycia. Zapobiega nadużyciom, ucząc, kiedy ARIA jest odpowiednia, a kiedy nie.

Lekcja 4 • Stany ARIA i regiony na żywo

Uczy atrybutów stanów dynamicznych i ogłoszeń regionów na żywo. Zapewnia, że technologie asystujące komunikują zmiany w interfejsie w czasie rzeczywistym.

Lekcja 1 • Widoczne wskaźniki fokusu

Uczy projektowania i wdrażania wyraźnych stylów fokusu. Odnosi się do wymogu WCAG dotyczącego postrzegalnego fokusu i kontrastu.

Lekcja 2 • Linki pomijania i mechanizmy omijania

Projektuje bloki pomijania, które pozwalają użytkownikom klawiatury pominąć powtarzające się treści. Bezpośrednio odnosi się do kryterium sukcesu WCAG dotyczącego bloków pomijania.

Lekcja 3 • Podstawy nawigacji klawiaturowej

Obejmuje sposób, w jaki użytkownicy nawigują za pomocą klawisza Tab, strzałek i skrótów. Ustanawia podstawowy kontrakt klawiaturowy, który wszystkie interfejsy muszą spełniać.

Lekcja 4 • Zarządzanie fokusem w dynamicznych interfejsach

Obejmuje programowe sterowanie fokusem dla okien modalnych, alertów i SPA. Zapobiega utracie fokusu i dezorientacji podczas dynamicznych aktualizacji treści.

Lekcja 1 • Wymagania dotyczące kontrastu kolorów

Wyjaśnia obliczanie współczynnika kontrastu i progi WCAG dla tekstu i UI. Umożliwia projektantom weryfikację i korektę kontrastu przed uruchomieniem.

Lekcja 2 • Niezależność koloru w projektowaniu

Uczy, jak przekazywać informacje bez polegania wyłącznie na kolorze. Zapobiega wykluczaniu użytkowników z niedoborami widzenia barw.

Lekcja 3 • Responsywne układy przyjazne dla powiększania

Projektuje układy, które przeformatowują się przy 400% powiększeniu bez poziomego przewijania. Zapewnia, że użytkownicy słabowidzący mogą powiększać treści bez utraty funkcjonalności.

Lekcja 4 • Typografia i czytelność

Obejmuje rozmiar czcionki, wysokość wiersza, odstępy i wybór kroju pisma dla czytelności. Wspiera użytkowników z niepełnosprawnością wzroku i poznawczą.

Lekcja 1 • Dostępne typy danych wejściowych i sterowanie

Wybiera odpowiednie typy danych wejściowych HTML dla każdego scenariusza wprowadzania danych. Wykorzystuje natywne zachowanie przeglądarki w celu zmniejszenia nakładu pracy z niestandardowym ARIA.

Lekcja 2 • CAPTCHA i dostępność uwierzytelniania

Ocenia bariery CAPTCHA i dostępne alternatywy uwierzytelniania. Zapewnia, że mechanizmy bezpieczeństwa nie wykluczają użytkowników z niepełnosprawnościami.

Lekcja 3 • Walidacja wbudowana i komunikaty o błędach

Implementuje walidację w czasie rzeczywistym i po przesłaniu z dostępnymi ogłoszeniami. Zapobiega przesyłaniu niekompletnych formularzy bez wyraźnych wskazówek.

Lekcja 4 • Złożone wzorce formularzy

Omawia formularze wieloetapowe, pola warunkowe i dynamiczne dane wejściowe. Utrzymuje dostępność wraz ze wzrostem złożoności formularza.

Lekcja 1 • Dostępne odtwarzacze multimedialne

Ocenia i konfiguruje odtwarzacze multimedialne do obsługi klawiaturą i czytnikiem ekranu. Zapewnia, że sterowanie odtwarzaniem jest obsługiwane bez myszy.

Lekcja 2 • Transkrypty i audiodeskrypcja

Uczy tworzenia pełnych transkryptów dla treści audio oraz audiodeskrypcji dla wizualnych treści wideo. Rozszerza dostęp dla użytkowników niewidomych i tych, którzy nie mogą odtwarzać multimediów.

Lekcja 3 • Dostępne wizualizacje danych

Stosuje techniki udostępniania wykresów, diagramów i infografik. Zapewnia alternatywy tekstowe i nawigację klawiaturą dla danych wizualnych.

Lekcja 4 • Napisy do treści wideo

Obejmuje tworzenie napisów zamkniętych i otwartych, formatowanie i synchronizację. Służy użytkownikom głuchym, słabosłyszącym oraz nieposługującym się językiem ojczystym.

Lekcja 1 • Planowanie napraw i zapobieganie regresjom

Przekształca wyniki audytu w priorytetową mapę drogową poprawek. Wbudowuje kontrole dostępności w przepływy pracy, aby zapobiec przyszłym regresjom.

Lekcja 2 • Testowanie czytnikami ekranu

Prowadzi testowanie z głównymi czytnikami ekranu na różnych systemach operacyjnych. Weryfikuje, że znaczniki semantyczne i ARIA generują prawidłowe ogłoszenia.

Lekcja 3 • Ręczne techniki testowania

Uczy sprawdzania nawigacji wyłącznie za pomocą klawiatury oraz metod inspekcji wizualnej. Obejmuje większość problemów, których nie wykrywają zautomatyzowane narzędzia.

Lekcja 4 • Przeprowadzanie audytu dostępności

Strukturyzuje pełny audyt oparty na WCAG od określenia zakresu do raportowania. Generuje przydatne wnioski, które zespoły programistyczne mogą priorytetyzować.