Topics

1. Webaccessibility
2. Inclusive Design
3. https://dev.to/ezgihendrickx/11-golden-rules-for-a11y-146c

As a self-taught front-end developer, when I discovered the concepts of accessibility and inclusive design a few months ago, I did not know much about it. But I realised that many of us, in this web dev field, also don't know much about it. It is regrettable but accessibility is not the best field to invest in these days. It is just a popular buzzword which sometimes comes in and out of our attention. But we can really make a difference when we decide to start learning more about this. And possibly this would just be a small drop in the ocean but we really need that to achieve our goals. Are you ready or eager to learn more?

What does A11Y stand for?

“a11y” stands for “accessibility.” It is a numeronym, with 11 representing the count of letters between the letter a and the letter y. Other numeronyms you may be familiar with include: i18n (internationalization), P2P (peer to peer) etc.

What is Inclusive Design?

Making websites accessible to everyone..

What would you do if you knew that 1 billion people can not access your website?

Inclusive Design and accessibility have become somewhat buzzwords in the web design-dev community. But it is not something that has been just invented recently.

Do you know the first purpose of the image Alt text?

It is used to textually describe non-textual content on a web page and make it readable for screen readers.

Web Accessibility CheckList

A beginner's guide to web accessibility

11 Golden Rules for Accessibility

Which steps should we follow when we create a website?

The below rules are important and deserve our attention not only for accessibility but also for the usability of your website.

1. Always use a meaningful Alt text: Screen readers may read out ugly, nonsense filenames to describe images. We don't want that as responsible developers right :smirk: ?
2. Define the level of accessibility of your website and follow the guidelines : Web Content Accessibility Guidelines This website should be your holy book when you want to get inspired :closed_book: .
3. Optimise Color Contrast: Getstark This is one of the color optimization platforms where you can find more information about optimising colours for accessibility.
4. Simplify the language: We don't need complicated or sophisticated words to have a website. Someone once said that if you cannot explain your work simply then you don't understand it well enough.. Keep your content always simple and understandable, and keep your layout clear.
5. Lead the users: e.g. Always use form labels to describe input fields and place holders. Keep in mind that acceptable input field examples are really handy and useful.
6. Always provide captions for video content. Without captions it is meaningless to a person with a permanent or temporary visual problem. Never ever have your video automatically begin playing.
7. Don't forget to test keyboard navigation. A user should have the right to use his/her keyboard to navigate the website. We cannot take this advantage away from them.
8. Create large buttons! You don't have to be a designer to create large buttons. In this way it is more clear that this is a clickable button and it calls an action.
9. Create understandable links: Have you ever thought: "I don't know where to click or where to go"? Yes! This is the reason why we need to be clear when we create links. Every link should have a meaningful reason behind it. So don't just make a href because you love a href..
10. Use semantic HTML elements: What on earth is semantic markup? Semantic elements mean elements with a meaning.<main>, <nav>, <header>, <section>, <article>, <form>and so on. Semantic elements clearly define its content.
11. Use ARIA landmark roles to add feature context to HTML elements. Aria Landmark Features

If you followed all the golden rules and are not sure where to ask, then ask the community: A11Y Project; they have the Accessibility Checklist for beginners to guide and enlighten you..

In a nutshell, Accessibility and Inclusive Design are really import to increase web content quality and make the standards higher on the web. Everyone has the right to reach your content. We should be more aware of these different aspects of web design and development.. I encourage you to everyday apply one new accessibility guideline on your website and enjoy while teaching to others.

Useful links to learn more:

• https://www.w3.org/WAI/standards-guidelines/wcag/
• https://www.a11yproject.com/
• https://www.edx.org/course/web-accessibility-introduction
• https://www.webaccessibility.com/

Please do not hesitate to give any comment and add more sources or knowledge about accessibility.

Thank you for reading.