blog na temat dostępności stron internetowych

Przejdź do głównej treści

Język treści internetowych

Technologie asystujące, takie jak czytniki ekranu czy też syntezatory mowy, przekształcają treść zapisaną w formie tekstu na treść dźwiękową (mowę). Aby programy te mogły poprawnie zaprezentować użytkownikom daną treść, muszą wiedzieć, w jakim języku została ona napisana. Dlatego też ważne jest, by odpowiednio przekazać tę informację w kodzie strony. Jak należy to zrobić opisują kryteria WCAG 2.0 – 3.1.1 Język strony (A) i 3.1.2 Język części (AA).

Dla kogo jest to ważne

Wymienione powyżej kryteria sukcesu powstały głównie z myślą o:

  • osobach niewidomych korzystających z czytników ekranu
  • osobach z zaburzeniami rozwojowymi i poznawczymi, mających trudności z nauką lub płynnym czytaniem, które używają syntezatorów mowy
  • osobach korzystających z napisów rozszerzonych zawartych w treściach multimedialnych.

Wymienione powyżej technologie asystujące (oraz przeglądarki) są w stanie lepiej przetworzyć tekst na stronie, której język jest zdefiniowany w kodzie. Czytniki ekranu mogą wybrać poprawne, właściwe dla danego języka zasady wymowy, przeglądarki – wyświetlić poprawne znaki, a odtwarzacze plików multimedialnych – wyświetlić odpowiednie napisy.

Jak zadeklarować język treści

Aby zadeklarować główny język, w jakim przekazana jest treść danej strony, należy dodać do elementu <html> atrybut “lang” o odpowiedniej wartości. I tak np. dla dokumentu HTML5, którego treść została napisana w języku polskim, element <html> powinien wyglądać następująco:

<!DOCTYPE html>
<html lang="pl">

Jeśli strona zadeklarowana jest jako dokument XHTML1.0, musimy również dodać atrybut xml:lang, np.:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="pl" xml:lang="pl">

W przypadku dokumentu XHTML1.1 wymagany jest jedynie atrybut xml:lang:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
   "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl">

Strony wielojęzyczne

Jeżeli dana strona zawiera treści w kilku różnych językach, w elemencie <html> powinnien zostać zadeklarowany główny język (ten, w którym napisana jest większość treści). Następnie fragmenty tekstu, które zostały napisane w innym języku, powinny być oznaczone za pomocą elementu z atrybutem “lang“, np.:

<!DOCTYPE html>
<html lang="pl">
[…]
  <h1>To jest strona w języku polskim</h1>
  <blockquote lang="en">
    <p>Heresy is another word for freedom of thought.</p>
    <footer>
      <cite>Graham Greene</cite>
    </footer>
  </blockquote>
  […]
</html>

Linki do stron napisanych w innych językach

Jeśli strona, której treść napisana jest w jednym języku (np. po polsku), zawiera linki do stron, których treść napisana jest w innych językach (np. po angielsku), to każdy z tych linków powininen dodatkowo posiadać atrybut “hreflang“, służący do zdefiniowania języka strony docelowej, np.:

<html lang="pl">
  […]
  <a href="http://moja-strona.pl/welcome" lang="en" hreflang="en">English version</a>
</html>

Niektórzy mylą atrybuty “lang” i “hreflang". Różnica jest prosta: “lang” określa, w jakim języku został napisany tekst zawarty w elemencie, który posiada ten atrybut (w powyższym przykładzie dotyczy on tekstu “English version”). Atrybut “hreflang” zamieszczony na linku określa, w jakim języku napisana jest treść strony, do której odnośnik ten prowadzi (w powyższym przykładzie dotyczy on treści strony “http://moja-strona.pl/welcome”).

Podsumowując

  • element <html> musi posiadać atrybut “lang” określający, w jakim języku została napisana treść strony
  • jeżeli dana strona zawiera treści w więcej niż jednym języku, główny język powinien zostać zadeklarowany za pomocą atrybutu “lang” zamieszczonego na elemencie <html>, zaś elementy strony, w których zawarte są treści napisane w innych językach, powinny posiadać atrybut “lang” określający język tych treści
  • odnośnik do strony internetowej w innym języku niż strona, na której został on zamieszczony, powinnien posiadać atrybut “hreflang” określający, w jakim języku została napisana treść strony, do której link ten prowadzi.

Dodaj komentarz

Należy wypełnić wszystkie pola oznaczone asteryskiem (*).
Zanim komentarz zostanie opublikowany będzie musiał zostać zatwierdzony przez moderatora.

Możesz wykorzystać następujące elementy HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>