Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/vue-a11y/awesome-a11y-vue
A list of awesome things related to accessibility in Vue.js
https://github.com/vue-a11y/awesome-a11y-vue
List: awesome-a11y-vue
accessibility-vue awesome
Last synced: 16 days ago
JSON representation
A list of awesome things related to accessibility in Vue.js
- Host: GitHub
- URL: https://github.com/vue-a11y/awesome-a11y-vue
- Owner: vue-a11y
- Created: 2020-02-23T17:11:45.000Z (almost 5 years ago)
- Default Branch: master
- Last Pushed: 2021-09-20T15:02:35.000Z (over 3 years ago)
- Last Synced: 2024-04-14T09:04:36.109Z (8 months ago)
- Topics: accessibility-vue, awesome
- Size: 41 KB
- Stars: 126
- Watchers: 6
- Forks: 8
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
Awesome Lists containing this project
- ultimate-awesome - awesome-a11y-vue - A list of awesome things related to accessibility in Vue.js. (Other Lists / Monkey C Lists)
README
# Awesome Accessibility Vue.js [](https://github.com/sindresorhus/awesome)
> List of awesome things related to accessibility in Vue.js
- [Resources](#resources)
- [vue-a11y](#vue-a11y)
- [Community](#community)
- [Posts and tutorials](#posts-and-tutorials)
- [Videos](#videos)
- [Talks](#talks)
- [Books](#books)
- [Courses](#courses)
- [Components and plugins](#components-and-plugins)
- [Development](#development)
- [Vuepress](#development)
- [Accessible libraries](#accessible-libraries)
- [Accessible projects](#accessible-projects)
- [License](#license)
## Resources
### Vue A11y
- [Project website (coming soon)](https://vue-a11y.com/)
- [GitHub Repo](https://github.com/vue-a11y)
### Community
- [Twitter](https://twitter.com/vue_a11y)
### Posts and tutorials
#### 2020
- [Improved accessible routing in Vue.js](https://marcus.io/blog/improved-accessible-routing-vuejs)
- [Disclosure widgets in Vue.js](https://marcus.io/blog/disclosure-widget-vuejs)
#### 2019
- [Accessible Custom Vue.js Select Component Part 1: Simple but Experimental](https://markus.oberlehner.net/blog/accessible-custom-vue-form-select-component-simple-but-experimental/)
- [Accessible Custom Vue.js Select Component Part 2: Advanced](https://markus.oberlehner.net/blog/accessible-custom-vue-form-select-component-simple-but-advanced/)
- [Accessible Form Validation Messages with ARIA and Vue.js](https://vuejsdevelopers.com/2019/05/13/accessibility-validation-aria-vuejs/)
- [Vue.jsから考えるアクセシビリティについて - 2019](https://yamanoku.net/vue-a11y-2019/)
- [Accessible form error auto-focus with Vuelidate in Vue](https://dev.to/marinamosti/accessible-form-error-auto-focus-with-vuelidate-in-vue-4cok)
#### 2018
- [Getting Started with Web Accessibility in Vue](https://medium.com/@emilymears/getting-started-with-web-accessibility-in-vue-17e2c4ea0842)
- [Improve Vue.js Accessibility with vue-announcer](https://alligator.io/vuejs/vuejs-accessible-announcements/)
- [How to Create an Accessible Autocomplete Component with Vue.js](https://alligator.io/vuejs/vue-a11y-autocomplete/)
- [Web components still need to be accessible](https://www.24a11y.com/2018/web-components-still-need-to-be-accessible/)
### Videos
- [Vue.js Modal w/ Keyboard Accessibility](https://www.youtube.com/watch?v=qYrpSvWdYKQ)
- [Vue.js Dropdown w/ Keyboard Accessibility](https://www.youtube.com/watch?v=SGVSvi1OxE8)
### Talks
- [Callum Macrae - Accessibility with Vue](https://www.youtube.com/watch?v=1Rvg_XkFH8Q)
- [Maria Lamardo - Web Accessibility With Vue.js](https://www.youtube.com/watch?v=mHubDB6DIfE)
- [Maya Shavin - Media for everyone - how to make your Vue Apps accessible for all users](https://www.youtube.com/watch?v=3hWTC5h0uAw)
- [Maya Shavin - Vue your Media with Accessibility (m16y)](https://www.youtube.com/watch?v=7YRTDaP3nMw)
### Books
- [Vue.js: Up and Running: Building Accessible and Performant Web Apps](https://www.amazon.com/Vue-js-Running-Building-Accessible-Performant-ebook/dp/B07B1N6GVC)
- [Accessible Vue](https://accessible-vue.com)
### Courses
- [Web Accessibility Fundamentals (Vueschool)](https://vueschool.io/courses/web-accessibility-fundamentals)
## Components and plugins
- [@vue-a11y/announcer](https://github.com/vue-a11y/vue-announcer) - A simple way with Vue to announce any useful information for screen readers.
- [@vue-a11y/skip-to](https://github.com/vue-a11y/vue-skip-to) - It helps people who only use the keyboard to jump to what matters most.
- [@vue-a11y/dark-mode](https://github.com/vue-a11y/vue-dark-mode) - A component that helps to implement dark mode and other color modes in your Vue application.
- [@vue-a11y/focus-loop](https://github.com/vue-a11y/vue-focus-loop) - Vue component that helps you to to trap focus in an element.
- [@vue-a11y/vlibras](https://github.com/vue-a11y/vue-vlibras) - Componente Vue.js que ajuda você a implementar o VLibras no seu site.
- [vue-accessible-multiselect](https://github.com/vue-a11y/vue-accessible-multiselect) - Vue.js accessible multiselect component made according to WAI-ARIA practices.
- [vue-a11y-utils](https://github.com/jinjiang/vue-a11y-utils) - Utilities for accessibility (a11y) in Vue.js.
- [vue-focus-lock](https://github.com/theKashey/vue-focus-lock) - It is a trap! A lock for a Focus. A11y util for scoping a focus.
- [vue-a11y-calendar](https://github.com/IBM/vue-a11y-calendar) - Accessible, internationalized Vue calendar.
- [a11y-vue-dialog](https://github.com/renatodeleao/a11y-vue-dialog) - An accessible dialog component made for Vue.
- [vue-a11y-katex](https://github.com/dangvanthanh/vue-a11y-katex) - Katex Accessibility Using Vue.js.
- [vue-m16y](https://github.com/mayashavin/vue-m16y) - A11y widget for Vue app which enables media accessibility mode.
- [vue-switch-button](https://github.com/marcus-herrmann/vue-switch-button) - Accessible toggle button component for Vue 2.
- [vue-menu-button](https://github.com/marcus-herrmann/vue-menu-button) - Accessible menu button component for Vue 2, following WAI-ARIA 1.1 authoring practices.
- [vue-transition-a11y](https://github.com/vanhoofmaarten/vue-transition-a11y) - A extended version of the Vue component, which takes 'prefers-reduced-motion' in to account.
- [autocomplete-vue](https://github.com/trevoreyre/autocomplete/tree/master/packages/autocomplete-vue) - Accessible autocomplete component Vue.
- [focus-trap-vue](https://github.com/posva/focus-trap-vue) - Vue component to trap the focus within a DOM element.
- [vue-accessibility-toolbar](https://github.com/hendrixfan/vue-accessibility-toolbar) - A Toolbar with Buttons to invert Colors, highlight Links, desaturate and increase Font Size.
- [vue-a11y-click](https://github.com/swiecaJS/vue-a11y-click) - It helps you handling click events on element which are not natively clickable...
- [vue-accessible-modal](https://github.com/andrewvasilchuk/vue-accessible-modal) - Vue.js component for accessible modals.
- [vue-number-input](https://github.com/smwbtech/vue-number-input) - Vue component for numbers input.
- [vue-accessible-color-picker](https://github.com/kleinfreund/vue-accessible-color-picker) - Accessible color picker component for Vue.js.
- [vue-autosuggest](https://github.com/darrenjennings/vue-autosuggest) - Vue autosuggest component.
- [vue-a11y-dialog](https://github.com/morkro/vue-a11y-dialog) - Vue.js wrapper for `a11y-dialog` .
- [vue-accessible-tabs](https://github.com/jakedohm/vue-accessible-tabs) - An accessible, unstyled implementation for Vue 2
- [vue-toggles](https://github.com/juliandreas/vue-toggles) - A highly customizable and accessible toggle component
- [vue-accessibility-list](https://github.com/romulorodrigues/vue-accessibility-list) - An accessibility list for your project with the options: increase / decrease font and high contrast.
- [vue-visually-hidden](https://github.com/yamanoku/vue-visually-hidden) - Vue.js visually hidden component for Vue 3
### Development
- [vue-axe](https://github.com/vue-a11y/vue-axe) - Accessibility auditing for Vue.js applications.
- [vue-axe-next](https://github.com/vue-a11y/vue-axe-next) - Dynamic accessibility analysis for Vue.js 3 using axe-core.
- [eslint-plugin-vuejs-accessibility](https://github.com/vue-a11y/eslint-plugin-vuejs-accessibility) - An [eslint](https://eslint.org/) plugin for checking accessibility rules from within `.vue` files.
### Vuepress
- [vuepress-theme-default-vue-a11y](https://github.com/vue-a11y/vuepress-theme-default-vue-a11y) - Vuepress theme for vue-a11y documentation
## Accessible libraries
- [Vuetensils](https://vuetensils.stegosource.com/) - A "naked" component library for building accessible, lightweight, on-brand applications.
- [Vuetify](https://vuetifyjs.com/en/) - Material Design Component Framework.
- [BootstrapVue](https://bootstrap-vue.js.org/) - Bootstrap v4 component and grid system for Vue.js, complete with extensive and automated WAI-ARIA accessibility markup.
- [@chakra-ui/vue](https://github.com/chakra-ui/chakra-ui-vue) - Build scalable and accessible Vue.js applications with ease.
## Accessible projects
- [Tournant UI](https://github.com/tournantdev/ui) - Inclusive Vue Components
## License
[](https://creativecommons.org/publicdomain/zero/1.0/)