Designing Your Site: Accessibility & Design

Principle 3:
Accessibility & Design
When a visitor enters the website, he/she must be able to access each bit of information in the easiest manner. This means that the text must be legible, the colors must not be harsh on the eyes and the background must not overpower the content, etc. To make the website accessible to everyone, you can follow some of the following points:
  • Typefaces – Make sure you select a font type and font size which is readable to all and is not too fancy for some to access or understand. For example, Fonts like Verdana, Times New Roman, Arial, etc. are simple fonts that almost everyone can easily read online. Similarly, the font size that works the best is 16 px but you can be a little flexible with it.
  • Colors – As far as the user experience is concerned, your color scheme and contrast must be well thought of and should be able to create visual harmony and balance. It is always better to choose contrasting colors for the background and written content so that it can be easily read. Choose a darker text color and a lighter background shade so that the result is easy to the eyes. Extra bright colors must be used sparingly.
  • Images – Do you know that the human mind perceives and processes images a lot faster than text? Well, it is thus a good idea to choose and place the right images on your web pages to communicate with the audiences in a better way. Make sure they are high-quality images and are suitable for your purpose.
  • Layout - Is the layout attractive, clean, and consistent.  Many of your audience members will prefer images that line up and are of appropriate relations in size.  A clean look might have all images lined up across a page with descriptors evenly spaced just under them.  The images would need to be the same size and style to give the site a professional feel.  You would not want to mix clip art images and photos in an image gallery navigation section of the site.

What about your site:
Is your site easy on the eyes?
1 = Inaccessible typeface and/or contrast; Images inappropriate for the content or are of poor quality; There are inconsistencies on the site that keep it from looking professional.
10 = Perfect typeface and contrast; images are not only appropriate and are of good quality, but they are part of the presentation of content; Layout is highly professional and consistent.

How might you improve on the accessibility and visual design of your site? Add this to your ePortfolio "to do" list.

Examples
NO
http://www.irishwrecksonline.net/ 
Enter the site and you will see the opening page has bright red text on yellow background.  Text of that vibrancy is difficult to read for extended periods and should really only be used for a word of phrase.
http://art.yale.edu/ 
Hard to tell what is content and what is background on this site.  Layout is haphazard. Mix of styles and colour choices.  Yeehah.
http://www.gatesnfences.com/
Text in links on the left does not fit the buttons.  When you go into the site and see the images, they have white backgrounds over textured page backgrounds.  Imagine this site with a solid white background and it cleans up quite a bit of visual clutter.  Enough?  Probably not.
http://www.007museum.com/
Does this site even have a layout?  If feels almost emotionally haphazard... You might use this site to show somebody what it is like to take hallucinogens. 

YES
​Clean design, accessible typeface and colour choices:

​Adapted from an article by Martin Luenendonk for Entrepreneurial Insights (June 3, 2015) with permission from the author. (http://www.entrepreneurial-insights.com/web-design-principles-successful-websites/).
All images on this site are CCO Public Domain or are created by Avi Luxenburg and are Creative Commons Share and Share Alike.