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