Typografia

Tworzenie i projektowanie treści dostępnych dla wszystkich to nie tylko wybór łatwej do odczytania czcionki. Nawet w przypadku dostępnych rodzin czcionek osoby niedowidzące lub z zaburzeniami poznawczymi, językowymi i uczenia się mogą mieć trudności z przetwarzaniem tekstu ze względu na inne elementy, takie jak odmiany czcionek, rozmiar, odstępy i kerning.

Ten moduł zawiera podstawowe wskazówki dotyczące projektowania, które pomogą Ci tworzyć bardziej dostępne treści i docierać do jeszcze większej liczby osób.

Krój czcionki

Ważnym czynnikiem, który może mieć duży wpływ na dostępność tekstu, jest krój pisma. Wybór kroju i stylu pisma może zadecydować o sukcesie lub porażce projektu strony.

Osoby z zaburzeniami czytania, uczenia się i uwagi, takimi jak dysleksja i zespół nadpobudliwości psychoruchowej z deficytem uwagi (ADHD), a także osoby niedowidzące mogą odnieść korzyści z używania dostępnych krojów pisma.

Wybieranie typowych krojów pisma

Najszybszym sposobem na utworzenie projektu dostępnego dla wszystkich jest wybranie popularnej czcionki (np. Arial, Times New Roman, Calibri, Verdana i wielu innych).

Wiele badań nad krojami pisma przeprowadzonych na osobach z niepełnosprawnościami pokazuje, że popularne kroje pisma zapewniają większą szybkość czytania i lepsze zrozumienie tekstu w porównaniu z mniej popularnymi krojami. Popularne kroje pisma nie są z natury bardziej dostępne niż inne, ale niektórym osobom z niepełnosprawnościami łatwiej się je czyta, ponieważ mają duże doświadczenie w pracy z nimi (lub w ich omijaniu).

Oprócz wyboru popularnego kroju pisma unikaj ozdobnych lub odręcznych krojów pisma, a także tych, które mają tylko jedną wielkość liter (np. tylko wielkie litery). Te specjalne kroje pisma z kursywą, nietypowymi kształtami lub artystycznymi elementami, takimi jak cienkie linie, mogą wyglądać ładnie, ale niektórym osobom z niepełnosprawnościami trudniej się je czyta niż zwykłe kroje pisma.

Cechy liter i kerning

Badania dotyczące tego, czy kroje pisma szeryfowe czy bezszeryfowe są łatwiejsze do odczytania, nie przyniosły jednoznacznych wyników, ale niektóre cyfry, litery lub ich kombinacje mogą wprowadzać w błąd osoby z niepełnosprawnością poznawczą i innymi zaburzeniami uczenia się. W przypadku osób z tymi rodzajami niepełnosprawności każda litera i każda cyfra musi być wyraźnie zdefiniowana i mieć unikalne cechy, aby nie można było pomylić liter z cyframi.

Do najczęstszych problemów z czytelnością należą wielka litera I (Indie), mała litera l (sałata) i cyfra 1. Podobnie pary liter, takie jak bd, pq, ft, ij, mw oraz nu, mogą być dla niektórych czytelników odwrócone w pionie lub w poziomie.

Czytelność tekstu spada też, gdy odstępy między literami lub kerning są zbyt małe. Zwróć szczególną uwagę na kerning, zwłaszcza w przypadku problematycznej pary liter r/n. W przeciwnym razie słowa takie jak „yarn” mogą zmienić się w „yam” lub „stern” w „stem”, co całkowicie zmieni znaczenie tekstu.

Kolekcje czcionek o otwartym kodzie źródłowym, takie jak Google Fonts, mogą pomóc Ci w wybraniu najbardziej odpowiedniej czcionki do kolejnego projektu. Jeśli korzystasz z produktów Adobe, możesz osadzać w projektach dostępne rodziny czcionek od partnerów – odlewni, w tym wybrane Google Fonts.

Gdy będziesz szukać kolejnego kroju pisma, zwróć szczególną uwagę na te kwestie:

  • W miarę możliwości używaj popularnych czcionek.
  • Unikaj ozdobnych czcionek, czcionek pisanych odręcznie i czcionek, które mają tylko jedną wielkość liter.
  • Wybierz krój pisma o unikalnych cechach, zwracając szczególną uwagę na wielką literę I, małą literę l i cyfrę 1.
  • Sprawdź niektóre kombinacje liter, aby upewnić się, że nie są one swoim dokładnym odbiciem lustrzanym.
  • Sprawdź kerning, zwłaszcza w przypadku pary liter rn.

Rozmiar czcionki i styl typograficzny

Użytkownicy często zakładają, że wybór dostępnej rodziny czcionek wystarczy do tworzenia treści z myślą o inkluzji, ale ważne jest również, aby wziąć pod uwagę rozmiar czcionki i sposób formatowania tekstu na stronie.

Na przykład osoby niedowidzące lub z daltonizmem mogą nie być w stanie odczytać niektórych tekstów, jeśli są one zbyt małe. W takim przypadku mogą użyć technologii wspomagającej, np. powiększenia w przeglądarce, aby odczytać tekst. Inni użytkownicy, np. osoby z dysleksją lub zaburzeniami czytania, mogą mieć problem z czytaniem tekstu pisanego kursywą. Czytniki ekranu często ignorują metody formatowania, takie jak pogrubienie i kursywa, więc intencja tych stylów nie jest przekazywana niewidomym i niedowidzącym użytkownikom.

Nie
h2 {font-size: 16px;}
Tak
h2 {font-size: 1rem;}

Nie możesz przewidzieć potrzeb każdego użytkownika, dlatego podczas dodawania czcionek do witryn i aplikacji internetowych pamiętaj o tych wytycznych:

  • Podstawowe rozmiary czcionek powinny być zdefiniowane za pomocą wartości względnej (%, rem lub em), aby umożliwić zmianę rozmiaru.
  • Aby zwiększyć czytelność, ogranicz liczbę odmian czcionki, takich jak kolor, pogrubienie, WIELKIE LITERY i kursywa. Zamiast tego używaj metod podkreślania słów w tekście, takich jak gwiazdki, myślniki lub wyróżnianie poszczególnych słów.
  • Jeśli to możliwe, używaj znaczników zamiast tekstu na obrazach. Czytniki ekranu nie mogą odczytywać tekstu osadzonego na obrazach (bez dodania dodatkowego kodu), a tekst osadzony może również ulec rozpikselowaniu, gdy zostanie powiększony przez użytkowników niedowidzących.

Struktura i układ

Chociaż krój pisma, rozmiar czcionki i stylistyka typograficzna są ważne dla dostępnej typografii, strukturaukład tekstu na stronie mogą być równie ważne dla zrozumienia treści przez użytkownika.

Złożone układy mogą stanowić prawdziwą barierę dla osób niedowidzących, mających trudności z czytaniem i 6, 1 mln osób w Stanach Zjednoczonych z ADHD. Ze względu na brak wyraźnych ścieżek liniowych, brak nagłówków i niezgrupowane elementy osobom z tymi niepełnosprawnościami trudniej jest utrzymać uwagę i śledzić tok tekstu.

Ważnym aspektem projektowania dostępnych układów jest odróżnianie od siebie najważniejszych elementów i grupowanie podobnych elementów. Jeśli elementy są zbyt blisko siebie, trudno jest określić, gdzie się zaczynają i kończą, zwłaszcza jeśli mają podobny styl.

Pomyśl o tekście reklamy jako o zbiorze pojedynczych punktów w konspekcie. Pomoże Ci to zaplanować ogólną strukturę strony i w razie potrzeby używać nagłówków, podtytułów i list.

Odstępy

Odstępy między akapitami, zdaniami i słowami pomagają czytelnikom skupić się na tekście i poprawiają ogólną czytelność strony. Długie wiersze tekstu mogą być barierą dla czytelników z niepełnosprawnościami, ponieważ mają oni trudności z utrzymaniem miejsca i śledzeniem przepływu tekstu.

Wąski blok tekstu ułatwia czytelnikom przejście do następnego wiersza.

Dopasowanie treści

Kolejnym problemem dla wielu osób z niepełnosprawnościami jest czytanie tekstu wyjustowanego. Nierównomierne odstępy między słowami w wyjustowanym tekście mogą powodować powstawanie na stronie „rzek odstępów”, co utrudnia czytanie.

Wyjustowanie tekstu może też powodować, że słowa są zbyt blisko siebie lub nienaturalnie rozciągnięte, co utrudnia czytelnikowi określenie granic słów.

Na szczęście istnieją jasne wytyczne dotyczące odstępów i narzędzia takie jak Good Line-HeightGolden Ratio Calculator, które pomagają zwiększyć dostępność tekstu. Stosowanie się do tych wytycznych pomaga osobom z zaburzeniami uwagi, trudnościami w czytaniu i wadami wzroku skupić się na treści, a nie na układzie.

Sprawdzone metody dotyczące struktury i układu

Podczas rozważania struktury i układu pamiętaj, aby:

  • Używaj elementów takich jak nagłówki, podtytuły, listy, liczby, bloki cytatów i inne grupy wizualne, aby podzielić stronę na sekcje.
  • Używaj wyraźnie zdefiniowanych akapitów, zdań i odstępów między wyrazami.
  • Twórz kolumny tekstu o szerokości mniejszej niż 80 znaków (40 znaków w przypadku logogramów).
  • Unikaj wyrównywania akapitów do obu marginesów, ponieważ powoduje to powstawanie w tekście „rzek spacji”.

Najważniejsze informacje o dostępnej typografii

Dostępna typografia sprowadza się do rozsądnych wyborów projektowych opartych na wiedzy o potrzebach użytkowników. Pamiętanie o tym module podczas projektowania i tworzenia treści pomoże Ci skutecznie komunikować się z jak największą liczbą osób.