Design and Accessibility Go Hand in Hand


If you are working to improve your online presence, it is important to not skimp on the overall design and branding of your company. How you look to viewers is an important part of business. If your site works well but is poorly designed, that is enough to create a lack of trust and make potential customers (or even current ones) pause. A great website will not only function smoothly and appeal to the eyes, but will be accessible as well. Combined, those qualities will complement each other. Keep in mind that simple is often the best route to go versus overly flashy and confusing branding—especially in terms of accessibility.

The areas that are critical to successfully designing a quality website link very closely to accessibility. At the core of these areas lie the Web Content Accessibility Guidelines (WCAG) which focus on the following four categories:

  • Perceivable: The information on your site is available through more than one method, for example sight, hearing, and touch.
  • Operable: Your site is compatible with keyboard and mouse.
  • Understandable: The content you are sharing is user friendly and easy to comprehend.
  • Robust: Your website follows high standards that make it function across multiple browsers, devices, and assistive technologies.

Keep these categories in mind when designing your website. Failure to follow accessibility best practices can make your website difficult or even impossible for certain members to use.

Easy navigation

If your website is pretty but hard to navigate, you might as well say goodbye to your users. Consumer attention is very short and most know exactly what they are looking for; no one is going to search forever on your site to find one simple item or service. When looking at improving your website, take a look at the analytics and heat maps to discover what the most popular path on your site is and make it easy to get there. Simple navigation is one of the best assets to a great website, so avoid burying information under a ton of pages.

If you know that all of your online activity comes from mobile banking, keep that prominent on your page and make sure it is easy to navigate. Would you like to sell more loans to your members? Emphasize that information on the main page and create an easy way to view important information on loans. It may take a few tries to figure out what works best but don’t be afraid to adjust your goals based on customer actions.

In terms of accessibility, content layout can make or break the experience of assistive and non-assistive technology user alike. Cut out distracting content and use well placed and descriptive link text, buttons, and headings as a roadmap that guides visitors through your page. Links, buttons, and headings are also key areas that can impact your search engine visibility as they are used for search engine indexing.

Simple, clean functionality will make your website a winner. Having trouble finding the best set up for your website? The internet is full of examples of do’s and don’ts. Take a look at the websites you use on a regular basis or the competition and see how they are utilizing their web presence and how you would improve on it. Think about what you would want to see as a customer—what is most important to you?

Clean content

Just like bigger is not always better, “fancier” is not always better. WCAG goes into detail about content and multimedia that moves and flashes. It discourages you from designing a busy site that turns sensory vulnerable visitors away. Follow best practice by avoiding these flashy tricks altogether. Often these fancy effects do not carry across browsers and platforms and can end up making your site appear cheap rather than fresh and modern.

This leads into a cautionary word on plugins. If you are using a content management system, plugins can be helpful. A credit union might choose to use a super snazzy plugin to showcase all their products, but this plugin could prevent somebody who can’t use a mouse from getting to the links for the products.

The products could also come across distorted on a mobile device and completely disappear on some browsers. The unfortunate caveat about adding these super snazzy plugins to your website is that you have very little control over them because you may not have access to their code. When you attempt to address issues related to their performance, you will often come up without a solution.

Language and phrasing

An often-overlooked issue is the use of directional language. Visitors who cannot rely on visual cues due to an impairment can be frustrated when asked to “look below for additional information.” Keep in mind that sometimes the responsiveness of a website causes content to shift when moving to a smaller device. Elements that are “to the right” on desktop could move “below” on a tablet causing confusion.

Furthermore, resist the urge to tell your visitors to “click here” with your link text. Verbiage like this can discourage visitors who use devices other than a mouse to navigate through your page. Instead, encourage members to “Register for Our Saving for College Webinar” or “Apply for Our Auto Loan Special.” Links are a great way to incorporate a clear call to action and headings can act as a spotlight on information your members might be looking for. For example, “Our branch is now open from 8:00 am until 5:00 pm. We look forward to seeing you!”

Mobile experience

In our digital world, having a well-functioning website and a great mobile experience are top priorities. This past year certainly proved that as the majority of businesses relied on their websites and apps to reach customers. Since services like remote check deposit, online transfers, and bill pay are available from the palm of my hand, it has been over a year since I have had to step foot into my credit union.

What do I do instead? I use my credit union app or website. If my husband needs money transferred it can be done in a click! If grandma gives me $5 for my birthday, I can snap a picture of the check and add it into my savings, all while sitting on my couch with a toddler at 7 PM on a Sunday. Easy, quick, and oh so convenient. If my credit union app was difficult to navigate, you bet I would look elsewhere to do my banking. This sentiment is shared with millions of customers all over the world—so please, make sure your web and mobile presence are easy and accessible!

Accessibility-wise, if it is difficult to find information on a desktop, this difficulty will be magnified on a smaller screen. Focusing on responsive design, text size, color contrast, and concise easy-to-locate content are details that are covered in WCAG that have a big bearing on mobile experience. Content that is difficult to distinguish on a computer screen will be even trickier to see with a mobile device.

Accessibility can’t be overlooked

While you need to be regularly updating your site to keep your content fresh, keep in mind that with each update, you could be creating an accessibility issue. It is important that you remain diligent in regularly reviewing your site for accessibility and quality issues. While there are some powerful accessibility scanners that can save you time in finding accessibility errors throughout your site, to get a full review of your site, you will need to use both manual review and automated scanners together.

Tools like the Siteimprove and Lighthouse accessibility plugins are helpful browser extensions that will identify if text on your page is either too small or does not meet contrast recommendations. Siteimprove accessibility scanner can tell you if element IDs are duplicated, but they cannot tell you if an image’s alternative text provides quality information.

An added benefit of using these tools is that they will give you tips on how to address identified issues to create a more accessible experience. Sites like Color Review will make recommendations on what colors go together to meet contrast best practices and how they might look on a webpage. You might be surprised by some of the color combinations that do not meet contrast recommendations and could turn visitors away from your site.

Hand in hand

The internet is a competitive place. There is an overwhelming amount of information and imagery out there competing for viewership. So how do you make sure your website is up to par and able to compete with the best of the best? Starting with these important areas you can take your website from passable and somewhat useable to a streamlined, user friendly experience.

When WCAG is applied to your site, having a responsive website with a clear message and engaging user experience will follow. In addition to reducing risk of litigation, you will be demonstrating a concern for your community, have improved market penetration, and better search engine optimization.


Your email address will not be published. Required fields are marked *