Цей запис востаннє оновлений 11 липня 2018 р. | Автор: Тамас Вердес

швидка

Це місяць доступності. Два тижні ми говорили про те, яка доступність росте на дереві, після чого я представив найкращі шаблони. Давайте копатимемось глибше сьогодні: давайте подивимось, як ви можете знати, чи доступний ваш веб-сайт.

Раніше випущені частини серії:

Трохи теорії

Офіційний стандарт доступності - WCAG 1.0 (Рекомендації щодо доступу до веб-вмісту), опублікований у 1999 році. Наразі діє WCAG 2.0 .

Крім того, WordPress розробив власні критерії доступності. Вони потрібні, якщо шаблон хоче отримати безбар’єрну сертифікацію в лісі шаблонів. На даний момент існує 120 шаблонів із цим рейтингом.

Ми потрапимо в читання офіційних стандартів, але якщо вам цікаво, ви знаєте, де помилитися. Підсумовуючи, ось 4 міркування, які допоможуть вам судити, чи доступний ваш веб-сайт.

Існує 4 принципи доступності

Доступність вашого веб-сайту залежить від 4 факторів. Це наступне.

  1. Виявленість. Кожен вміст повинен бути доступним для якомога більшої кількості почуттів. Найпростіший спосіб зробити це - додати текст заміщення тексту до кожного вмісту.
  2. Обробка. Усі елементи веб-сайту повинні бути достатньо великими, щоб бути видимими, відокремленими від інших елементів. Кнопки повинні бути помітними, великими, натискатими та функціональними. Керованість сильно погіршується ефектами та розміщенням рухомих елементів на сторінці.
  3. Прозорість та зрозумілість. Якщо читач повинен з’ясувати, де натиснути, про що йдеться, тоді ваш дизайн не вдався. Дотримуйтесь існуючих традицій і не хочете революціонізувати веб-дизайн, оскільки ваші читачі загубляться.
  4. Надійність. Використовуйте свіжі, чисті коди на своєму веб-сайті. Завжди дотримуйтесь останніх стандартів.

Звучить складно? Давайте розглянемо кожен принцип детальніше.

Зробіть усі елементи видимими

  1. Використовуйте щонайменше шрифти 18 пікселів, міжрядковий інтервал та не більше 80 символів на рядок. Використовуйте якомога коротші абзаци та максимально аналізуйте текст.
  2. Підкресліть посилання.
  3. Використовуйте різкий контраст між кольорами, щоб зробити ваше письмо читабельним. За допомогою цього контрастного приладу ви можете перевірити, чи фон правильно відокремлений від написаного.
  4. Додайте змістовний текст, що замінює зображення, відео та будь-який інший нетекстовий вміст.
  5. Позначте всі форми (контактна форма, форми заявок) для незрячих.

Зробіть сторінку керованою

  1. Читач може переміщатися по сторінці вручну, не використовуючи мишу. Спробуйте тут: помістіть курсор у поле пошуку та натисніть Tab. Ви можете бачити, як фокус переходить з одного посилання на інше. Натискання клавіші Enter еквівалентно клацанню мишею.
  2. Не заливайте читача стимулами. Не мерехтіть, не обертайте та не обертайте нічого на сторінці.
  3. Додайте значущий прив’язний текст до посилань. Уникайте завантаження звідси, клацніть тут або завантажуйте PDF та подібні прив'язки. Наприклад, замість того, щоб натискати на якірний текст, введіть його, використовуйте цей додаток для вимірювання контрасту .
  4. Кнопки повинні бути великими, клікабельними. Не забудьте перевірити на своєму мобільному телефоні, оскільки кнопки, як правило, ковзають одна на одній.

Зробити це зрозумілим (для інших)

  1. Якщо ваш читач неправильно заповнив контактну форму, поверніть її на початок форми та помітно випишіть, щоб спробувати ще раз.
  2. Відображайте меню однаково на кожній сторінці: не заважайте своєму читачеві, знайомлячись із сторінкою знову і знову.

Ясність - ключове питання. Найпростіший спосіб перевірити це - попросити недосвідчену людину переглянути ваш веб-сайт і кожного разу запитувати себе: якби я його не написав, чи зрозумів би я, про що йдеться?

Будьте надійними

  1. У коді вашого веб-сайту не повинно бути суттєвих проблем з дійсністю. Ви також можете перевірити це за допомогою тесту доступності W3C. Якщо на вашій сторінці з’являється 5 кодів помилок, це вважається хорошим. Якщо у вас 105, у вас є щось спільне з цим. Можливо, це означає, що шаблон потрібно замінити.

Як перевірити себе на доступність вашого веб-сайту?

Тепер ви бачите найважливіші аспекти. Ви хочете перевірити власну сторінку? Тест доступності WEBAIM покаже вам найсерйозніші помилки.

Вам не потрібно виправляти все одразу (моя теж не ідеальна), і вам також не потрібно відразу міняти сторону. Але для будь-якого серйозного редизайну веб-сайтів спробуйте спростити веб-сайт та зробити його простішим в управлінні.

Слідкуйте за мною наступного тижня, коли ми говоримо про ділові переваги доступності.