Tworzenie dostępnych cyfrowo stron interaktywnych
Dwudniowe, intensywne szkolenie praktyczne dla agencji i software house’ów — projektowanie, development i wdrożenie dostępnych animacji i interakcji zgodnie z WCAG.
[Zapisz zespół →] [Poproś o ofertę dla firmy →]
W skrócie: 2 dni warsztatów (40% teoria, 60% praktyka), grupy 3-12 osób. Prowadzący: eksperci UX i WCAG, front-end i audytorzy dostępności.
Dlaczego warto (korzyści)
- Zmniejszysz ryzyko prawne i biznesowe — szkolenie wyjaśnia obowiązki wynikające z polskich i unijnych przepisów oraz praktyczne konsekwencje w projektach.
- Zwiększysz konwersję i zasięg — dostępność poprawia użyteczność dla wszystkich użytkowników (m.in. lepsze SEO, mniejsze porzucenia formularzy).
- Zintegrujesz dostępność z procesem SDLC - tworzenia i utrzymania systemów IT — od designu, przez komponenty, testy automatyczne, po CI/CD i monitoring.
- Aktualne standardy techniczne — wcielenie WCAG 2.1 oraz 2.2 (aktualne kryteria zgodnie z obowiązującymi przepisami i te przyszłościowe oraz rekomendacje praktyczne).
Dla kogo
- agencje interaktywne tworzące nowoczesne, animowane strony i aplikacje webowe
- software house’y rozwijające SPA / PWA / strony z intensywną interakcją (drag&drop, canvas, JS)
- zespoły front-end, UX/UI, product ownerzy, testerzy automatyzujący testy dostępności
Efekty po szkoleniu (co potrafią uczestnicy)
- Mapować wymagania prawne na backlog projektowy i zakres audytu (PL / UE / USA).
- Projektować interaktywne komponenty (modal, carousel, drag&drop, dynamiczne menu) z prawidłowym ARIA, obsługą klawiatury i kontrolą fokusu.
- Tworzyć dostępne animacje (oszczędne użycie ruchu, kontrola redukcji ruchu, prefer-reduced-motion).
- Wdrożyć zestaw testów: automatyczne skanery + ręczne testy z NVDA/VoiceOver + testy użytkowników z niepełnosprawnościami.
- Przygotować dostępność jako część CI (axe-core, jest-axe, Lighthouse, Pa11y, integracja z pipeline).
Program (szczegółowa agenda — 2 dni)
Dzień 1 — fundamenty i projektowanie (8:30–16:30)
Rano (8:30–12:30)
- Wprowadzenie: dlaczego dostępność jest biznesowo i prawnie istotna (PL / EU / USA).
- Kryteria WCAG 2.1 i 2.2 — przegląd najważniejszych SC na poziomach A i AA (2.1 i co się zmieniło w 2.2).
- Zasady POUR i zastosowanie w projektach interaktywnych.
Południe (13:15–16:30)
- Projektowanie dostępnych interfejsów: struktura, semantyka, kontrast, typografia, etykiety, mikrointerakcje.
- Warsztat projektowy (praca w grupach): redesign fragmentu interaktywnej strony (koncentracja na formularzach, nawigacji i animacjach).
- Powtórka: heurystyki dostępności + feedback od prowadzących.
Dzień 2 — development, testy, wdrożenie (8:30–16:30)
Rano (9:00–12:30)
- Dostępny HTML & ARIA w praktyce: kiedy i jak używać ARIA, role, właściwości, live regions.
- Warsztat developerski: zbuduj dostępny komponent (modal z trapem fokusowym, accessible carousel, custom select).
- Animacje i interakcje: accessible motion, prefer-reduced-motion, synchronizacja aria, timing i interruptions.
Południe (13:15–16:30)
- Testy automatyczne + ręczne: axe-core, Pa11y, Lighthouse, plus NVDA/VoiceOver.
- CI & monitoring: jak integrować testy dostępności w pipeline, proces naprawczy, raportowanie (VPAT, deklaracja dostępności).
- Case study i plan implementacji w projektach klienta — przygotowanie roadmapy zgodności (zadania, budżet, KPI).
- Sesja Q&A + indywidualne konsultacje (mini-audit fragmentów dostarczonych przez uczestników).
Wybrane ćwiczenia praktyczne
- Implementacja dostępnego modala: pułpka klawiaturowa, ARIA (w tym aria-hidden), zamykanie klawiaturą, czytniki ekranu.
- Interaktywna karuzela z pełną klawiaturową nawigacją i poprawnymi rolami.
- Dostępność SPA: routowanie, zmiana tytułu, live region dla aktualizacji asynchronicznych.
- Audyt 5-sekundowy i 30-minutowy istniejącej strony: wykrywanie priorytetowych blokad dostępności.
- Automatyzacja testów dostępności z użyciem axe-core + integracja w GitHub Actions.
Metodologia prowadzenia szkolenia
- Małe grupy, hands-on labs, programowanie w parach.
- Uczestnicy otrzymują materiały: checklisty WCAG, fragmenty kodu, prekonfigurowane repo z zadaniami, lista narzędzi.
- Opcja: przynieś fragment swojej strony — prowadzący zrobi demonstracyjny mini-audit i proponuje poprawki.
Trenerzy
- Senior UX Designer — projektowanie inkluzywne, prowadzenie warsztatów UX.
- Senior Front-end Engineer — ARIA, JS accessibility, integracja z CI/CD.
- Audytor dostępności — doświadczenie w audytach zgodności i raportach EAA/WAD.
Format, terminy, cena szkolenia
- Format: stacjonarnie (Kraków) lub online (na żywo, z przerwami, z dostępem do nagrania po szkoleniu).
- Czas: 2 dni (8:30–16:30).
- Liczba uczestników: 3-12 osób
- Catering i obiad: w cenie szkolenia
- Cena: pakiet podstawowy 2 dni
- 2400zł netto za osobę
- 5200 PLN netto za zespół 3 osób;
- większe zespoły / zamknięte terminy — indywidualna wycena
FAQ — Najczęściej zadawane pytania
Czy dwudniowe szkolenie wystarczy, żeby „być zgodnym z WCAG”?
Szkolenie daje kompetencje i roadmapę; rzeczywista zgodność wymaga wdrożenia w projektach, testów i ewentualnych poprawek kodu.
Jakie WCAG obowiązują?
Dzisiaj rekomendacją techniczną jest WCAG 2.2 (i wcześniejsze 2.1). Dla zrozumienia zmian i planowania prac szkolenie omawia konkretne SC 2.2.
Co z regulacjami prawnymi?
Omówimy polską ustawę o dostępności cyfrowej (2019) oraz dyrektywy i akty UE — Web Accessibility Directive i European Accessibility Act — plus praktyczne wskazówki dotyczące rynku USA (ADA / Section 508).
Przepisy krajowe / regionalne omawiane na szkoleniu
- Polska — Ustawa o dostępności cyfrowej stron i aplikacji (2019) — obowiązuje publiczne podmioty; standardy techniczne i wykonawcze w dokumentach resortowych.
- Unia Europejska — Web Accessibility Directive (public sector) + European Accessibility Act (szerszy zakres, obejmuje też komercyjne produkty i usługi) — terminy i wymagania wdrożeń omówione praktycznie.
- Stany Zjednoczone — ADA i Section 508: DOJ i agencje federalne odwołują się do WCAG jako benchmarku; istnieje wzrost wymagań prawnych i egzekucji (najlepiej traktować WCAG jako podstawę).
Zapisz siebie i swój zespół
Masz zespół, który tworzy nowoczesne, animowane i interaktywne strony? Zadbaj, żeby były dostępne i wolne od ryzyka.
[Zapisz zespół — Termin: najbliższy dostępny] [Poproś o ofertę dla firmy — wycena]
Kontakt: szkolenia@krakweb.pl • +48507595859