https://github.com/raihan71/web-a11y-guide
web accessibility guidelines
https://github.com/raihan71/web-a11y-guide
Last synced: 3 months ago
JSON representation
web accessibility guidelines
- Host: GitHub
- URL: https://github.com/raihan71/web-a11y-guide
- Owner: raihan71
- Created: 2023-05-18T05:43:48.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2024-08-03T10:34:19.000Z (10 months ago)
- Last Synced: 2024-08-03T11:43:01.237Z (10 months ago)
- Size: 14.6 KB
- Stars: 7
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# web-a11y-guide πͺπ¦Ύπ¦Ώπ§ββοΈπ¨π»βπ¦―
Web accessibility guidelinesWeb accessibility is about recognizing the importance of designing websites that are accessible to all users, understanding the guidelines and best practices, and implementing inclusive design principles to ensure a more inclusive and equitable digital environment. See the docs of a11y on how to write web benefits for everyone below.
Links
-----
#### General
- [Intro to Web A11Y][0]
- [Mozilla: Accessibility][1]
- [HTML Accessibility][3]
- [Text to speech in Vue.js][4]
- [ChromeVox: screen reader][10]
- [Introduction to Aria by Google][11]
- [Udacity's Course - Web Accessibility][13]
- [Other links you may like to explore !!!][14]
- [Intro to aria][15]
- [Acccessibility for designer][16]
- [Adding screen reader built-in on your web][17]
- [Accessibility Cheat Sheet][18]
- [Web Accessibility Guidance project][19][0]: https://www.w3.org/WAI/fundamentals/accessibility-intro
[1]: https://developer.mozilla.org/en-US/docs/Web/Accessibility
[2]: https://legacy.reactjs.org/docs/accessibility.html
[3]: https://www.w3schools.com/html/html_accessibility.asp
[4]: https://fontawesomeicons.com/tryit/code/vue-js-convert-text-to-speech/0
[10]: https://chrome.google.com/webstore/detail/screen-reader/kgejglhpjiefppelpmljglcjbhoiplfn?hl=en
[11]: https://web.dev/semantics-aria/
[12]: https://medium.com/@raihannismara/unit-testing-for-web-a11y-in-advanced-4ea6f518b087
[13]: https://www.udacity.com/course/web-accessibility--ud891
[14]: https://stephaniewalter.design/blog/accessibility-resources-tools-articles-books-for-designer/
[15]: https://youtu.be/g9Qff0b-lHk?si=S6WS9RsDDDXWh9mK
[16]: https://stephaniewalter.design/blog/accessibility-resources-tools-articles-books-for-designer/
[17]: https://mikewest.org/2011/12/transcript-gdd-accessibility-with-chromevox/
[18]: https://learntheweb.courses/topics/accessibility-cheat-sheet/
[19]: https://govtnz.github.io/web-a11y-guidance/
[20]: https://codelabs.developers.google.com/angular-a11y#12
[21]: https://circleci.com/blog/cypress-accessibility-testing/
[22]: https://testing-library.com/docs/dom-testing-library/api-accessibility/
[23]: https://www.cypress.io/blog/2023/06/13/maintaining-accessibility-through-user-focused-testing
[27]: https://github.com/GovTechSG/purple-a11y/blob/master/INTEGRATION.md?rgh-link-date=2024-07-26T03%3A30%3A24Z
[28]: https://www.youtube.com/watch?v=kz9e81oRs3Y
[29]: https://reactjs.org/docs/accessibility.html
[30]: https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_accessibility#### React
- [Accessibility in react by Mozilla][30]
- [a11y in React.js][2]
- [React Accessibility Essentials][29]
- [React & Accessibility Fundamentals][28]#### Angular
- [Angular a11y: build more accessible apps][20]
#### Unit Testing
- [Unit testing accessibility in advanced][12]
- [Accessibility testing with Cypress][21]
- [Maintaining Accessibility thru Cypress][23]
- [Testing Library Accessibility Aspect][22]
- [Purple A11y Integration with Cypress/playwright][27]Tools
-----
- [axe DevTools][26]
- [Purple A11y][25]Showcase
------ [Trademe][5]
- [Tokopedia][6]
- [Traveloka][7]
- [Raihan.my.id][8]
- [ReactTodos Spectrum][24][5]: https://www.trademe.co.nz/
[6]: https://www.tokopedia.com/
[7]: https://www.traveloka.com/
[8]: https://raihan.my.id/
[24]: https://react-todos-omega.vercel.app/[25]: https://github.com/GovTechSG/purple-a11y
[26]: https://www.deque.com/axe/devtools/