Blog
Strona zgodna z WCAG w praktyce – co musi zawierać witryna przychodni lub szpitala?

Dostępność cyfrowa to obecnie nie tylko kwestia dobrych praktyk, lecz obowiązek prawny dla placówek medycznych. Każda przychodnia, szpital czy poradnia specjalistyczna – jako podmiot publiczny – musi dostosować swoją stronę internetową do wymagań standardu WCAG 2.1 na poziomie AA. Co to jednak oznacza w praktyce? Jakie elementy powinna zawierać strona internetowa przychodni, aby była funkcjonalna, czytelna i dostępna dla każdego pacjenta, również tego z niepełnosprawnością?
Nowoczesna i dostępna strona WCAG 2.1 placówki medycznej
Poniżej przedstawiamy konkretne wytyczne i rozwiązania, które powinna uwzględniać każda nowoczesna i dostępna strona WCAG 2.1 placówki medycznej.
1. Wysoki kontrast między tekstem a tłem
Dla osób niedowidzących lub starszych kontrast to jeden z kluczowych aspektów czytelności. WCAG 2.1 wymaga, by kontrast tekstu względem tła wynosił co najmniej 4.5:1. Oznacza to unikanie jasnoszarego tekstu na białym tle czy pastelowych odcieni o niskim nasyceniu.
Dobre praktyki:
-
Ciemny tekst na jasnym tle lub odwrotnie.
-
Unikanie tekstów w grafikach, chyba że są wystarczająco duże i kontrastowe.
2. Możliwość powiększenia tekstu (minimum 200%)
Strona musi umożliwiać powiększenie treści nawet do 200% bez utraty funkcjonalności – tak, aby osoby słabowidzące mogły łatwo przeczytać komunikaty czy opisy badań.
Dobre praktyki:
-
Tekst skalowalny w przeglądarce bez „rozjeżdżania się” layoutu.
-
Brak tekstów osadzonych w grafikach (których nie można powiększyć).
3. Nawigacja bez użycia myszy
Strona powinna być w pełni obsługiwana przy użyciu klawiatury. Dotyczy to nie tylko poruszania się po menu, ale również wypełniania formularzy czy uruchamiania multimediów.
Dobre praktyki:
-
Widoczny fokus (podświetlenie aktywnego elementu).
-
Logiczna kolejność przechodzenia między elementami (tabulacja).
-
Brak pułapek klawiaturowych (elementów, z których nie można wyjść bez myszy).
4. Tekst alternatywny dla obrazów
Każdy obraz – od zdjęcia lekarza po ikonę kontaktu – powinien mieć opis alternatywny (atrybut alt
). To kluczowe dla użytkowników korzystających z czytników ekranu.
Dobre praktyki:
-
Opis tego, co znajduje się na obrazku, np. „Dr Anna Kowalska – kardiolog”.
-
Pominięcie altów w przypadku grafik czysto dekoracyjnych (poprawne użycie
role="presentation"
).
5. Jasne etykiety linków i przycisków
Użytkownik musi rozumieć, dokąd prowadzi dany link czy co zrobi kliknięcie przycisku. Zamiast „kliknij tutaj”, lepiej napisać „Umów wizytę online”.
Dobre praktyki:
-
Linki zawierają kontekst („Sprawdź godziny przyjęć”, „Pobierz skierowanie PDF”).
-
Przycisk „Wyślij” opisany pełnym zdaniem, np. „Wyślij formularz kontaktowy”.
6. Multimedia z napisami i audiodeskrypcją
Filmy lub animacje edukacyjne muszą być dostępne dla osób niesłyszących i niewidomych – czyli mieć napisy, transkrypcję lub audiodeskrypcję.
Dobre praktyki:
-
Napisy osadzone na stałe lub możliwe do włączenia.
-
Audiodeskrypcja: dodatkowy komentarz lektora opisujący to, co dzieje się na ekranie.
-
Możliwość zatrzymania i wyciszenia wideo.
7. Struktura nagłówków i hierarchia treści
Strona powinna być uporządkowana semantycznie – nagłówki H1, H2, H3 itd. Nie chodzi o sam wygląd, ale o logiczne oznaczenie treści, które rozumieją czytniki ekranowe.
Dobre praktyki:
-
Jeden H1 na stronie (np. „Przychodnia Zdrowie Plus”).
-
Sekcje typu „O nas”, „Oferta”, „Rejestracja” jako H2.
-
Podsekcje i szczegóły jako H3, H4 itd.
8. Formularze dostępne i opisane
Wiele placówek oferuje rejestrację online. Formularze muszą być dostępne, tzn. opisane labelami, z komunikatami o błędach i podpowiedziami.
Dobre praktyki:
-
Każde pole ma nazwę (
label for="input"
). -
Informacja o błędzie (np. brak numeru PESEL) wyświetla się w czytelny sposób.
-
Możliwość obsługi za pomocą klawiatury.
9. Oznaczenie języka strony (lang="pl")
Dla czytników ekranowych kluczowe jest, by strona miała oznaczony język. Dzięki temu tekst czytany jest poprawną wymową i akcentem.
Dobre praktyki:
-
<html lang="pl">
– umieszczone na poziomie całej strony. -
W przypadku fragmentów w innym języku (np. angielskie terminy medyczne) – użycie
lang="en"
.
10. Deklaracja dostępności
Deklaracja dostępności to element wymagany przez polskie prawo – deklaracja informująca o stanie dostępności strony, zawierająca dane kontaktowe i sposób zgłaszania problemów.
Dobre praktyki:
-
Umieszczona w widocznym miejscu (stopka strony).
-
Aktualizowana co najmniej raz w roku.
-
Zawiera opcję kontaktu alternatywnego (np. telefon lub pomoc tłumacza PJM).
Strona WCAG — główne narzędzie kontaktu z pacjentem
Strona internetowa przychodni lub szpitala to dziś jedno z głównych narzędzi kontaktu z pacjentem. Jej dostępność cyfrowa to nie tylko wymóg formalny, ale także wyraz szacunku wobec każdego użytkownika – niezależnie od jego możliwości. Dostosowanie strony do standardu WCAG 2.1 to inwestycja w jakość usług medycznych i budowanie prawdziwie inkluzywnego systemu opieki zdrowotnej.