Візуалізуйте & доступність налагодження веб-сайту з Tota11y

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

Але є багато роботи для веб-доступності. Це величезна тема, а не те, що можна отримати без зручних інструментів.

Tota11y - це безкоштовний інструментарій для візуалізації проблем доступності вашого сайту. Це працює безпосередньо в браузері, так що ви можете просто завантажувати набір інструментів, натискати навколо вашого сайту (або будь-якого сайту!), Щоб знайти рекомендації щодо доступності..

Це працює як бібліотека JavaScript, яку можна підключити до будь-якої сторінки. Ви також можете запускати його вручну на живих сайтах через Chrome DevTools, але це не завжди корисно, якщо ви не працюєте на чужому сайті.

Tota11y додає невелику панель інструментів на вашу сторінку та динамічно запускається по всьому DOM. Всякий раз, коли ви клацніть елемент, який ви отримаєте невелике поле розширення з деталями, що стосуються проблем доступності.

Одна річ мені дуже подобається Tota11y Ясна мова використовуються в кожному вікні виносних. Більшість документації WAI-ARIA схоже на читання податкових кодів. Відмінно підходить для сну, не так велика для налагодження веб-сайту.

З цією бібліотекою ви знайдете проблеми і рішення, написані простою англійською мовою. Набагато простіше споживати і рішення швидко.

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

Все це відкривається під ліцензією MIT, тому дуже легко працювати.

Ви можете взяти копію на GitHub і використовувати її для майже всього. Tota11y також поставляється з купою плагінів, які можна розширити на основний сценарій. Це додати функціональність для перевірки більш детальних проблем доступності.

Якщо ви зацікавлені у тестуванні доступності, ви абсолютно хочете скопіювати цей скрипт у вашій панелі інструментів.