What is accessibility?
Accessibility is about creating code that gives access to people with disabilities (hearing impaired, vision impaired, etc.) in a way that can be interpreted by assisting machines or software by making it semantically correct.
How do people interpret websites without vision?
Using assistive software creates an interface that overrides the disability, for example, a screen reader.
How does semantic HTML help make websites accessible?
By clearly indicating the purpose of each element on a webpage, so instead of a bunch of Div’s, each component would indicate if it is a paragraph, a button, an image, a video, etc. Semantic HTML can also indicate the hierarchy of the elements, giving a clear structure of the information.
Name a few practices to avoid when writing HTML.
- Avoid using
<b> and use heading tags <h1>, <h2>, etc. that indicate hierarchy.
- Avoid using
<div> for elements that already have an HTML definition, like buttons, tables, articles, paragraphs, lists, etc.
- Avoid images that lack the
<alt> tags information.
- Avoid links that are not self-explanatory.
- Try not to forget to declare the language used in the header (English, Spanish, etc.)
What is a tab index?
A tab index is an HTML attribute that allows to navigate using the TAB key instead of using a mouse. For example, using:
<div tabindex="1">Bing</div><br>
<div tabindex="3">Google</div><br>
<div tabindex="2">Microsoft</div>
allows moving from Bing to Google and Microsoft by clicking the tab key instead of using a mouse.
