artykuł 3 wskazówki jak publikować dostępne treści

3 wskazówki jak publikować dostępne treści internetowe

Powszechnym, a zarazem błędnym przekonaniem jest, że za dostępnością stron internetowych stoją wyłącznie deweloperzy oraz projektanci, którzy realizują zlecenie. Redaktor przygotowujący artykuły i elementy treści ma duży wpływ na to, czy jego publikacje będą rzeczywiście dostępne.

W rzeczywistości autorzy redagujący treści witryny mają większy wpływ na dostępność całej witryny niż panujące wyobrażenie, że przecież od nich nic nie zależy. Wiele ogólnych zasad, których przestrzegają redaktorzy stron ma również swoje zastosowanie w technikach redagowania dostępnych materiałów. Są to przykładowo planowanie struktury strony, grupowanie tekstu w przejrzyste, spójne i logicznie uzasadnione bloki oraz dbałość o jasność języka i zrozumiałość przekazu. Te elementy to nie tylko najlepsze nawyki profesjonalnych redaktorów ale również niezbędne elementy publikowania dostępnych materiałów.

Nim jednak przejdziemy do tytułowych wskazówek o poprawie dostępności, należy odnotować fakt, że zrozumienie architektury strony i jej systemu CMS jest bardzo istotne podczas implementowania technik dostępności. Będąc świadomym tego, jak działa strona oraz jej system CMS łatwiej jest mieć kontrolę nad edycją poszczególnych elementów treści. Spokojnie! Nie chodzi nam tutaj o edukowanie redaktorów z zakresu kodowania i wdrażania witryn, a jedynie o dobre przyswojenie możliwości systemu CMS, który dostają od swojej agencji.

Naturalną rzeczą jest, że każdy CMS różni się od siebie i niektóre z pewnością nie umożliwiają redaktorom edycji pewnych elementów. Mowa tu szczególnie o małych, prywatnych systemach, które nie były projektowane z myślą o implementowaniu technik dostępności. Dlatego praca redaktora będzie miała sens wyłącznie wtedy, jeśli strona oraz jej środowisko edytorskie zostało przygotowane z myślą o dostępności.

Poniższe wskazówki wspierają postępowanie według wytycznych WCAG 2.0.

Nagłówki – definicja i struktura dla stron dostępnych

Nagłówki, tytuły artykułów i podtytuły to elementy nadające witrynie strukturę. Powszechnym błędem redaktorów nieprzywykłych do publikowania na potrzeby internetu jest postępowanie według zwykłych technik edytorskich. Dla swoich nagłówków po prostu stosują większy rozmiar tekstu oraz pogrubienie zamiast użyć elementu HTML. Oczywiście wygląd nagłówka <h> może być dowolnie edytowany, ale ważniejsze od wyglądu jest w tym momencie poinformowanie przeglądarki, że dany tekst jest elementem tytułowym.

Dlatego nie należy automatycznie kopiować większych bloków tekstu z edytorów typu MS Word, a dzielić tekst na bloki i zaznaczać, że dany element tekstowy jest nagłówkiem. Poniżej przykład z najbardziej popularnego CMS na świecie – WordPress:

obraz instruktażowy - element nagłówek

Słowem mówiąc, użycie narzędzi wizualnych, jak pogrubienie i powiększenie tekstu, daje zadowalający efekt dla oka, ale wyszukiwarki oraz co ważniejsze, osoby niewidome, używające czytników stron, będą interpretowały ten fragment jako zwykły tekst. Ponadto nie będą stanie znaleźć go w strukturze strony. Jeśli tekst w swojej strukturze nie miał przewidzianych nagłówków, należy zastosować przynajmniej jeden o wartości <h1>, który będzie elementem tytułowym dla danej podstrony.

Dla osób niewidomych jest to bardzo istotne ułatwienie w odbiorze strony, ponieważ:

  • Czytnik interpretuje ten element jako nagłówek.
  • Ułatwia korzystanie ze skrótów klawiszowych i obsługę strony za pomocą klawiatury. Na większości czytników komercyjnych, włączając w to popularne JAWS oraz NVDA, klawisz H oznacza skrót do nawigacji pomiędzy nagłówkami. Użytkownik może więc w czasie rzeczywistym poruszać się pomiędzy sekcjami całej witryny i publikacji.
  • Odpowiednia hierarchia nagłówków – od <h1> do <h6> pomaga w interpretacji ważności poszczególnych bloków tekstu. Jeśli tytuł całej strony lub publikacji to <h1> to następne podtytuły (drugie w hierarchii) powinny mieć znacznik <h2> i tak dalej w dół. Błędem, który jest zauważany przez niektóre walidatory dostępności jest mieszanie kolejności znaczników, np. <h1> dalej <h3> i dalej element teoretycznie ważniejszy – <h2>. Taka struktura nie jest logiczna.

Poniżej przykład poprawnej według wytycznych WCAG struktury nagłówków w tekście.

poprawna struktura nagłówków

Tytuły stron oraz podstron w strukturze witryny

W pierwszych słowach należy podkreślić fakt, że tytuł strony to zupełnie inny element niż nagłówek artykułu. Tytuł strony to nazwa wyświetlana przez wyszukiwarki i przeglądarkę internetową w tytule zakładki – stanowi więc element nadrzędny dla zawartości strony. Jest on „wykonywany” za pomocą znacznika <title> w języku HTML, jednakże redaktor zazwyczaj nie spotyka się z koniecznością znajomości tego znacznika. Podczas dodawania lub edycji strony znajdującej się w drzewie witryny jest to najczęściej pole: „Tytuł strony” lub „Nazwa strony” lub po prostu „Nazwa”.

Podobnie jak w przypadku nagłówków kluczową kwestią jest nadanie jasnego, zrozumiałego i prostego tytułu dla stron. Tytuł nie powinien być zbyt długi, ale powinien w sposób wystarczający informować o zawartości podstrony.

Dobrze skonstruowany tytuł niesie za sobą dwie podstawowe korzyści:

  • Umożliwia sprawną nawigację po witrynie osobie niewidomej, korzystającej z czytnika stron.
  • Jest interpretowany, wyświetlany i pozycjonowany przez wyszukiwarki internetowe takie jak Google, przyczynia się do lepszego indeksowania zawartości stron.

wizualizacja - tytuł strony w wyszukiwarce google

Dostępne odsyłacze wewnętrzne i zewnętrzne

„Więcej” oraz „Zobacz” – dwie frazy znane nam i jakże powszechne w internecie. Brzmi znajomo i na pierwszy rzut oka nie budzi wątpliwości, ale mając już wiedzę o tym, jak „widzą” strony osoby niepełnosprawne, zaczyna nam się budować obraz strony nie dającej się obsłużyć za pomocą czytnika.

O ile w elementach szablonu strony, jej mechanizmów, redaktor pozostaje bezradny (to projektant strony powinien przewidzieć mechanizm wyświetlania odnośników generowanych automatycznie), o tyle tworząc publikację ma już swoją rolę do odegrania.

Dobrą praktyką przy tworzeniu odsyłaczy jest uwzględnienie kilku aspektów, które wpływają na czytelność linku dla osoby niepełnosprawnej. Jeśli link jest zewnętrzny – prowadzi do strony, która otworzy się w nowej karcie – warto poinformować o tym użytkownika używającego czytnika stron. Będzie on wtedy przygotowany, że miejsce w które jest kierowany otworzy się w innym oknie i aby kontynuować pracę w miejscu, gdzie skończył przed kliknięciem, musi przełączyć się pomiędzy różnymi oknami. Warto również wspomnieć o osobach w pełni widomych, ale cierpiących na różnego rodzaju zaburzenia percepcji. Otwarcie strony w nowej karcie może spowodować u nich trudności w zrozumieniu tego procesu i uniemożliwić im powrót do źródła. Poniżej ilustrujemy przykład takiej informacji – zarówno dla osób niewidomych jak i tych z trudnościami poznawczymi.

wizualizacja jak wygląda link zewnętrzny

jak wygląda link łatwoczytalny