Accessibility Principles for the Modern Designer

As web designers we must constantly criticize and re-evaluate our own digital works. Many rework changes into website aesthetics or graphics, maybe an updated site logo or sidebar. Ultimately where we should be focusing towards is user experience and accessibility.

As the web is expanding we’re seeing a growing market of information consumers. With more websites live today than ever before it’s much simpler for the average Joe to enter the cyber universe in search of new information. Modern web designers must accommodate for this growing market, ensuring high sustainability in user interfaces.

In this article we’ll cover a few basic principles of accessibility on the web. Although these are good guidelines to follow don’t push your designs to their limits trying to fit in each aspect. Use this as more of a guide to help you along the creative pathway.

What works best for the User Experience?

You may question “what are we even aiming for in user accessibility?”. There are a few general concepts to cover – the best way to understand them is to put yourself in the average user’s shoes.

Imagine you land on a blog page or social service for the first time. You may begin by asking yourself some basic questions to help figure out your needs. Why am I on this page? What do I want to accomplish or take away from this visit? How long is a reasonable amount of time for my visit?

This is the same across the board when it comes to Internet pages. Most visitors are on your site for information, or to use your page as a medium to find other information (outbound links to other sources). They don’t want to spend too much time, so our goal is to make their stay as pleasant as possible.

Users don’t spend time reading, they scan

This may seem a bit harsh at first, but your average visitor doesn’t care or have the time to sit down and read everything you’ve written. This is a repercussion from having access to so much information so quickly in our current era. As a society we’re on information overload and we want to obtain things as quickly as possible.

Knowing this you can adapt your site’s design to accommodate. Allow for much bolder, larger headings to stand out and make it obvious what content you’re presenting. This works because users glance through text for anchor points to confirm what they’re reading.

They may pass through a few paragraphs and assume what the rest of your content holds, so they’ll skip down into the next section. Don’t think all your hard work writing has gone to waste, though. Search engine spiders are still very interested in every single word you have to say!

For the best user accessibility results keep your content clean and organized while also simple to scan and pleasing on the eyes.

Applying Occam’s Razor to your Design Works

For those of you unfamiliar with Occam’s razor it’s a philosophical principle which states “entities must not be multiplied beyond necessity”. Or put in laymans terms “the simplest explanation is generally the correct one”.

This can be applied to design from an objective view of any wireframe. Consider carefully each element on your page – the search box(es), logo, navigation menus, sidebar(s), content area, footer, or any other setup you may run. What is the purpose of them?

I’m not condoning designers everywhere to drop elements from their pages for just a blank white screen with text – far from it. I’m speaking from a user experience standpoint stating your average visitor will not want to wade through heaping mounds of web 2.0 glossy buttons and widgets. Users want a simple interface to mess around with.

This is a task which takes no more than 10 minutes and can drastically improve your website’s usability. Simply go through some of your pages and inspect each element. Ask yourself what its purpose is and if it could be improved in any way (take notes during the process, they come in handy).

Keep your Hyperlinks looking like Links

I know it sounds crazy but a key aspect to accessibility design is structuring proper text and page elements. This can fall apart when it comes to hyperlinks as designers can get a bit funky on hover effects and colors.

The default color for links in all modern browsers is blue standard and purple for previously visited. The visited selector for links isn’t as important as many would believe, not in modern design. The two hyperlink states you want to concern yourself with are standard and hover.

What makes links stand out in a page is the concept that users know they can interact with them. The rest of a webpage’s text is static – it’s generally not changing and it can only be read or copy/pasted. Links allow for some user control, they can interact with them and maybe find some cool new information. This gives links a feeling of separation from main content, although still part of the original block.

Hover effects display the sense of “clickability” and change. A user knows they can click on a link once they can see a color change or underline. Getting a response back upon hover solidifies the idea that your link element is interactive. It’s a concept that has been around since the birth of the world wide web so at this point it’s deeply ingrained in our minds.

Keep your Design Organized yet Inspiring

This is our main job as web designers. The profession is credited to digital artists of all kinds designing beautiful brands and logos for the web. However with accessibility becoming more of a talking point, designers are now creating user interfaces as well.

This seems like an extra piece to the design workload, but it’s really always been part of the job (just not talked about much). Keeping your designs neat and organized will help structure your page into a tidy format for your visitors. Usability comes naturally when visitors know exactly where to go and what to click.

This isn’t a concept that can be easily described in words. It comes from studying trends in modern web design and learning the basic elements of a website. I’m always suggesting designers to check out inspiration galleries and design portfolios for ideas on what to look out for.

You may also find drawing can help to express these ideas. With a pencil and paper it’s much easier to sketch a header, content, and footer area along with smaller page elements. Much simpler than trying to accomplish this in Photoshop, and you could even generate much more creative ideas on paper.

Although these ideas are just enough to get you started, they hold a lot of importance for modern designers. Starting with a textbook understanding of usability can help you develop a stronger knowledge-base for deeper design concepts such as color theory and the grid system.

Another fun experiment to try is setting aside a 30 minute Internet surfing period during your day as a creative outlet. Browsing blogs and similar websites may spark ingenious usability ideas which you can apply to your own designs.

You might also like…

Eight Helpful Rules for Logo Designers →
20 Useful Free PDF ebooks for Designers and Bloggers →
Typography as Art →
Beginners Guide to Using the Power of Color in Web Design →