By Peter Prestipino, Editor-In-Chief
The ideas behind "universal design" and "accessibility," two topics central to the Web experience today, provide digital workers with guidelines and principles that allow content and design to be easily consumed by all users, regardless of their abilities, natural traits or limitations.
Designers that enable their users to more accurately perceive, understand, navigate, interact with and contribute to the Web, are those embracing the principles behind universal design and accessibility, but they must do so without alienating the rest of the 'Net population. While Web accessibility as a topic and concept has traditionally been concerned with allowing users with disabilities to access the Web, its presence also impacts everyone else whether they know it or not. Let's explore some of the issues that must be addressed in order for products to not just be design-ready for all visitors and meet the minimum accessibility stands in Section 508 and the WCAG 2.0 (Web Content Accessibility Guidelines), but surpass them.
Keep in mind that while there is no guarantee enterprises that focus their attention on improving accessibility will experience a higher level and volume of conversions, there is some obvious correlation. Realize that abiding by these standards is not meant to be a barrier to creative self-realization and innovation, or a panacea for all that ails a digital property.
This guidance is not to temper designers' enthusiasm or force them into making ugly, plain, boring websites and applications. Rather, they are simply reasonable constraints in which those sensitive to the nuances of the customer experience can and should work if the aim is to optimize accessibility. Ultimately, designers should not design for designers but rather the users that use their products, consume their information and interact with the experience they create.
How many times have you come across a form, completed one field incorrectly, and could not for the digital life of you figure out which one it was? It's quite common and not just among those that are visually impaired in some way. The light red of an error message can be easily overlooked. Imagine having a color vision deficiency (color blindness), for example, and experiencing a mobile form. It's easy to see how difficult it would be, so designers should consider using more than just color to highlight or complement what is already visible - for example, showing an arrow icon or asterisk along with descriptive, useful helper and error text (in red) to indicate what field is in an error state and causing the problem with submission.
Digital experiences that drive interaction are often those with many different types of content formats - from text to images. Providing a visual text description (information) about images (charts or graphs for example) will facilitate consumption by users that are unable to view those (e.g., people using screen readers) as well as those users requiring additional context. Fortunately, most content management and ecommerce systems provide, by default, the ability to create and customize image meta data in a manageable way.
+ Learn more about how today's brands are managing their visual assets to maximize each user experience at wsm.co/vismgmt.
The "bells and whistles" that businesses often request can get in the way of creating a truly accessible Web experience. Simplifying overly complex navigation and reducing unnecessary options (which often manifest in the form of text and hyperlinks) doesn't just make it easier for those with actual visual impairments but also those without as it reduces the choices they must make and helps them avoid decision paralysis.
+ Discover a list of the most common digital design distractions at wsm.co/destract.
Ultimately the WCAG aims to make digital assets more perceivable, operable, understandable and robust and with some consideration in the development phase, it's not that complicated for designers to develop websites that are not just more useful for those with visual impairments but a more immersive one for all users of the Web.
+ Provides transcripts and captions (for audio and video), enabling users to consume content based on their ability and personal preference
+ Avoids complex color schemes and uses colors with high contrasts to help elements stand out from one another
+ Defines alt-attributes for every visual asset (images, infographics, animations) in order to describe the function and action taking place
+ Uses clear and consistent navigation
+ Ensures all mouse actions can be completed with a keyboard alone
+ Uses properly formatted headings to structure pages, using the appropriate order and not skipping heading levels
+ Avoids or limits blinking/flashing content to a maximum of three seconds
+ Establishes a clear hierarchy, placing important information higher and following a predictable flow to help users focus their attention and navigate more easily
+ Labels form fields and buttons clearly and in a logical reading order
+ Includes tables with both column and row headers to ensure a proper reading order
+ Formats lists properly for both assistive technologies and mobile devices so they present information as it is meant to be consumed
+ Makes hyperlinks noticeable (large enough on mobile and desktop devices to be controlled with ease) and located in an obvious position
+ Uses link text that indicates the destination to the user
+ Avoids the use of justified copy, and uses left-aligned copy with 50-70 characters per line for optimum readability
+ Requires only accessible software and applications and shuts no user out