Обновить README.md

This commit is contained in:
Евгений Куценко 2024-12-30 18:22:07 +01:00
parent 212bcddd3c
commit 29d2719049

View File

@ -77,28 +77,28 @@
Доступность — это практика создания веб-сайтов и приложений, которые могут использовать все люди, включая людей с нарушениями зрения, моторики, слуха, речи или когнитивных функций. Здесь вы найдете инструменты для обеспечения веб-доступности, инструменты для тестирования доступности и приложения для доступности как для разработчиков, так и для дизайнеров:
- [A11ygator](https://a11ygator.chialab.io) — Веб-инструмент для анализа сайтов на соответствие правилам WCAG. Также доступен в виде расширения для браузера Google Chrome и Twitter-бота. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg) [![open-source.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/open-source.svg)](https://github.com/chialab/a11ygator-app)
- [Accessibility Insights](https://accessibilityinsights.io/) — помогает разработчикам быстро находить и устранять проблемы доступности. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [Accessible Palette Builder](https://toolness.github.io/accessible-color-matrix/) — прототип на основе Elm, помогающий дизайнерам создавать доступные цветовые палитры. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg) [![open-source.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/open-source.svg)](https://github.com/toolness/accessible-color-matrix)
- [AChecker](https://achecker.ca) — веб-приложение для тестирования доступности, используемое для оценки HTML-контента на наличие проблем с доступностью. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [ANDI](https://www.ssa.gov/accessibility/andi/help/install.html) — инструмент тестирования доступности веб-контента (букмарклет). Автоматически обнаруживает проблемы с доступностью, предлагает улучшения и проверяет соответствие стандарту 508. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg) [![open-source.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/open-source.svg)](https://github.com/SSAgov/ANDI)
- [Axe](https://www.deque.com/axe/) — движок доступности, предназначенный для работы во всех современных браузерах и с любыми инструментами, фреймворками, библиотеками и средами. Это инструмент автоматического тестирования доступности для разработчиков. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg) [![open-source.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/open-source.svg)](https://github.com/dequelabs/axe-core)
- [ColorBox](http://www.colorbox.io/) — веб-приложение, которое алгоритмически создает доступные цветовые системы. Разработано командой Lyft Design. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [Colorable](https://colorable.jxnblk.com/) — бесплатный веб-инструмент для проверки контраста. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [Color Oracle](https://colororacle.org/) — бесплатный симулятор дальтонизма. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [Contrast](https://usecontrast.com/) — приложение для macOS для дизайнеров и разработчиков, предоставляющее быстрый доступ к коэффициентам контраста цветов по стандартам WCAG. ![mac.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/mac.svg)
- [Contrast Checker](https://contrast-checker.glitch.me/) — помогает проверить контраст между фоном элемента и самой страницей. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [Contraste](https://contrasteapp.com/) — приложение для проверки доступности текста в соответствии с Руководством по доступности веб-контента (WCAG). ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [Inclusive Design](https://www.microsoft.com/design/inclusive/) — методология и набор инструментов, предоставленных командой Microsoft.
- [Hex Naw](https://hexnaw.com/) — помогает протестировать целые цветовые системы на контрастность и доступность. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [Leonardo](https://leonardocolor.io) — генератор цветовых палитр по заданному коэффициенту контраста WCAG. Открытый веб-инструмент и npm-модуль для дизайнеров и инженеров. Разработан Adobe. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg) ![open-source.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/open-source.svg) ![Web](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/web.svg)
- [PA11Y](http://pa11y.org/) — инструмент тестирования доступности для выявления проблем с веб-страницами. Запускает HTML CodeSniffer из командной строки для программных отчетов о доступности. Это инструмент для разработчиков. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg) ![open-source.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/open-source.svg)
- [Sim Daltonism](https://michelf.ca/projects/sim-daltonism/) — симулятор дальтонизма для macOS и iOS, позволяющий визуализировать цвета так, как они воспринимаются при различных типах дальтонизма. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg) [![open-source.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/open-source.svg)](https://www.github.com/michelf/sim-daltonism/)
- [Stark](https://getstark.co/) — платный плагин для Sketch, позволяющий моделировать различные типы дальтонизма. ![mac.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/mac.svg)
- [Toptals Color Filter](https://www.toptal.com/designers/colorfilter) — позволяет протестировать ваш сайт и показывает, как люди с различными видами дальтонизма увидят ваши страницы. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media//free.svg)
- [tota11y](http://khan.github.io/tota11y/) — инструмент визуализации доступности. Интересный факт: в названии инструмента вы видите "a11y". Это сокращение от accessibility, где "a" сопровождается 11 буквами, а затем "y". ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [WAVE](https://wave.webaim.org/) — позволяет оценить веб-контент на наличие проблем с доступностью прямо в Chrome и Firefox. Это проверяющий доступность веб-контента. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [90 Examples](http://clrs.cc/a11y/) — бесплатная коллекция доступных цветовых тем. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [**A11ygator**](https://a11ygator.chialab.io) — Веб-инструмент для анализа сайтов на соответствие правилам WCAG. Также доступен в виде расширения для браузера Google Chrome и Twitter-бота. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg) [![open-source.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/open-source.svg)](https://github.com/chialab/a11ygator-app)
- [**Accessibility Insights**](https://accessibilityinsights.io/) — помогает разработчикам быстро находить и устранять проблемы доступности. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [**Accessible Palette Builder**](https://toolness.github.io/accessible-color-matrix/) — прототип на основе Elm, помогающий дизайнерам создавать доступные цветовые палитры. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg) [![open-source.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/open-source.svg)](https://github.com/toolness/accessible-color-matrix)
- [**AChecker**](https://achecker.ca) — веб-приложение для тестирования доступности, используемое для оценки HTML-контента на наличие проблем с доступностью. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [**ANDI**](https://www.ssa.gov/accessibility/andi/help/install.html) — инструмент тестирования доступности веб-контента (букмарклет). Автоматически обнаруживает проблемы с доступностью, предлагает улучшения и проверяет соответствие стандарту 508. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg) [![open-source.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/open-source.svg)](https://github.com/SSAgov/ANDI)
- [**Axe**](https://www.deque.com/axe/) — движок доступности, предназначенный для работы во всех современных браузерах и с любыми инструментами, фреймворками, библиотеками и средами. Это инструмент автоматического тестирования доступности для разработчиков. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg) [![open-source.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/open-source.svg)](https://github.com/dequelabs/axe-core)
- [**ColorBox**](http://www.colorbox.io/) — веб-приложение, которое алгоритмически создает доступные цветовые системы. Разработано командой Lyft Design. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [**Colorable**](https://colorable.jxnblk.com/) — бесплатный веб-инструмент для проверки контраста. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [**Color Oracle**](https://colororacle.org/) — бесплатный симулятор дальтонизма. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [**Contrast**](https://usecontrast.com/) — приложение для macOS для дизайнеров и разработчиков, предоставляющее быстрый доступ к коэффициентам контраста цветов по стандартам WCAG. ![mac.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/mac.svg)
- [**Contrast Checker**](https://contrast-checker.glitch.me/) — помогает проверить контраст между фоном элемента и самой страницей. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [**Contraste**](https://contrasteapp.com/) — приложение для проверки доступности текста в соответствии с Руководством по доступности веб-контента (WCAG). ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [**Inclusive Design**](https://www.microsoft.com/design/inclusive/) — методология и набор инструментов, предоставленных командой Microsoft.
- [**Hex Naw**](https://hexnaw.com/) — помогает протестировать целые цветовые системы на контрастность и доступность. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [**Leonardo**](https://leonardocolor.io) — генератор цветовых палитр по заданному коэффициенту контраста WCAG. Открытый веб-инструмент и npm-модуль для дизайнеров и инженеров. Разработан Adobe. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg) ![open-source.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/open-source.svg) ![Web](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/web.svg)
- [**PA11Y**](http://pa11y.org/) — инструмент тестирования доступности для выявления проблем с веб-страницами. Запускает HTML CodeSniffer из командной строки для программных отчетов о доступности. Это инструмент для разработчиков. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg) ![open-source.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/open-source.svg)
- [**Sim Daltonism**](https://michelf.ca/projects/sim-daltonism/) — симулятор дальтонизма для macOS и iOS, позволяющий визуализировать цвета так, как они воспринимаются при различных типах дальтонизма. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg) [![open-source.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/open-source.svg)](https://www.github.com/michelf/sim-daltonism/)
- [**Stark**](https://getstark.co/) — платный плагин для Sketch, позволяющий моделировать различные типы дальтонизма. ![mac.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/mac.svg)
- [**Toptals Color Filter**](https://www.toptal.com/designers/colorfilter) — позволяет протестировать ваш сайт и показывает, как люди с различными видами дальтонизма увидят ваши страницы. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media//free.svg)
- [**tota11y**](http://khan.github.io/tota11y/) — инструмент визуализации доступности. Интересный факт: в названии инструмента вы видите "a11y". Это сокращение от accessibility, где "a" сопровождается 11 буквами, а затем "y". ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [**WAVE**](https://wave.webaim.org/) — позволяет оценить веб-контент на наличие проблем с доступностью прямо в Chrome и Firefox. Это проверяющий доступность веб-контента. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
- [**90 Examples**](http://clrs.cc/a11y/) — бесплатная коллекция доступных цветовых тем. ![free.svg](https://git.creogenesis.com/kutsenko/Awesome-Design-Tools/raw/branch/master/Media/free.svg)
<div class="banner banner--yellow">