Dostępna tabela jasno pokazuje, które dane należą do danego wiersza i kolumny. Żeby osoby korzystające z czytników ekranu mogły zrozumieć te relacje, oznacz nagłówki programowo, nadaj tabeli zrozumiały tytuł i zachowaj prostą strukturę. Pamiętaj też o czytelności na małym ekranie.
Najważniejsze zasady są proste:
- używaj tabel wyłącznie do prezentowania danych w układzie wierszy i kolumn;
- oznacz nagłówki komórkami <th>, a dane komórkami <td>;
- nadaj tabeli krótki podpis wyjaśniający, czego dotyczą dane;
- nie scalaj komórek, jeśli można przebudować dane w prostszy sposób;
- nie przekazuj informacji wyłącznie kolorem, pogrubieniem ani położeniem wizualnym;
- sprawdź działanie tabeli na telefonie i z czytnikiem ekranu.
Podobne zalecenia znajdziesz w materiałach polskiego Ministerstwa Cyfryzacji, brytyjskiego Home Office oraz amerykańskiego Section 508.
Tabela czy lista? Wybierz właściwy format
Tabela sprawdza się wtedy, gdy użytkownik musi porównywać dane według wspólnych kategorii, na przykład ceny kilku usług, wyniki za kolejne miesiące albo terminy dla różnych grup. Jeśli każda pozycja jest samodzielna, łatwiejsza może być lista z nagłówkami.
Nie używaj tabeli do ustawiania elementów strony, wyrównywania kolumn tekstu ani tworzenia układu formularza. HTML udostępnia do tego inne mechanizmy. Tabela układowa może sprawić, że czytnik ekranu będzie odczytywał tekst jako powiązane dane tabelaryczne, mimo że takiego związku nie ma.
Brytyjski Home Office zaleca semantyczny znacznik tabeli dla danych i odradza używanie tabel do układu strony. GOV.UK podpowiada również, by bardzo dużą tabelę podzielić na mniejsze lub udostępnić dane jako arkusz. Wytyczne publikowania tabel na GOV.UK pomagają ocenić, kiedy tabela przestaje być czytelna.
Dodaj zrozumiały tytuł tabeli
Podpis tabeli, czyli element <caption>, mówi użytkownikowi, jakich danych dotyczy zestawienie. Umieść go na początku elementu <table>. Tytuł powinien być konkretny, na przykład „Godziny otwarcia punktów obsługi w 2026 roku”, a nie tylko „Tabela 1”.
Podpis jest szczególnie pomocny, gdy na stronie znajduje się kilka tabel albo użytkownik nawigujący czytnikiem przeskakuje między nimi. Krótki wstęp w zwykłym tekście przed tabelą może dodatkowo wyjaśnić, dlaczego dane są ważne, ale nie musi powtarzać podpisu.
Oznacz nagłówki wierszy i kolumn
Pierwszy wiersz z nazwami kolumn oznacz znacznikami <th>. Warto dodać atrybut scope="col", aby relacja nagłówka do kolumny była jawna. Jeżeli pierwsza komórka w każdym wierszu nazywa daną pozycję, użyj dla niej <th scope="row">. Pozostałe komórki oznacz jako <td>.
Przykład prostej dostępnej tabeli HTML:
<table>
<caption>Godziny otwarcia punktów obsługi</caption>
<thead>
<tr>
<th scope="col">Punkt</th>
<th scope="col">Poniedziałek</th>
<th scope="col">Wtorek</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">Centrum</th>
<td>8:00–16:00</td>
<td>9:00–17:00</td>
</tr>
<tr>
<th scope="row">Północ</th>
<td>7:00–15:00</td>
<td>7:00–15:00</td>
</tr>
</tbody>
</table>
Gdy osoba porusza się po komórkach, technologia asystująca może odczytać zarówno wartość, jak i powiązany nagłówek. Samo pogrubienie tekstu albo kolor tła nie oznacza programowo, że dana komórka jest nagłówkiem.
Utrzymuj prostą strukturę
Najłatwiejsze do odczytania są tabele z jednym wierszem nagłówków i opcjonalnym nagłówkiem w pierwszej kolumnie. Unikaj:
- scalonych i podzielonych komórek;
- kilku poziomów nagłówków, jeśli dane da się pokazać w prostszy sposób;
- pustych wierszy i kolumn używanych do robienia odstępów;
- zagnieżdżania jednej tabeli w drugiej;
- bardzo szerokich tabel z długimi akapitami w komórkach;
- skrótów, których czytelnik nie zna, i nieobjaśnionych symboli.
Jeśli tabela ma kilka grup danych, rozważ rozbicie jej na osobne, mniejsze zestawienia. W złożonej tabeli HTML nagłówki można wiązać z komórkami przez atrybuty id i headers, ale wymaga to starannego wdrożenia i kontroli z czytnikiem ekranu. Zgodnie z brytyjskimi wytycznymi Home Office lepiej unikać złożonych tabel, jeśli można przedstawić te same informacje prościej.
Zadbaj o czytelność i znaczenie danych
Nagłówki powinny jasno nazywać zawartość kolumny lub wiersza. Zamiast „Wynik” użyj „Liczba zgłoszeń w czerwcu”, jeśli to właśnie oznacza kolumna. Podaj jednostki, walutę, okres oraz wyjaśnienie symboli. Dla wartości liczbowych stosuj spójny format, aby łatwo można je było porównać.
Nie oznaczaj statusu wyłącznie kolorem, na przykład czerwonym i zielonym tłem. Dodaj słowną etykietę: „Wymaga poprawy”, „Zgodny” albo „Brak danych”. Zadbaj o kontrast tekstu, odpowiedni rozmiar czcionki i możliwość powiększenia. Na telefonie tabela może wymagać poziomego przewijania; użytkownik powinien móc przewinąć ją bez przesuwania całej strony i bez utraty kontekstu nagłówków.
Jak przygotować dostępną tabelę w Wordzie?
W dokumencie Word wstaw tabelę narzędziem „Wstaw tabelę”, zamiast rysować ją ręcznie albo układać treść spacjami. Oznacz pierwszy wiersz jako nagłówkowy i wpisz w nim konkretne nazwy kolumn. Jeśli tabela przechodzi na kolejną stronę, ustaw powtarzanie wiersza nagłówka.
Unikaj scalania komórek i pustych wierszy służących do formatowania. Dodaj podpis, jeśli ułatwi odnalezienie i zrozumienie tabeli, a potem sprawdź odczyt kolejnych komórek klawiszem Tab. Section 508 podaje instrukcje dla tabel w Wordzie, Excelu, PowerPoincie i PDF.
Jak przygotować dostępną tabelę w Excelu?
W Excelu zaznacz dane i utwórz tabelę za pomocą wbudowanej funkcji „Tabela”. Potwierdź, że zakres zawiera nagłówki, nazwij kolumny i unikaj pustych komórek w nagłówkach. Każdą tabelę w arkuszu nazwij jednoznacznie, a arkusz opisz tak, by było wiadomo, co zawiera.
Nie używaj scalonych komórek do uzyskania efektu wizualnego i nie polegaj na kolorach jako jedynym sposobie wskazywania statusu. Uruchom wbudowany moduł sprawdzania ułatwień dostępu, ale jego wynik uzupełnij ręcznym sprawdzeniem struktury oraz kolejności czytania.
Jak przenieść tabelę do PDF?
Najlepiej przygotować i sprawdzić tabelę w Wordzie lub Excelu, a następnie wyeksportować plik do otagowanego PDF. Nie twórz PDF przez drukowanie do pliku, jeśli ten sposób usuwa strukturę dokumentu. W programie do kontroli PDF sprawdź, czy tabela ma znaczniki nagłówków i komórek danych oraz czy każdy wynik jest powiązany z właściwym nagłówkiem.
Przy złożonych tabelach w PDF samo wizualne podobieństwo do dokumentu źródłowego nie gwarantuje, że czytnik ekranu prawidłowo odczyta relacje. Amerykańskie wytyczne Section 508 zalecają kontrolę tagów i powiązań nagłówków, a także używanie prostszej struktury, gdy to możliwe.
Lista kontrolna dostępnej tabeli
Przed publikacją sprawdź:
- Czy tabela prezentuje dane, a nie układ strony?
- Czy ma zrozumiały podpis lub kontekstowy tytuł?
- Czy nagłówki są oznaczone jako nagłówki, a nie tylko pogrubione?
- Czy wiadomo, do jakiego wiersza albo kolumny odnosi się każda wartość?
- Czy można usunąć scalone komórki i uprościć strukturę?
- Czy jednostki, skróty, symbole i kolory są wyjaśnione?
- Czy tabela działa po powiększeniu i na wąskim ekranie?
- Czy można przejść przez komórki klawiaturą i zrozumieć je przy użyciu czytnika ekranu?
Najczęstsze pytania
Czy każda tabela musi mieć podpis caption?
Warto go dodawać, szczególnie gdy tabela ma własny temat albo na stronie znajduje się więcej zestawień. Zwięzły podpis pozwala zrozumieć cel tabeli bez czytania całego tekstu strony.
Czy można scalać komórki w dostępnej tabeli?
Lepiej tego unikać. Scalenia komplikują nawigację i przypisywanie wartości do nagłówków. Jeśli tabela wymaga wielu poziomów nagłówków, sprawdź, czy nie da się rozdzielić jej na prostsze tabele lub listy.
Czy tabela powinna przewijać się poziomo na telefonie?
Może, jeśli szerokość danych nie pozwala zachować czytelnego układu. Ogranicz przewijanie do obszaru tabeli, zachowaj widoczny kontekst i nie zmniejszaj tekstu do nieczytelnego rozmiaru.
Przykład prostej tabeli HTML
Użyj podpisu tabeli i oznacz nagłówki. scope określa, czy komórka nagłówkowa opisuje kolumnę, czy wiersz.
<table>
<caption>Godziny pracy punktu konsultacyjnego</caption>
<thead>
<tr><th scope="col">Dzień</th><th scope="col">Godziny</th></tr>
</thead>
<tbody>
<tr><th scope="row">Wtorek</th><td>9:00–15:00</td></tr>
<tr><th scope="row">Czwartek</th><td>11:00–17:00</td></tr>
</tbody>
</table>
Nie używaj tabel do układania elementów strony. Przy złożonych tabelach z wielopoziomowymi nagłówkami potrzebne są jawne powiązania komórek, a nie tylko wizualne formatowanie.
Podsumowanie
Dostępne tabele są semantyczne, mają opisowe nagłówki i prostą strukturę. W HTML oznacz nagłówki przez <th>, powiąż je z wierszami lub kolumnami i dodaj podpis. W dokumentach korzystaj z funkcji tabel wbudowanych w Worda i Excela, a po eksporcie sprawdź tagi w PDF. Jeśli zestawienie jest trudne do uproszczenia, rozważ alternatywną prezentację danych.
Stan informacji: 1 października 2026 r.