Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/vue-a11y/vue-announcer
A simple way with Vue to announce any useful information for screen readers.
https://github.com/vue-a11y/vue-announcer
a11y accessibility announcer screen-readers vue vue-announcer vuejs
Last synced: about 2 months ago
JSON representation
A simple way with Vue to announce any useful information for screen readers.
- Host: GitHub
- URL: https://github.com/vue-a11y/vue-announcer
- Owner: vue-a11y
- License: mit
- Created: 2018-05-19T23:13:17.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2023-05-21T13:59:39.000Z (over 1 year ago)
- Last Synced: 2024-04-14T06:52:01.170Z (5 months ago)
- Topics: a11y, accessibility, announcer, screen-readers, vue, vue-announcer, vuejs
- Language: JavaScript
- Homepage:
- Size: 2.09 MB
- Stars: 229
- Watchers: 10
- Forks: 9
- Open Issues: 25
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
- awesome-a11y-vue - @vue-a11y/announcer - A simple way with Vue to announce any useful information for screen readers. (Components and plugins / Courses)
- awesome-access - @vue-a11y/announcer - A simple way with Vue to announce any useful information for screen readers. (Components and plugins / Courses)
README
# [@vue-a11y/announcer](https://github.com/vue-a11y/vue-announcer/)
---
🔥 HEADS UP! You are in the Vue 2 compatible branch, [check the "next" branch for Vue 3 support](https://github.com/vue-a11y/vue-announcer/tree/next).
---
## Introduction
Imagine browsing pages (routes), receiving alerts and notifications, having a countdown timer on the page, a progress bar, a loading or a change of route in a SPA. Now imagine all this happening to people who have visual disabilities and who use screen readers.
The [@vue-a11y/announcer](https://github.com/vue-a11y/vue-announcer) (v2) provides an easy way to really tell what’s going on in your application to people using screen readers.
> For vue-announcer version 1.* you can access [this link](https://github.com/vue-a11y/vue-announcer/tree/v1.0.6)
Inspired by others in the community like:
- [Example of how creating an accessible single-page application](https://haltersweb.github.io/Accessibility/spa.html)
- [Ember A11y community](https://github.com/ember-a11y/a11y-announcer)
## Links
- [Documentation](https://announcer.vue-a11y.com/)
- [Demos](https://vue-announcer-v2.surge.sh/demos/)
## Run the tests
```shell
git clone https://github.com/vue-a11y/vue-announcer.git vue-announcer
# Run plugin
cd vue-announcer
npm install
npm run dev
# Run example
cd examples
npm install
npm run dev
cd ..
# Run Cypress testing
npm run test
```
Or run Cypress on interactive mode
```shell
npm run test:open
```
It is a simple webpack template already installed and configured.
After the commands just access the http://localhost:8080/
## Contributing
- From typos in documentation to coding new features;
- Check the open issues or open a new issue to start a discussion around your feature idea or the bug you found;
- Fork repository, make changes and send a pull request;
Follow us on Twitter [@vue_a11y](https://twitter.com/vue_a11y)
**Thank you**