Coding for Beginners: Web Accessibility #17— Building Websites with Good Structure for Accessibility
Interested in Web Access Pro to analyze and fix Accessibility Errors on your site? Get your 14 Day Free Trial: https://join.designerslearncode.com/w...
The Daily Code Snippet is part of our "Coding for Beginners" video series for designers to learn the basics of HTML and CSS coding. We teach a single, easy to understand concept in each video so that you can learn to code even if you have a busy schedule. Subscribe here: / @designerslearncode
------
Another key to making your website more accessible is by using good structure when writing your code. Identify major sections as discussed with last week's aria landmarks and the html5 that identifies the header, main, footer, sections, articles, asides and navigation. Screen readers will also use your headings to help navigate through the content so it is important that you label content with the appropriate hierarchy. Emphasize important topics by using subheadings while reserving the main heading for the primary title of the page and breaking up supporting content and identifying them with lesser headings. Don't use headings because they make the type size bigger or for stylistic purposes. This should be the job of your styles or cascading style sheets (CSS). Avoid skipping headings as the devices may think content is missing.
Paragraph text should be labeled as such and use unordered and ordered lists to help break up the content so it is easy to pick up key points. Your website should be organized so your user is not confused. And this will help those navigating your website using assistive devices such as screen readers.
Writing clear code is a key to accessible design and this will come with practice. Always imagine that your code will be read by another person and they need to be able to understand it. It will help you to not take shortcuts that only you understand. Follow accepted best practices when writing your code.
#HTML #CSS #coding #webdesign #web #designerslearnode #dailycodesnippet #codingforbeginners #accessibility #learntocode #cleancode #goodstructure #arialandmarks #consistentlayout #organizedlayout #webaccessibility #disability #disabilityawareness #inclusion #webdevelopment #learntocodeforbeginners #webaccessibilitytutorial #webdevelopmentcourse #webdevelopmenttutorial #htmlcsstutorial #htmlcsscourse