While studying the Web Accessibility course from Google by Udacity, I came across this video explaining how to use the Mac VoiceOver as a screen reader to navigate the web and I thought it would be a great idea to share it. I also included the course description included with the video as a guide and a reference (video and the information credit goes to the course).
F5to turn on VoiceOver on OS X.
TAB, arrow keys etc.) work as normal with VoiceOver running.
Lto jump to address bar.
Uto open Web Rotor.
→to explore content.
Hto move forward by heading.
Hto move backward by heading.
WebAIM’s article on Using VoiceOver to evaluate Web Accessibility has a full introduction to VoiceOver from the point of view of evaluating accessibility, including most keyboard commands available.
If you only use Linux, Orca is available in the Gnome desktop manager, although this screen reader is much more rarely used and suffers from poor support by web browsers.
I finished and would recommend this Web Accessibility course from Google by Udacity.
Accessibility is something I wasn’t taking it serious before. I was reading some bits here and there without understanding and seeing the big picture if using it.
The important thing is that there is a wide range of people who might have some disabilities. By ignoring them, you will make their life harder and they will end up leaving. The web should be available to everyone.
Think about how someone who is blind using the VoiceOver. A simple case, someone who is only able to use the keyboard to navigate your website or app.
I encourage you to stop using the mouse for a while. You can use your keyboard to navigate different websites. Also, you can use the ChromeVox or VoiceOver as a screen reader.
The problem comes with no awareness about it. No budget, or not learning about it at the start of learning web development as a single topic.
Somehow we ignore it from the start and jump into writing HTML. This happens without thinking about the people who might use the final product.
The course helped me to connect the dots and to think about the people while writing code or Developing with Empathy as the course said.
Today, I’m just happy to create and release an update for my website with a simple and minimal design. What I need is something that reflects the way that I believe and the way I work, just to make things simple and functional as possible.
I have used Jekyll as a static site generator with GitHub and Netlify to deploy the website. Also, I have used Sass and ITCSS to organize the CSS code. You can find the source code at ahmadajmi.github.io.