30 06, 2017

Top 5 Accessibility Items to Review in a Website Redesign

By | 2017-07-17T07:14:26+00:00 June 30th, 2017|Categories: Higher Education, Web Development, Creative Design|Tags: , , |

Accessibility is a hot topic and an expansive one, too. I’ve been preparing for some upcoming speaking engagements with accessibility being the main focus. The first of these engagements is the eduWeb Digital Summit on August 6-10. This seems like a good time to share some thoughts regarding accessibility, WCAG guidelines and 508 compliance.

Additionally, I’d like to leave you with a list of 5 important accessibility items to review while in the midst of your next site redesign.

Accessibility Overview

Often, when administrators or oversight committees are asked to consider website accessibility while planning their institution’s website redesign, they think only in terms of addressing under-served users such as the elderly or visually disabled. Accessibility doesn’t simply address the needs of the disabled user. Adaptations and modifications made to address under-served users have broader implication, frequently enhancing the experience for all users. Designers and developers understand this and design with the idea that what is good for one is most often to the benefit of all.

Accessibility almost always enhances a website’s usability.

For example, incorporating design for those with diminished motor skills is always a good idea. It will enable all users to view your website without having to use a mouse. By doing so, you’ve also made it easier for any user to navigate the site and spend some time there. User engagement improves and, if you’re operating an online storefront, sales go up as well.

It goes without saying that any and all websites should factor accessibility into their design. To that end, WCAG recommendations and 508 standards have been established as guidelines to ensure a positive user experience for all. These guidelines have peripheral benefits, as they often overlap with best practices for mobile design and SEO. Still, there are many, many sites that remain inaccessible to a large number of users even today.

5 Accessibility Items to Review

With this in mind, I’ve comprised an abbreviated list of important accessibility items to consider when redesigning one’s website. Bear in mind that while I’ve listed 5 important accessibility items, this list is hardly complete and is meant only to provide a high level overview of what’s involved. Consider:

  1. Clear and Logical Design – This includes clear and intuitive navigation, contrast between text and backgrounds, proper use of color and more.
  2. CMS that Supports Accessibility – You’ve already considered functional requirements. Not all content management systems meet WCAG accessibility requirements. Know this from the start.
  3. Content Structure – Use headings and lists so as to clearly organize information. Use clear title attributes and page titles. Consider skip navigation for users of screen readers.
  4. Keyboard Accessible Functionality – Users with motor skill deficiency depend on keyboard accessibility to navigate your site. Other users benefit from added efficiency thanks to keyboard accessibility guidelines.
  5. Accessible Forms – Using JavaScript in forms often means that they are not accessible by keyboard alone. Testing your forms for keyboard accessibility is an imperative.

Once the items listed above have been fully considered and incorporated into the new design, the all-important testing phase begins.

Testing for Accessibility

Accessibility and usability are undeniably congruous. The benefits extend beyond just the user experience and into SEO and mobile performance. So take the time to test and test again. It’s time well invested. Fortunately, the WC3 provides a list of recommended web accessibility evaluation tools.

A Few Final Words

I look forward to seeing many of you at the upcoming eduWeb conference in August. I’ll discuss the topic of accessibility in more detail at that time. In the meantime, please comment below. Share your thoughts and experiences. We’ll pick up where we left off at the conference. See you then.

20 10, 2014

Radio Buttons vs Checkboxes

By | 2018-09-14T15:11:15+00:00 October 20th, 2014|Categories: Web Development|Tags: , , |

Sometimes when designing forms there’s some confusion as to when to use radio buttons and when to use checkboxes, but actually the rules are quite simple.

Radio buttons are used for two or more choices that are mutually exclusive. This means that only one can be selected at a time. The term “radio button” comes from the physical buttons of older car radios. When one button was pressed the other buttons would pop out. This made it so that only one button could be pressed in at a time.

Checkboxes offer a binary choice such as on/off or true/false. They can be used alone or they can be used in a group to offer multiple selections.

A group of radio buttons can be a great alternative in some cases to having your user select their choice from a drop down menu because it makes all the options visible right there on the page so they are more easily accessible. This may be a preferable way to present options to users on mobile devices that are viewing your responsive website. They can then select their choice with just one tap instead of the several that are needed to use a drop down menu on a mobile phone. This may not always be the best option if you have a lot of choices because it can make the page look cluttered. Every situation is unique and you must consider the design of the content and also the needs of your users.

Radio buttons and checkboxes can both be restyled using CSS to have the appearance of buttons. This is an excellent option to enhance usability for touch devices.

buttons

Image courtesy of ViralPatel.net