Skip to main content

Blog

dostępność cyfrowa

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

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.

Masz pytania?

Skontaktuj się z nami