惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

K
Kaspersky official blog
小众软件
小众软件
Engineering at Meta
Engineering at Meta
博客园 - 三生石上(FineUI控件)
WordPress大学
WordPress大学
G
Google Developers Blog
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
V
V2EX
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
Google DeepMind News
Google DeepMind News
Security Archives - TechRepublic
Security Archives - TechRepublic
CTFtime.org: upcoming CTF events
CTFtime.org: upcoming CTF events
C
Check Point Blog
aimingoo的专栏
aimingoo的专栏
罗磊的独立博客
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
MongoDB | Blog
MongoDB | Blog
L
LINUX DO - 热门话题
酷 壳 – CoolShell
酷 壳 – CoolShell
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
H
Help Net Security
Martin Fowler
Martin Fowler
G
GRAHAM CLULEY
Simon Willison's Weblog
Simon Willison's Weblog
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
博客园 - Franky
V
Vulnerabilities – Threatpost
云风的 BLOG
云风的 BLOG
博客园_首页
C
Cybersecurity and Infrastructure Security Agency CISA
量子位
Stack Overflow Blog
Stack Overflow Blog
Recent Announcements
Recent Announcements
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
I
Intezer
Scott Helme
Scott Helme
A
About on SuperTechFans
博客园 - 司徒正美
Hacker News: Ask HN
Hacker News: Ask HN
The GitHub Blog
The GitHub Blog
Forbes - Security
Forbes - Security
Threat Intelligence Blog | Flashpoint
Threat Intelligence Blog | Flashpoint
博客园 - 聂微东
人人都是产品经理
人人都是产品经理
The Cloudflare Blog
cs.CV updates on arXiv.org
cs.CV updates on arXiv.org
Spread Privacy
Spread Privacy
T
Tailwind CSS Blog
S
Security Affairs
宝玉的分享
宝玉的分享

TetraLogical Blog

Designing for people with reading disabilities - TetraLogical Designing for people who are D/deaf - TetraLogical Designing accessible documents - TetraLogical Introduction to creating accessible documents - TetraLogical Inclusive user research: vulnerable people - TetraLogical Designing for people who are blind - TetraLogical Designing for people with low vision - TetraLogical Meet the team: Niamh Madden - TetraLogical Designing for people with anxiety - TetraLogical Designing for people with disabilities - TetraLogical Accessible building blocks for the web videos - TetraLogical Common accessibility misconceptions - TetraLogical Common misconceptions about testing accessibility - TetraLogical Common misconceptions about implementing accessibility - TetraLogical Common misconceptions about WCAG - TetraLogical Common misconceptions about disability - TetraLogical Meet the team: Grace Snow - TetraLogical Sustainable accessibility in complex organisations: strategic foundations - TetraLogical Sustainable accessibility in complex organisations: organisational realities - TetraLogical Sustainable accessibility in complex organisations: external factors - TetraLogical Common misconceptions about screen readers - TetraLogical Guide to the Inclusive Design Principles - TetraLogical Meet the team: Ian Lloyd - TetraLogical Annotating designs using common language - TetraLogical Meet the team: Catriona Morrison - TetraLogical Championing inclusive language - TetraLogical Press release: TetraLogical launches accessible self-led training courses to help digital teams build confidence in accessibility - TetraLogical Why inclusive products are green products - TetraLogical Accessible Recruitment - TetraLogical Accessibility and the agentic web - TetraLogical Meet the team: Craig Abbott - TetraLogical Foundations: types of assistive technology and adaptive strategies - TetraLogical European Accessibility Act (EAA) FAQ - TetraLogical Screen reader HTML support tables - TetraLogical Interview with Lola Odelola - TetraLogical Understanding EN 17161 Design for All - TetraLogical Inclusive user research: building rapport - TetraLogical Foundations: Keyboard accessibility - TetraLogical Can generative AI write contextual text descriptions? - TetraLogical Understanding the European Accessibility Act (EAA) - TetraLogical Meet Josh: a sportsman who has spinal muscular atrophy - TetraLogical Meet Jonathan: a photographer who has ADHD - TetraLogical Foundations: grouping forms with `<fieldset>` and `<legend>` - TetraLogical XR Accessibility: for people with moving disabilities - TetraLogical Meet Andre: a music producer and blind screen reader user - TetraLogical Foundations: types of disability - TetraLogical Meet Lauren: a film editor who has ADHD - TetraLogical Meet Steve: a photographer who is deaf and low vision - TetraLogical Foundations: form validation and error messages - TetraLogical Meet Hasmukh: a blind cricketer and screen reader user - TetraLogical XR Accessibility: for people with hearing disabilities - TetraLogical XR Accessibility: for people with thinking disabilities - TetraLogical XR Accessibility: for people with seeing disabilities - TetraLogical Introduction to XR Accessibility - TetraLogical Foundations: labelling text fields with input and label - TetraLogical Design patterns and WCAG - TetraLogical Does WCAG 2.2 apply to native apps - TetraLogical Why are my live regions not working? - TetraLogical Building a culture of accessibility - TetraLogical When to use tabindex= Accessibility foundations - TetraLogical Meet the team: Demelza Feltham - TetraLogical Can generative AI help write accessible code? - TetraLogical Meet the team: Steve Faulkner - TetraLogical Meet the team: Gez Lemon - TetraLogical Keyboard accessibility myths and WCAG - TetraLogical Amendment to the Public Sector Accessibility Regulations - TetraLogical What Considerations for TV user interface accessibility - TetraLogical Meet the team: Alistair Duggin - TetraLogical Sticky content: focus in view - TetraLogical The only accessibility specialist in the room - TetraLogical Meet the team: Ian Pouncey - TetraLogical Meet the team: Dean Holden - TetraLogical Meeting WCAG Level AAA - TetraLogical Foundations: accessible names and descriptions - TetraLogical Inclusive XR: accessible augmented reality experiences - TetraLogical Foundations: pointer gestures - TetraLogical Meet the team: Graeme Coleman - TetraLogical Adding sign language to videos - TetraLogical Foundations: introduction to WAI-ARIA - TetraLogical Meet the team: Joe Lamyman - TetraLogical Inclusive XR: accessible 3D experiences - TetraLogical Foundations: visible focus styles - TetraLogical Foundations: target sizes - TetraLogical Meet the team: Henny Swan - TetraLogical Meet the team: Ela Gorla - TetraLogical Foundations: native versus custom components - TetraLogical Foundations: HTML semantics - TetraLogical Accessibility and supporting Internet Explorer - TetraLogical Meet the team: Felicity Miners-Jones - TetraLogical Accessibility and QR codes - TetraLogical Inclusive user research: recruiting participants - TetraLogical Research insight: accessibility of images - TetraLogical Meet the team: Léonie Watson - TetraLogical Android accessibility: roles and TalkBack - TetraLogical Accessible design systems - TetraLogical Meet the team: Patrick H. Lauke - TetraLogical Inclusive user research: analysing findings - TetraLogical How to write user stories for accessibility - TetraLogical
Browsing with assistive technology videos - TetraLogical
2021-12-24 · via TetraLogical Blog

[The TetraLogical logo whooshes into view on a white background. The logo flashes and stops with a sonar-like 'ping'. It then magnifies and fades out.]

[A dark purple background appears with the TetraLogical logo faintly overlaid]

Browsing with a desktop screen reader

Screen readers announce everything on a web page and within an application.

All static text is spoken including paragraphs of text, headings and lists.

[The TetraLogical homepage appears with a horizontal list of links for main navigation at the top, a heading, and the body of the page content below]

Screen readers also announce additional information such as text descriptions for images, visually hidden text, and the names of landmark regions (for example banner, main and footer) when browsing web content.

As an example, here's an extract from the TetraLogical.com site, as experienced with a screen reader.

[The NVDA screen reader starts reading out information as the visible focus in the form of a solid coloured line, moves around the page]

[NVDA] Link, skip to main content, visited link, graphic, TetraLogical, main navigation landmark, list with four items, visited link About, visited link Services, visited link News, visited link Blog, Out of list, Main landmark, Heading level 1, Hello, we're TetraLogical, We're a company with, inclusion at its heart., We specialise in all aspects of accessibility, from working with your, websites and apps to giving your teams the skills they need to make accessibility part of everything they do.

[A new webpage appears with the title "Checkbox". Two checkbox items appear above a purple "submit" button]

For interactive elements, screen readers will not only announce the name and role of the element, but its current state as well.

In this example, we're using NVDA to navigate to an unchecked checkbox, and then check it.

[NVDA reads aloud as the visible focus moves to the checkbox and then selects it so a tick appears]

[NVDA] Checkbox, document, Checkbox not checked, I have read the terms and conditions, Checked

[The TetraLogical homepage reappears]

The basic navigation for people who use a screen reader is the same as that used by keyboard users in general.

[A purple button with the text "Skip to main content" appears]

The Tab key is used to navigate to the next focusable element, such as links, buttons or form inputs.

[As the user navigates through the main menu using the tab key, an overlay with the word "tab" on appears]

To move backwards, you use Shift + Tab.

Enter is used to activate links.

[The visible focus solid line changes to a dotted line on the "Blog" item in the menu bar]

Enter or Space activate buttons.

[The visible focus moves down the page, highlighting each element as it is read aloud]

The arrow keys are used to navigate static content such as text, as well as to interact with components such as menus, tab panels, sliders, select dropdowns, and groups of radio buttons.

Beyond the basics, however, people who use a screen reader have many more keyboard commands at their disposal.

[The TetraLogical homepage fades back into view. The user slowly scrolls down the page]

Where sighted people will visually scan a page, then make decisions about where to navigate to or what to concentrate on, screen reader users will do the same but with keyboard commands.

[A mouse hovers over a button with "hello@tetralogical.com"]

While screen readers often have different keyboard commands, people tend to use the same general strategy for exploring, navigating, and reading content.

[The TetraLogical homepage fades back into view.]

When opening a web page, screen readers will automatically read the page from top to bottom, starting with the page title. It's common for people to stop the screen reader, then explore the content for themselves.

A common strategy is to scan a page using headings or landmark regions, then use other keyboard commands to explore relevant content in more detail.

This enables people to understand the overall structure of content, before deciding what to do next.

For example, a screen reader user may navigate between the headings on the page until they find one that seems to preface the content they're looking for.

Then they'll use more keyboard commands to read the subsequent content, activate a link, or perform some other task.

In this example, we're using NVDA to navigate between the headings on the TetraLogical website using the H key.

Once we reach a heading that interests us, we continue using the Tab key to reach the following link.

[NVDA] Hello, we're TetraLogical, heading level 1. [The focus jumps down the page onto the "News" heading] News, heading level 2, [it continues to jump down as each new heading is announced] Blog, heading level 2, Contact us, heading level 2, Main region, hello@tetralogical.com, send mail link.

[The TetraLogical homepage appears again. A dialogue box is now displayed with the NVDA settings]

Probably the most common setting people change is the rate of speech output.

Many people who use screen readers on a daily basis listen to the speech output very fast. This is similar to how someone who is sighted might skim read and read fast in their head. The speech rate can be so fast that output is almost impossible to follow for people unaccustomed to screen readers.

As an example, here we change the speaking rate in NVDA's Speech settings from 60% to 100%, and then read through content on the TetraLogical website's homepage.

[The focus moves to the "Rate" slider. The user moves the mouse to increase this to its maximum. The focus moves down in the page as the screen reader reads the content aloud]

[NVDA] Rate, slider 60, Alt+R 100, Main landmark, Hello, we're TetraLogical, heading level 1. We're a company with inclusion at its heart. We specialise in all aspects of accessibility, from working with your websites and apps to giving your teams the skills they need to make accessibility part of everything they do.

These are some of the high level details, about desktop screen readers, and common strategies that people browsing with a desktop screen reader use.

[The screen fades to white and the TetraLogical logo appears again]

To find out more about accessibility visit tetralogical.com.