Wróć do wszystkich kryteriów

1.2.2 Napisy (nagrane) (ang.) Captions (Prerecorded)

Specjalizacje:

  • Designer
  • Deweloper

Elementy:

  • Multimedia

Poziomy:

  • A

Spis treści

    Istota i cel kryterium

    Głównym celem tego kryterium sukcesu jest umożliwienie osobom niesłyszącym lub słabosłyszącym pełnego, samodzielnego odbioru nagranych wcześniej materiałów wideo zawierających dźwięk. Realizacja tej wytycznej polega na dostarczeniu dokładnego, tekstowego odzwierciedlenia ścieżki audio, które jest precyzyjnie zsynchronizowane w czasie z obrazem. Dzięki temu dajesz gwarancję, że kluczowe informacje przekazywane za pomocą dźwięku nie wykluczą cyfrowo odbiorców z dysfunkcjami słuchu.

    Pamiętaj, że napisy to nie jest wyłącznie suche, mechaniczne spisanie samych dialogów. Aby spełnić standardy dostępności, musisz zawrzeć w nich również jednoznaczną identyfikację osób wypowiadających się na ekranie oraz opisy istotnych dźwięków niewerbalnych. Efekty dźwiękowe, muzyka czy odgłosy tła budują nieoceniony kontekst całej sceny, bez którego przekaz dla wielu osób stanie się urwany lub całkowicie niezrozumiały.

    Definicja w j. angielskim

    Definicja dostępna pod adresem (link otworzy się w nowej karcie):
    https://www.w3.org/WAI/WCAG22/quickref/#captions-prerecorded

    Definicja w j. polskim

    Definicja dostępna pod adresem (link otworzy się w nowej karcie):
    https://www.w3.org/WAI/WCAG22/quickref/#captions-prerecorded

    Słownik pojęć

    Napisy rozszerzone (ang.) captions
    –

    zsynchronizowana wizualnie i tekstowo alternatywa dla informacji mówionych oraz dźwięków niewerbalnych, niezbędna do pełnego zrozumienia treści multimedialnych. Mogą przybrać formę napisów zamkniętych, włączanych przez użytkownika ((ang.) Closed Captions), bądź otwartych, czyli wbudowanych na stałe w obraz ((ang.) Open Captions).

    Alternatywa multimedialna dla tekstu (ang.) media alternative for text
    –

    multimedia, które prezentują dokładnie te same informacje, co tekst znajdujący się bezpośrednio na stronie, służące jako alternatywna forma zapoznania się z treścią.

    Materiały nagrane wcześniej (ang.) prerecorded media
    –

    treści multimedialne opublikowane i udostępnione użytkownikowi po ich uprzedniej rejestracji i montażu, w przeciwieństwie do transmisji realizowanych w czasie rzeczywistym.

    Media zsynchronizowane (ang.) synchronized media
    –

    ścieżka dźwiękowa (audio) lub obraz (wideo) połączone i skoordynowane w czasie z innym formatem prezentacji informacji lub z interaktywnymi komponentami czasowymi. To w praktyce klasyczny materiał wideo z dźwiękiem. Chodzi o sytuację, w której ścieżka audio (np. głos lektora, dialogi) jest ściśle połączona i skoordynowana w czasie z obrazem. To właśnie to połączenie sprawia, że kryterium 1.2.2 staje się aktywne (samo audio bez obrazu nie jest mediami zsynchronizowanymi).

    Wpływ na dostępność (Kogo wspierasz?)

    • Osoby znajdujące się w niesprzyjających warunkach środowiskowych: Umożliwiasz swobodną konsumpcję wideo w bibliotekach, głośnych środkach transportu publicznego, poczekalniach czy w biurach typu (ang.) open space bez konieczności używania słuchawek czy włączania głośników.
    • Osoby z zaburzeniami poznawczymi: Pomagasz im w lepszym skupieniu uwagi, procesowaniu i przyswajaniu skomplikowanego słownictwa oraz radzeniu sobie z dynamicznym, szybkim tempem wypowiedzi prelegenta. Tekst drastycznie zmniejsza zmęczenie psychiczne i eliminuje frustrację.
    • Osoby z problemami technicznymi lub awariami sprzętu: Zapewniasz niezawodne rozwiązanie awaryjne w sytuacjach, gdy użytkownik ma uszkodzone głośniki, niskiej jakości słuchawki lub gdy plik audio zawiera silne, trudne do odfiltrowania szumy otoczenia.
    • Osoby niesłyszące i słabosłyszące: Dla tej grupy napisy stanowią absolutny fundament percepcji treści multimedialnych. Bez nich wszelkie komunikaty werbalne oraz emocjonalne zawarte w filmie stają się dla nich w stu procentach niedostępne.
    • Osoby uczące się języka obcego: Wspierasz proces nauki, ortografię i lepsze zrozumienie kontekstu sytuacyjnego poprzez jednoczesną stymulację słuchową oraz czytanie prawidłowo zapisanego tekstu.

    Dlaczego to jest ważne? (Wpływ na dostępność)

    Zapewnienie napisów do nagranych wcześniej treści wideo ma kluczowe znaczenie dla wielu grup użytkowników:

    • Osoby niesłyszące i słabosłyszące: Dla tej grupy napisy są podstawową formą dostępu do treści audio. Bez nich informacje przekazywane werbalnie byłyby całkowicie niedostępne.
    • Osoby z zaburzeniami poznawczymi: Napisy mogą pomóc w lepszym zrozumieniu i przetworzeniu informacji, zwłaszcza gdy mowa jest szybka lub używane jest skomplikowane słownictwo. Mogą również wspomagać koncentrację.
    • Osoby uczące się języka: Napisy w języku obcym mogą wspierać naukę i rozumienie, pozwalając na jednoczesne słyszenie i czytanie słów.
    • Osoby znajdujące się w trudnych warunkach: W miejscach publicznych, w głośnym otoczeniu lub w sytuacjach wymagających ciszy (np. w bibliotece, pracy), napisy umożliwiają konsumpcję treści wideo bez konieczności odtwarzania dźwięku.
    • Osoby z problemami technicznymi: Czasami słabej jakości dźwięk, szumy, czy problemy ze sprzętem audio mogą utrudniać zrozumienie. Napisy stanowią awaryjne rozwiązanie.

    Zasady wdrażania i wymagania techniczne

    • Zaimplementuj standard HTML5: Wykorzystaj natywny znacznik <video> i zagnieźdź w nim element <track> z odpowiednio skonfigurowanymi atrybutami, w tym kind="captions". Pozwala to przeglądarkom oraz technologiom wspomagającym na sprawne i poprawne zarządzanie wyświetlaniem napisów.
    • Identyfikuj mówców: W sytuacjach, gdy na nagraniu wypowiada się kilka osób, a ich tożsamość nie wynika bezpośrednio z kadru, zawsze wyraźnie wskaż, kto aktualnie zabiera głos.
    • Zapewnij perfekcyjną synchronizację: Dopilnuj, aby tekst pojawiał się i znikał z ekranu dokładnie w tym samym momencie, w którym dane słowa są wypowiadane lub gdy pojawia się istotny dźwięk. Jakiekolwiek opóźnienia i przesunięcia czasowe niszczą komfort odbioru.
    • Stosuj opisy dźwięków niewerbalnych: Wszystkie kluczowe dla kontekstu efekty dźwiękowe (np. wycie syreny alarmowej, trzaśnięcie drzwiami, głośny śmiech publiczności) umieszczaj konsekwentnie w nawiasach okrągłych lub kwadratowych.
    • Dbaj o wysoką jakość językową: Twórz napisy poprawne pod kątem ortograficznym i gramatycznym. Dbaj, aby były one wierną transkrypcją ścieżki dźwiękowej i charakteryzowały się naturalnym podziałem fraz.
    • Wybieraj odpowiednie formaty plików: Opieraj się na powszechnie akceptowanych formatach, takich jak WebVTT (.vtt) – który jest natywnie wspierany przez standard HTML5 – lub format SRT (.srt).

    Wyjątki i sytuacje szczególne

    Wytyczna ta przewiduje jeden kluczowy wyjątek od reguły. Nie masz prawnego ani technicznego obowiązku dostarczania napisów rozszerzonych, jeśli Twoje media zsynchronizowane stanowią wyłącznie alternatywną wersję prezentacji informacji, które zostały już w pełni przedstawione w formie czystego tekstu bezpośrednio na tej samej stronie internetowej (np. wideo będące wyłącznie dokładnym, dosłownym odczytaniem opublikowanego wcześniej artykułu blogowego).

    Pamiętaj jednak, że taki materiał multimedialny musi zostać przez Ciebie jednoznacznie, wyraźnie i widocznie oznaczony jako alternatywa tekstowa, aby użytkownicy oraz audytorzy od razu wiedzieli, że oryginalna, w pełni dostępna treść znajduje się tuż obok w tekście głównym.

    Przykłady implementacji

    Najczęstsze błędy (Failures)

    • F8: Tworzenie napisów szczątkowych lub niekompletnych, które ignorują ważne wypowiedzi bohaterów lub odgłosy tła determinujące atmosferę i kontekst filmu.
    • F74: Zaniedbanie polegające na nieoznaczeniu wideo, które pełni funkcję pomocniczą dla istniejącego tekstu, co wprowadza użytkowników technologii wspomagających w poważny błąd.
    • F75: Sytuacja, w której film zawiera unikalne, niedostępne nigdzie indziej w tekście komunikaty dźwiękowe, a projektant całkowicie rezygnuje z dodania ścieżki tekstowej.
    • Brak możliwości sterowania napisami przez użytkownika: Stosowanie napisów wbudowanych na stałe bezpośrednio w warstwę obrazu wideo ((ang.) hardcoded captions) bez udostępnienia użytkownikowi opcji ich wyłączenia, powiększenia czcionki czy dostosowania kontrastu.
    • Zignorowanie czytelności wizualnej: Serwowanie napisów o zbyt małym rozmiarze pisma, drastycznie słabym kontraście z tłem odtwarzanego filmu lub ze zbyt dużą liczbą znaków upakowanych w pojedynczej linii tekstu.
    • Zależność od automatyzacji bez ludzkiej weryfikacji: Bezkrytyczne publikowanie napisów wygenerowanych automatycznie przez algorytmy (np. systemy automatycznego rozpoznawania mowy na platformach społecznościowych), co nagminnie skutkuje błędami ortograficznymi, brakiem interpunkcji i chaosem znaczeniowym.
    • Całkowity brak napisów: Najbardziej rażące i bezkompromisowe uchybienie, polegające na udostępnieniu nagranych materiałów audiowizualnych z dźwiękiem bez jakiejkolwiek formy tekstowej.
    • Zaburzenia synchronizacji czasowej: Dopuszczanie do sytuacji, w których napisy drastycznie spóźniają się względem fonii, znikają zbyt szybko przed możliwością ich przeczytania lub pojawiają się na ekranie za wcześnie.

    Najlepsze praktyki

    • Udostępniaj pełne transkrypcje tekstowe: Obok napisów zsynchronizowanych udostępniaj pełny zapis tekstowy audio-wideo na oddzielnej podstronie lub w osobnym pliku do pobrania. Pomaga to osobom preferującym czytanie w indywidualnym tempie oraz tym, którzy mają trudności z jednoczesnym śledzeniem dynamicznego obrazu i tekstu na dole ekranu.
    • Wdrażaj zaawansowaną personalizację: Jeżeli tworzysz lub konfigurujesz niestandardowy, autorski odtwarzacz wideo, dodaj funkcje pozwalające użytkownikowi końcowemu na swobodną modyfikację kroju, wielkości i koloru czcionki oraz przezroczystości i koloru tła pod wyświetlanymi napisami.
    • Testuj responsywność na urządzeniach mobilnych: Bezwzględnie weryfikuj, jak napisy układają się na mniejszych ekranach smartfonów i tabletów zarówno w pionie, jak i poziomie. Upewnij się, że tekst nie zasłania ważnych kontrolek interfejsu (np. przycisku pauzy czy paska postępu).
    • Zapewnij wsparcie dla wielu języków: Jeśli Twoje multimedia kierowane są do międzynarodowej społeczności, przygotuj, przetestuj i zaimplementuj ścieżki z napisami rozszerzonymi w kilku najpopularniejszych wersjach językowych.
    • Traktuj automatyzację wyłącznie jako surowy szkic: Zawsze poddawaj automatycznie wygenerowane napisy rygorystycznej, ręcznej korekcie człowieka przed ich ostatecznym zatwierdzeniem i wdrożeniem na produkcję.

    Metody testowania

    • Testowanie manualne: Całkowicie wycisz dźwięk w przeglądarce lub odłącz głośniki. Obejrzyj cały materiał wideo od początku do końca. Oceń obiektywnie, czy napisy wyświetlają się synchronicznie z wypowiedziami, czy precyzyjnie identyfikują osoby mówiące oraz czy jesteś w stanie w pełni zrozumieć cały kontekst sytuacyjny, emocjonalny i merytoryczną treść filmu wyłącznie na podstawie wyświetlanego tekstu.
    • Narzędzie deweloperskie (ang.) Developer Tools: Zbadaj strukturę kodu w drzewie (ang.) DOM strony internetowej. Upewnij się, że wewnątrz elementu <video> znajduje się prawidłowo zaimplementowany znacznik <track> z poprawnie zdefiniowanym atrybutem kind="captions", prawidłową ścieżką źródłową w src, kodem języka w srclang oraz czytelną dla człowieka etykietą tekstową w label.
    • (ang.) IBM Equal Access Toolkit: Wykorzystaj to zaawansowane narzędzie do przeprowadzenia audytu technicznego. Sprawdź, czy dynamicznie ładowane napisy oraz zmiany stanów odtwarzacza multimedialnego są poprawnie rejestrowane przez drzewo dostępności i nie generują błędów strukturalnych.
    • NVDA: Uruchom czytnik ekranu i przetestuj interfejs odtwarzacza. Zweryfikuj, czy etykiety przycisków służących do włączania, wyłączania i wyboru napisów są w pełni zrozumiałe i bez przeszkód dostępne z poziomu samej klawiatury dla osób niewidomych.

    Sprawdź swoją wiedzę

    W linku poniżej znajduje się 6 modułów z tym samym, krótkim materiałem wideo (nagrany wcześniej odcinek podcastu, w którym wypowiadają się dwie osoby na tle muzyki gitarowej). Twoim zadaniem jest ocenić, czy każdy wariant zapewnia osobom niesłyszącym pełnowartościowe napisy rozszerzone – albo czy legalnie korzysta z wyjątku przewidzianego w kryterium.

    Jak to sprawdzić?

    1. Wycisz dźwięk (lub odłącz słuchawki), włącz napisy w odtwarzaczu (przycisk „CC” / ikona napisów) i obejrzyj nagranie od początku do końca. Oceń, czy rozumiesz pełny kontekst wyłącznie z tekstu.
    2. Sprawdź kompletność: czy napisy identyfikują osoby mówiące i opisują istotne dźwięki niewerbalne (muzyka, efekty), czy pomijają całe wypowiedzi?
    3. Włącz dźwięk i zweryfikuj synchronizację: czy tekst pojawia się dokładnie wtedy, gdy padają słowa?
    4. W DevTools sprawdź, czy wewnątrz <video> znajduje się <track kind="captions"> z poprawnymi atrybutami src, srclang i label.
    5. Pamiętaj o wyjątku: wideo będące wyraźnie oznaczoną alternatywą dla tekstu obecnego na tej samej stronie nie wymaga napisów.

    Notatka: Zanim zajrzysz do rozwiązania, przetestuj i zapisz swoje wnioski na kartce.
    Proponowane narzędzia: Wyciszenie dźwięku, Narzędzie deweloperskie (ang.) Developer Tools

    Link: https://pdc.ambiscale.com/training/wcag-1-2-2/

    #1 BŁĄD

    Problem: Nagranie wideo zawiera ścieżkę dialogową i muzykę, ale nie posiada jakiejkolwiek formy napisów (w kodzie brak elementu <track>), a na stronie nie ma tekstu przekazującego tę samą treść.
    Dlaczego: To najbardziej rażące uchybienie – całkowity brak napisów. Film prezentuje informacje, których nie ma nigdzie indziej na stronie, więc zachodzi technika niepowodzenia F75. Dla osoby niesłyszącej cała warstwa werbalna materiału jest w stu procentach niedostępna.
    Naprawa: Dodaj do elementu <video> znacznik <track kind="captions" src="napisy.vtt" srclang="pl" label="Polski" default> z pełnymi napisami rozszerzonymi (jak w przykładzie #2).

    #2 DOBRZE

    Dlaczego: Do wideo dołączono zsynchronizowaną ścieżkę napisów rozszerzonych (<track kind="captions"> z plikiem WebVTT), która spełnia wszystkie wymogi jakościowe:

    • identyfikuje mówców („[Prowadzący]:”, „[Prowadząca]:”) – wiadomo, kto zabiera głos,
    • opisuje dźwięki niewerbalne w nawiasach kwadratowych (intro i outro muzyczne) – osoba niesłysząca zna pełny kontekst i nastrój sceny,
    • tekst pojawia się dokładnie w momencie wypowiedzi (perfekcyjna synchronizacja),
    • są to napisy zamknięte (Closed Captions) – użytkownik może je włączać i wyłączać przyciskiem „CC”, a dostępny odtwarzacz AblePlayer pozwala dodatkowo dostosować ich krój, rozmiar, kolory i tło w ustawieniach napisów.

    #3 BŁĄD

    Problem: Napisy są szczątkowe: zawierają wyłącznie pierwszą wypowiedź, bez wskazania autora. Pominięto całą wypowiedź Prowadzącej oraz wszystkie dźwięki niewerbalne (intro, outro).
    Dlaczego: To technika niepowodzenia F8 – napisy ignorujące ważne wypowiedzi bohaterów lub odgłosy tła. Osoba niesłysząca widzi jedno zdanie i długą „ciszę”, podczas gdy w nagraniu pada druga, kluczowa wypowiedź. Przekaz staje się urwany i niekompletny, mimo że przycisk „CC” działa.
    Naprawa: Uzupełnij plik VTT o wszystkie wypowiedzi, identyfikację mówców oraz opisy istotnych dźwięków w nawiasach kwadratowych.

    #4 BŁĄD

    Problem: Napisy są kompletne treściowo, ale ich znaczniki czasu są przesunięte o kilka sekund względem fonii – tekst intro pojawia się, gdy trwa już rozmowa, a wypowiedź Prowadzącej ledwo mignie na samym końcu nagrania.
    Dlaczego: Kryterium wymaga, aby napisy były precyzyjnie zsynchronizowane w czasie z materiałem. Zaburzenia synchronizacji (opóźnienia, wyprzedzanie, znikanie tekstu przed przeczytaniem) uniemożliwiają powiązanie tekstu z właściwą wypowiedzią i osobą – odbiorca nie wie, kto i kiedy wypowiada widoczne słowa.
    Naprawa: Popraw znaczniki czasu w pliku VTT tak, aby każda porcja tekstu pojawiała się dokładnie w chwili wypowiedzi, i przetestuj cały materiał z włączonym dźwiękiem przed publikacją.

    #5 DOBRZE

    Dlaczego: Wideo nie posiada napisów, ale korzysta z jedynego wyjątku przewidzianego w kryterium 1.2.2: jest alternatywą multimedialną dla tekstu. Pełna treść odcinka znajduje się w artykule bezpośrednio na stronie, a nagranie zostało wyraźnie i widocznie oznaczone jako wersja wideo tego tekstu – zarówno wizualnie (niebieska etykieta), jak i programowo (aria-describedby wskazujące na etykietę). Użytkownik i audytor od razu wiedzą, że oryginalna, w pełni dostępna treść jest tuż obok.

    #6 BŁĄD

    Problem: Treść nagrania faktycznie jest opisana we wpisie blogowym, ale wideo bez napisów nie zostało w żaden sposób oznaczone jako alternatywa dla tego tekstu – nic (ani wizualnie, ani programowo) nie wiąże nagrania z treścią wpisu.
    Dlaczego: To technika niepowodzenia F74 – nieoznaczenie zsynchronizowanej alternatywy multimedialnej dla tekstu. Bez wyraźnej etykiety wyjątek z kryterium 1.2.2 nie ma zastosowania: użytkownik (zwłaszcza korzystający z technologii wspomagających) traktuje wideo jako samodzielną treść i nie wie, że pełna wersja znajduje się w tekście obok. Materiał bez napisów pozostaje więc niezgodny.
    Naprawa: Dodaj widoczną etykietę typu „Wersja wideo – alternatywa dla powyższego tekstu” powiązaną z odtwarzaczem przez aria-describedby (jak w przykładzie #5) albo po prostu dołącz pełne napisy rozszerzone.

    Źródła

    Dodatkowe linki

     

    Wróć do wszystkich kryteriów