Скачать или смотреть Why Semantic HTML Matters: Intro to Accessibility and VoiceOver

In this beginner frontend development tutorial, you'll learn how the usability of VoiceOver is driven by semantic HTML - HTML which is formatted in a way that reflects its meaning to a user. You'll learn how choosing elements in HTML affects screen readers, see demonstrations of what a screen reader looks like in action, and best practices for writing and marking up content in an accessible way.

Chapters in this video:

[00:00] Introduction
[00:52] What is VoiceOver?
[01:50] Demonstration: keyboard navigation
[02:19] Why descriptive link text is so important for screen readers in HTML content
[03:15] What is a skip link in HTML?
[04:25] How a link which wraps other HTML content reads off on VoiceOver
[05:01] Navigation using VoiceOver: The Rotor Menu
[05:34] How does HTML affect the Links Menu?
[06:16] How the Headings Menu connects to HTML structure
[07:33] Demonstration: Using the Headings Level Menu in VoiceOver
[08:00] How to think about structuring your HTML when writing content for accessibility
[08:33] Demonstration: Find Menu in VoiceOver
[09:19] Conclusion