The current state of modal dialog accessibility - TPGi
Modal dialogs continue to be troublesome UI components all across the web. Putting aside the fact they are often misused and thrust on users in a manner that interrupts their current task (asking me to sign up for your newsletter, while I’m in the middle of reading an article, is not cool), even appropriately used modals often lack considerations for accessibility. While poor modal dialog UX is st
short-note-on-what-css-display-properties-do-to-table-semantics
The CSS display properties are powerful. You can change the visual display of elements to match your desired styling, but sometimes doing this can have an unintended effect of nuking the semantics of the elements, as conveyed to screen reading software, in the browser accessibility tree. Screen readers and other assistive tech, in general, do not have direct access to the HTML DOM, they are provid
Mobile Accessibility Testing Guide for Android and iOS - free - TPGi
The TPGi Mobile Accessibility Testing for Android and iOS (PDF, 2.6MB) is a free accessible PDF outlining how to test native apps and the web for accessibility on Android and iOS. It provides an overview of accessibility settings, how to use them and common testing tools. Instructions on how to test content are provided for Android Talkback, iOS VoiceOver, zoom and switch settings. Also included a
Using ARIA to enhance SVG accessibility - TPGi
Jaws 15 and Internet Explorer 10 is the best combination at present, although nested SVG images are not well supported. NVDA and Internet Explorer present the role, title and desc, but support is erratic with multiple images announced and repetition of the title and desc. In all other browser/screen reader combinations the SVG is ignored. ARIA enhanced SVG accessibility It is possible to enhance t
Flipboard - React Canvas Accessibility - TPGi
Testing the Flipboard site on a mobile device such as an iPhone, quickly reveals that the content is not available to screen reader users. This is because the content is painted onto a canvas element using React Canvas. The words, structure and UI are all visual, there is nothing but pixels. Reading the React Canvas documentation. It states: Accessibility This area needs further exploration. Using
Using aria-describedby to provide helpful form hints - TPGi
When a form field has a label, screen readers will announce it automatically when focus moves to the field. If additional information is available to help people complete the task, it’s also a good idea to associate it with the field in question. Quick label recap: <label for="password">Choose a password</label> <input type="password" id="password" …> If this field was included in a form for creat
Using the HTML title attribute - updated March 2020 - TPGi
Takeaway If you want to hide content from mobile and tablet users as well as assistive tech users and keyboard only users, use the title attribute. The details The HTML title attribute is problematic. It is problematic because it is not well supported in some crucial respects, even though it has been with us for over 23 years. With the rise of touch screen interfaces, the usefulness of this attrib
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Screen Readers support for text level HTML semantics - TPGi
Accessible WordPress Page builder - TPGi
Short note on the accessibility of styled form controls - TPGi
iOS & Android Screen Reader Gesture Reference Cheatsheet | Blog
The state of hidden content support in 2016 - TPGi
Accessibility Viewer (aViewer) | The Paciello Group – Your Accessibility Partner (WCAG 2.0/508 audits, VPAT, usability and accessible user experience)