Objaśnienie KS 1.3.1:Informacje i relacje (Poziom A)
W skrócie
- Cel
- Informacje o strukturze treści są dostępne dla większej liczby osób
- Zadanie twórcy
- Użyj kodu, aby wzmocnić relacje i informacje przekazywane w prezentacji
Intencja
Intencją tego kryterium sukcesu jest zapewnienie, że informacje i relacje, które wynikają z formatowania wizualnego lub dźwiękowego, zostaną zachowane, gdy zmieni się forma prezentacji. Na przykład forma prezentacji zmienia się, gdy treść jest odczytywana przez czytnik ekranu lub gdy arkusz stylów użytkownika zastępuje arkusz stylów dostarczony przez autora.
Osoby, które widzą, postrzegają strukturę i relacje za pomocą różnych wskazówek wizualnych — nagłówki są często pisane większą, pogrubioną czcionką i są oddzielone od akapitów pustymi liniami; elementy listy są poprzedzone punktorem i często mają wcięcie; akapity oddzielone są pustą linią; elementy, które mają wspólną cechę, są zorganizowane w wiersze i kolumny tabeli; pola formularzy mogą być ułożone jako grupy, które mają wspólne etykiety tekstowe; do wskazania, że kilka elementów jest ze sobą powiązanych, może być użyty inny kolor tła; słowa, które mają specjalny status, oznacza się poprzez zmianę rodziny czcionek, pogrubienie, kursywę lub podkreślenie; elementy, które mają wspólną cechę, są zorganizowane w tabelę, w której do zrozumienia niezbędne są powiązania komórek dzielących ten sam wiersz lub kolumnę oraz powiązania każdej komórki z jej nagłówkiem wiersza i kolumny; i tak dalej. Dzięki temu, że te struktury i relacje są programowo określone lub dostępne w tekście, informacje ważne dla zrozumienia będą widoczne dla wszystkich..
Mogą być również używane sygnały dźwiękowe. Na przykład dzwonek może wskazywać początek nowej sekcji; zmiana wysokości głosu lub tempa mowy może być wykorzystana do podkreślenia ważnych informacji lub wskazania cytowanego tekstu; itp.
Gdy takie relacje są dostrzegalne dla jednej grupy użytkowników, można sprawić, że będą one dostrzegalne dla wszystkich. Jedną z metod ustalenia, czy informacje zostały prawidłowo dostarczone wszystkim użytkownikom, jest dostęp szeregowy do informacji w różnych modalnościach.
Jeśli łącza do pozycji słownika są wdrożone za pomocą elementów zakotwiczenia (lub odpowiedniego elementu łącza dla używanej technologii) i są identyfikowane przy użyciu innego kroju czcionki, użytkownik czytnika ekranu usłyszy, że element jest łączem, gdy napotka termin słownikowy, nawet jeśli może nie otrzymać informacji o zmianie kroju czcionki. W katalogu internetowym ceny mogą być podawane większą czcionką w kolorze czerwonym. Czytnik ekranu lub osoba, która nie może postrzegać koloru czerwonego, nadal ma informację o cenie, o ile jest ona poprzedzona symbolem waluty.
Niektóre technologie nie umożliwiają programowego określania niektórych typów informacji i relacji. W takim przypadku powinien pojawić się tekstowy opis informacji i powiązań. Na przykład „wszystkie wymagane pola są oznaczone gwiazdką (*)”. Opis tekstowy powinien znajdować się w pobliżu informacji, które opisuje (gdy strona jest zlinearyzowana), np. w elemencie nadrzędnym lub w sąsiednim.
Mogą również zaistnieć przypadki, w których może to być kwestia oceny, czy relacje powinny zostać określone programowo, czy też przedstawione w tekście. Jednakże, gdy technologie obsługują relacje programowe, zdecydowanie zaleca się, aby informacje i relacje były określane programowo, a nie opisywane w tekście.
Uwaga
Nie jest wymagane, aby wartości kolorów były określane programowo. Informacji przekazywanej przez kolor nie można odpowiednio zaprezentować poprzez wyświetlenie wartości. Dlatego też do przypadku koloru odnosi się kryterium sukcesu 1.4.1, a nie kryterium sukcesu 1.3.1.
Korzyści
- To kryterium sukcesu pomaga osobom z różnymi niepełnosprawnościami, umożliwiając programom użytkownika dostosowanie treści do potrzeb poszczególnych użytkowników.
- Użytkownicy niewidomi (korzystający z czytnika ekranu) odnoszą korzyści, gdy informacje przekazywane za pomocą koloru są również dostępne w tekście (w tym tekstowe alternatywy dla obrazów, które wykorzystują kolor do przekazywania informacji).
- Użytkownicy głuchoniewidomi korzystający z odświeżalnych wyświetlaczy brajlowskich (tekstowych) mogą nie być w stanie uzyskać dostępu do informacji zależnych od koloru.
Przykłady
- Formularz z wymaganymi polami
-
Formularz zawiera kilka wymaganych pól. Etykiety pól wymaganych są wyświetlane w kolorze
czerwonym. Ponadto na końcu każdej etykiety znajduje się znak gwiazdki *. Instrukcje
wypełniania formularza wskazują, że
Wszystkie wymagane pola są wyświetlane na czerwono i oznaczone gwiazdką *
, po czym następuje przykład. - Formularz wykorzystujący kolor i tekst do wskazania wymaganych pól
-
Formularz zawiera zarówno pola wymagane, jak i opcjonalne. Instrukcje w górnej części
formularza wyjaśniają, że wymagane pola są oznaczone czerwonym tekstem, a także ikoną,
której tekst alternatywny mówi
Wymagane
. Zarówno czerwony tekst, jak i ikona są programowo powiązane z odpowiednimi polami formularza, dzięki czemu użytkownicy technologii wspomagających mogą określić wymagane pola. - Tabela rozkładu jazdy autobusów, w której nagłówki dla każdej komórki można określić programowo
- Rozkład jazdy autobusów składa się z tabeli z przystankami wymienionymi pionowo w pierwszej kolumnie i różnymi autobusami wymienionymi poziomo w pierwszym wierszu. Każda komórka zawiera czas, w którym autobus pojawi się na danym przystanku. Komórki przystanku i autobusu są identyfikowane jako nagłówki odpowiedniego wiersza lub kolumny, dzięki czemu technologia wspomagająca może programowo określić, który autobus i który przystanek są powiązane z czasem w każdej komórce.
- Formularz, w którym etykiety pól wyboru można określić programowod
- W formularzu etykiety dla każdego pola wyboru mogą być określane programowo przez technologię wspomagającą.
- Dokument tekstowy
- Prosty dokument tekstowy jest sformatowany z podwójnymi pustymi liniami przed tytułami, gwiazdkami wskazującymi elementy listy i innymi standardowymi konwencjami formatowania, dzięki czemu jego strukturę można określić programowo.
Powiązane zasoby
Zasoby służą wyłącznie celom informacyjnym. Nie należy traktować ich jako zaleceń.
- WebAIM: Semantic Structure (WebAIM: Struktura semantyczna)
- Heading Tags (Znaczniki nagłówków)
Techniki
Każdy numerowany element w tej sekcji reprezentuje technikę lub kombinację technik, które Grupa Robocza WCAG uważa za wystarczające do spełnienia tego kryterium sukcesu. Nie jest jednak konieczne stosowanie tych konkretnych technik. Aby uzyskać informacje na temat stosowania innych technik, zobacz Objaśnienie technik dla kryteriów sukcesu WCAG, szczególnie w sekcji „Inne techniki”.
Techniki wystarczające
Wybierz poniżej sytuację, która pasuje do Twojej treści. Każda sytuacja obejmuje techniki lub kombinacje technik, które są znane i udokumentowane jako wystarczające w danej sytuacji.
Sytuacja A: Technologia zapewnia semantyczną strukturę umożliwiającą programowe określanie informacji i relacji przekazywanych za pośrednictwem prezentacji:
- ARIA11: Używanie punktów orientacyjnych ARIA do oznaczenia regionów strony
- H101: Użycie punktów orientacyjnych ARIA do oznaczenia kluczowych obszarów strony
- ARIA12: Używanie role=heading do oznaczenia nagłówków
- ARIA13: Użycie atrybutu role=heading oraz aria-level="#"do oznaczenia nagłówków
- ARIA16: Użycie atrybutu aria-labelledby, aby zapewnić nazwę dla elementów sterujących interfejsem użytkownika
- ARIA17: Używanie ról grupujących do oznaczenia powiązanych kontrolek formularzy
- ARIA20: Używanie roli regionu do oznaczenia regionu strony
- G115: Użycie znaczników semantycznych do oznaczania struktury ORAZ H49: Użycie znaczników semantycznych do oznaczenia tekstu wyróżnionego lub specjalnego
- G117: Użycie tekstu do przekazywania informacji przekazywanych przez zmiany w sposobie prezentacji tekstu
- G140: Oddzielanie informacji i struktury od prezentacji, aby umożliwić prezentację w różny sposób
- ARIA24: Semantyczna identyfikacja ikony czcionki za pomocą atrybutu role="img"
-
Zapewnienie możliwości programowego określenia informacji i relacji przekazywanych w prezentacji za pomocą następujących technik
- G138: Użycie znacznika semantycznego, gdy jako wskaźnik używany jest kolor
- H51: Użycie znaczników tabel do prezentacji danych tabelarycznych
- PDF6: Użycie elementów tabeli do oznaczania tabel w dokumentach PDF
- PDF20: Użycie edytora tabel Adobe Acrobat Pro do naprawiania tabel z błędami
- H39: Użycie elementu caption do powiązania podpisu tabeli danych z tabelą danych
- H63: Użycie atrybutu scope do kojarzenia komórek nagłówka i komórek danych w tabelach danych
- H43: Użycie atrybutów id i headers do kojarzenia komórek danych z komórkami nagłówków w tabelach danych
- H44: Użycie elementu label do powiązania etykiet tekstowych z kontrolkami formularzy
- H65: Użycie atrybutu title do oznaczenia kontrolek formularzy, gdy nie można użyć elementu label
- PDF10: Zapewnianie etykiet dla interaktywnych kontrolek formularzy w dokumentach PDF
- PDF12: Zapewnianie informacji o nazwach, rolach i wartościach pól formularzy w dokumentach PDF
- H71: Zapewnienie opisu dla grup kontrolek formularzy przy użyciu elementów fieldset i legend
- H85: Użycie optgroup do grupowania elementów option wewnątrz select
- H48: Użycie ol, ul i dl dla list lub grup łączy
- H42: Użycie znaczników h1-h6 do oznaczenia nagłówków
- PDF9: Zapewnianie nagłówków poprzez oznaczanie treści znacznikami nagłówków w dokumentach PDF
- SCR21: Użycie funkcji modelu obiektów dokumentu (DOM) do dodawania treści do strony
- PDF11: Zapewnianie łączy i tekstu łączy za pomocą przypisu (adnotacji) Link i elementu struktury /Link w dokumentach PDF
- PDF17: Określanie jednolitej numeracji stron w dokumentach PDF
- PDF21: Użycie znaczników List do wykazów w dokumentach PDF
- H97: Grupowanie powiązanych łączy za pomocą elementu nav
Sytuacja B: Stosowana technologia NIE zapewnia struktury semantycznej umożliwiającej programowe określenie informacji i relacji przekazywanych poprzez prezentację:
- G117: Użycie tekstu do przekazywania informacji przekazywanych przez zmiany w sposobie prezentacji tekstu
-
Uczynienie informacji i relacji przekazywanych przez prezentację możliwą do ustalenia lub dostępną w sposób programowy lub w formie tekstowej za pomocą następujących technik:
Techniki pomocnicze
Chociaż nie jest to wymagane do uzyskania zgodności, należy rozważyć następujące dodatkowe techniki, aby zwiększyć dostępność treści. Nie wszystkie techniki mogą być stosowane lub byłyby skuteczne we wszystkich sytuacjach.
- C22: Użycie CSS do kontrolowania wizualnej prezentacji tekstu
- G162: Umieszczanie etykiet w bezpośredniej bliskości kontrolek, aby zmaksymalizować postrzeganie relacji
- ARIA1: Użycie właściwości aria-describedby, aby zapewnić opisowe etykiety dla kontrolek interfejsu użytkownika
- ARIA2: Identyfikacja wymaganych pól za pomocą właściwości aria-required
- G141: Organizowanie strony za pomocą nagłówków
Błędy
Poniżej wymieniono typowe błędy, które Grupa Robocza WCAG uważa za niespełnienie tego kryterium sukcesu.
- F2: Niespełnienie kryterium sukcesu 1.3.1 z powodu użycia stylizacji tekstu, aby przekazać informacje bez użycia odpowiedniego znacznika lub tekstu
- F33: Niespełnienie kryterium sukcesu 1.3.1 i 1.3.2 z powodu użycia białych znaków do utworzenia wielu kolumn w treści tekstowej
- F34: Niespełnienie kryterium sukcesu 1.3.1 i 1.3.2 ze względu na użycie znaków spacji w celu uformowania tabel za pomocą zwykłego tekstu
- F42: Niespełnienie kryteriów sukcesu 1.3.1, 2.1.1, 2.1.3 lub 4.1.2 podczas emulacji łączy
- F43: Niespełnienie kryterium sukcesu 1.3.1 z powodu używania znaczników strukturalnych w sposób, który nie odzwierciedla relacji w treści
- F46: Niespełnienie kryterium sukcesu 1.3.1 z powodu użycia elementów th w tabelach formujących układ
- F48: Niespełnienie kryterium sukcesu 1.3.1 ze względu na użycie elementu pre do markowania informacji tabelarycznych
- F87: Niespełnienie kryterium sukcesu 1.3.1 z powodu wstawiania niedekoracyjnej treści za pomocą pseudoelementów :before i :after oraz własności 'content' w CSS
- F90: Niespełnienie kryterium sukcesu 1.3.1 dla niepoprawnego powiązania nagłówków i treści tabeli za pomocą atrybutów nagłówków i identyfikatorów
- F91: Niespełnienie kryterium sukcesu 1.3.1 dla nieprawidłowego oznaczania nagłówków tabeli
- F92: Niespełnienie kryterium sukcesu 1.3.1 ze względu na wykorzystanie roli „presentation” na treściach, które przekazują informacje semantyczne
Kluczowe pojęcia
takie przedstawienie danych przez oprogramowanie dostawcy, które pozwala różnym programom użytkownika, w tym technologiom wspomagającym, odczytać i przedstawić daną informację w sposób, jakiego potrzebuje użytkownik
renderowanie treści w sposób, który jest postrzegalny dla użytkownika
oprogramowanie umożliwiające pobieranie i przeglądanie treści internetowych
posiadające znaczenie powiązanie między różnymi elementami treści
nieosadzony zasób uzyskany z pojedynczego identyfikatora URI za pomocą protokołu HTTP wraz z wszelkimi innymi zasobami użytymi do renderowania strony w programie użytkownika lub takimi, które potencjalnie mogą być użyte do renderowania
Uwaga
Mimo że każdy z „pozostałych zasobów” mógłby być renderowany razem z podstawowym zasobem, to niekoniecznie muszą być renderowane równocześnie.
Uwaga
W celu zgodności z niniejszymi wytycznymi, zasób nie może być „osadzony” w innym zasobie wchodzącym w zakres oceny zgodności, aby można go było uznać za stronę internetową.
- Sposób, w jaki poszczególne części strony internetowej są ułożone i połączone ze sobą; oraz
- Sposób ułożenia zbioru stron internetowych.
sprzęt i oprogramowanie, które działa jako program użytkownika lub współdziała z popularnymi programami użytkownika, aby zapewnić osobom z niepełnosprawnościami niezbędne funkcjonalności, wykraczające poza możliwości oferowane przez popularne programy użytkownika;
Uwaga
Funkcjonalności zapewniane przez technologie wspomagające obejmują alternatywny sposób prezentacji treści (np. mowa syntetyczna lub powiększenie obrazu), alternatywne sposoby wprowadzania danych (np. za pomocą głosu), dodatkowe mechanizmy nawigacji i orientacji oraz przekształcania treści (np. w celu uczynienia tabel bardziej dostępnymi).
Uwaga
Technologie wspomagające często przekazują informacje i dane do standardowych aplikacji za pośrednictwem specjalnych API.
Uwaga
Rozróżnienie pomiędzy popularnymi programami użytkownika a technologiami wspomagającymi nie jest oczywiste. Wiele popularnych programów użytkownika posiada różne rozwiązania wspomagające osoby z niepełnosprawnościami. Główna różnica pomiędzy nimi polega na tym, że popularne programy użytkownika są ukierunkowane na szerokie i zróżnicowane grupy odbiorców, zarówno z niepełnosprawnościami, jak i bez niepełnosprawności. Natomiast technologie wspomagające skierowane są do wąskiej grupy odbiorców z określonymi rodzajami niepełnosprawności. Wsparcie świadczone za pomocą technologii wspomagających jest zatem bardziej wyspecjalizowane i nakierowane na odbiorcę z konkretnymi potrzebami. Popularne programy użytkownika mogą dostarczać technologiom wspomagającym niezbędne funkcjonalności, takie jak pobieranie treści internetowych z obiektów programowych lub odwzorowanie kodu do postaci przyjaźniejszej dla tych technologii.
- lupy ekranowe i inne programy wspomagające czytanie wzrokowe, używane przez osoby z niepełnosprawnościami wzroku, percepcyjnymi i innymi związanymi z korzystaniem z druku, pozwalające na zmianę czcionki, jej rozmiaru, odstępów, koloru oraz na synchronizację głosu z tekstem itp., w celu poprawienia czytelności wyświetlanego tekstu i obrazów;
- czytniki ekranu, używane przez osoby niewidome do odczytu treści tekstowych za pomocą mowy syntetycznej lub brajla;
- programy przetwarzające tekst na mowę syntetyczną, używane przez niektóre osoby z niepełnosprawnościami poznawczymi, językowymi i trudnościami w nauce w celu przekształcenia tekstu w mowę syntetyczną;
- programy rozpoznające mowę, używane przez niektóre osoby z niepełnosprawnościami fizycznymi;
- specjalne klawiatury, używane przez osoby z niektórymi niepełnosprawnościami fizycznymi, które symulują standardową klawiaturę (w tym klawiatury specjalne wyposażone we wskaźniki nagłowne, przełączniki, urządzenia „wciągnij/dmuchnij” (sip-and-puff) i inne specjalne urządzenia do wprowadzania danych);
- specjalne wskaźniki, używane przez osoby z niektórymi rodzajami niepełnosprawności fizycznych w celu symulowania kursora myszy i naciskania przycisków.
informacje i wrażenia sensoryczne, które mają być przekazywane użytkownikowi za pośrednictwem programu użytkownika, w tym kod lub znaczniki definiujące strukturę, prezentację i interakcje