Accessibility First DevRel. I focus on ensuring content created, events held and company assets are as accessible as possible, for as many people as possible.
Sorry for the slow reply, still getting used to the site and the comments system is a bit clunky when you aren't used to it!
The best way to learn accessibility stuff is to download a screen reader (NVDA is free), read how to use it and then try and use websites.
Then when you come to something that doesn't work such as an accordion Google "how to make an accessible accordion".
That will take you down a massive rabbit hole learning about WAI-ARIA, WCAG etc.
Golden rule when starting out is to always try and use native and semantically correct elements. For example if clicking something causes an action on the same page it should be a <button> element. If it takes you to another page (or an anchor / id on the same page) it should be an anchor <a>. You often see people using an anchor with an empty href (<a href="#") - that is an example of using the wrong element for the job as that should be a <button>!
A site I really liked when I was learning about WCAG is called wuhcag.com - they explain the WCAG rules in a simplified way.
Also dboudreau.tumblr.com/archive is nicely presented with a user story to explain why something is important. The blog is a little older so it doesn't contain the latest guidance but 90% of stuff is there.
Finally just do a search on dev.to for accessibility, I am sure there are loads of good articles such as this one you just read by Spyros on the "why" and articles such as this article on accessibility tips from @addyosmani
(who is worth following).
Finally a really quick way to get you in the mindset of accessibility is to hide your mouse! Try using anything you build with just the keyboard and see if you lose where the focus is, can't interact with important elements etc. and you will be an accessibility wizard in no time!
Thanks a lot for the guidance! I try using as much as possible the semantic tags as I find they are useful for reading the code anyways! I’ll have to try using a screen reader for sure though!
Some comments have been hidden by the post's author - find out more
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Sorry for the slow reply, still getting used to the site and the comments system is a bit clunky when you aren't used to it!
The best way to learn accessibility stuff is to download a screen reader (NVDA is free), read how to use it and then try and use websites.
Then when you come to something that doesn't work such as an accordion Google "how to make an accessible accordion".
That will take you down a massive rabbit hole learning about WAI-ARIA, WCAG etc.
Golden rule when starting out is to always try and use native and semantically correct elements. For example if clicking something causes an action on the same page it should be a
<button>element. If it takes you to another page (or an anchor / id on the same page) it should be an anchor<a>. You often see people using an anchor with an emptyhref(<a href="#") - that is an example of using the wrong element for the job as that should be a<button>!A site I really liked when I was learning about WCAG is called wuhcag.com - they explain the WCAG rules in a simplified way.
Also dboudreau.tumblr.com/archive is nicely presented with a user story to explain why something is important. The blog is a little older so it doesn't contain the latest guidance but 90% of stuff is there.
Finally just do a search on dev.to for accessibility, I am sure there are loads of good articles such as this one you just read by Spyros on the "why" and articles such as this article on accessibility tips from @addyosmani (who is worth following).
Finally a really quick way to get you in the mindset of accessibility is to hide your mouse! Try using anything you build with just the keyboard and see if you lose where the focus is, can't interact with important elements etc. and you will be an accessibility wizard in no time!
Thanks a lot for the guidance! I try using as much as possible the semantic tags as I find they are useful for reading the code anyways! I’ll have to try using a screen reader for sure though!