38 private links
Favorited tweet: What is the accessibility tree? If you're a dev & you're not sure, check out this from @marcysutton https://t.co/hPU61BQf2W
Narrator is the integrated screen reader for Windows 10. The August 2nd Windows 10 Anniversary update introduces several new Narrator features, including a Narrator mode designed specifically for web developers.
A demonstration of how to implement a keyboard and screen reader accessible mega menu as a jQuery plugin. It is modeled after the mega menu on adobe.com but has been simplified for use by others. An brief explanation of our interaction design choices can be found in a blog post at Mega menu accessibility on adobe.com.
Accessibility is often solely discussed in terms of people with disabilities. It is also quickly dismissed by smaller companies and startups because they argue that they don't have time and resources to consider this group. via Pocket
Forms. Without them, the web would not be what it is today, but they are challenging from a markup and styling standpoint.
In this session, we will explore forms from top to bottom, examining how they work and how their components can be incorporated with other elements to maximize accessibility, improve semantics, and allow for more flexible styling. You’ll get to see the complete picture with forms, including
- new HTML5 field types;
- validation, error messages & formatting hints;
- how to mark up and style forms for the greatest flexibility in responsive designs; and
- best practices for enhancing forms with JavaScript.
SVG1.1 accessibility support is limited in browsers and screen readers. Things are set to improve with SVG2, but ARIA can be used now to improve the accessibility of simple SVG.
Some practical ARIA examples to enhance your application accessibility (by @heydonworks).
certainlyakey starred WebDevStudios/wd_s
Do you add a descriptive title attribute to your links? Did you know that you might be making your site even less accessible? Everything I thought I knew about the title attribute was proved wrong when I started using a screenreader.
Icons are everywhere. These “little miracle workers” (as John Hicks described them) help us reinforce meaning in the interfaces we design and build. Their popularity in web design has never been greater; the conciseness and versatility of pictograms in particular make them a lovely fit for displays large and small.
But icons on the web have had their fair share of challenges. They were time-consuming to prepare for every intended display size and color. When high-resolution displays hit the market, icons looked particularly low-res and blocky compared to the text they often accompanied.
So it’s really no wonder that icon fonts became such a hit. Icons displayed via @font-face were resolution-independent and customizable in all the ways we expected text to be. Sure, delivering icons as a typeface was definitely a hack, but it was also useful, versatile, and maybe even a little fun.
But now we need to stop. It’s time to let icon fonts pass on to Hack Heaven, where they can frolic with table-based layouts, Bullet-Proof Rounded Corners and Scalable Inman Flash Replacements. Here’s why…
This article is to serve as a guide for best practices when using icon fonts on the web. Because icon fonts are still in their infancy, browser support and new technologies are constantly being developed. Be sure to check back often for updated information. If you have any knowledge or experience to contribute, please tweet to @pictos or email drew@pictos.cc to have it included in this article.
The BBC HTML Accessibility Standards and BBC Mobile Accessibility Standards and Guidelines outline the requirements and recommendations necessary for ensuring the BBC’s digital products are accessible to the widest possible audience.
Care must be taken when implementing icon fonts to ensure a great experience for all users. What happens when your font doesn’t load? What happens when @font-face isn’t supported in the browser? We’ll show you how to implement bulletproof font icons.
Collapsible content areas are frequently presented in web sites and applications as a way to let users to control how content is shown or hidden on the page. Also called collapsibles, spin-downs, toggle panels, twisties, and content disclosures, they're ideal for selectively displaying optional information — like instructional text or additional details, for example — so users can focus on the task at hand and view this content only as needed.
Accessibility ready barebones theme
At many of the web development conferences I attend, there is a talk on how to use an integrated development environment to aid in programming. The speaker will almost invariably mention a few of his favorite keyboard shortcuts within that environment for performing his most frequently used activities. Programmers are big fans of using the keyboard instead of continually shifting between the keyboard and mouse.
During the winter 2014, me and my family rented an apartment from San Diego, CA for few months through my work. While staying there, we had an AT&T hotspot device that provided the network connection. For us, relying on this device, meant constant drops of connection, network latency like we’ve never seen before, and websites that were completely broken because JavaScript wasn’t loading at all. A part of this can be explained by the poor reception at the location where we were staying, but overall, the whole experience put me thinking.
Accessibility is an important part of modern web development. It is our responsibility as creators of WordPress themes to make them accessible to all users, on any device. In this article, I’ll offer some simple tips to create better, more accessible WordPress themes.
If you’re using input fields on a web page your users will need to know what they’re supposed to put in them or which ones to choose for radio buttons, checkboxes and dropdowns. Sighted users can see any accompanying text next to the text box or radio button but that’s not always possible for users who are blind or suffering from other visual impairments. How can these people know what’s expected of them?
Listening to your web content rather than looking at it can be an "eye-opening" experience (pardon the pun) that takes sighted users out of their normal comfort zone. It gives sighted users a chance to evaluate their content from an entirely different perspective: from the perspective of a blind person. A lot of times you'll end up finding mistakes that would have been hard to catch visually. For example, spelling mistakes become very obvious when you hear words mispronounced by the screen reader. Screen readers are also very good for checking the accuracy and quality of image alternative text. Screen readers can also help you identify problems with reading order, table markup, form elements, and many other aspects of accessibility.