Designing For Disabilities - January 13th, 2009

Designing a site so that looks great and is accessible for people with disabilities can seem a bit catch 22, but it can be surprising how much the 2 can work in harmony to create a great looking and accessible site.  A selection of things to look out for or a checklist can sometimes help:

    1. Is the text resizable? There are many types of visual impairments that require users to increase/decrease the size of text.
      • The normal sort of zoom allows images to scale alongside the text. This basically means that the layout is kept while the whole page scales.
      • Text only zoom (as the name suggests only zooms the text of a page. this can quite easily break design templates, so it’s always a good idea to check.
    2. Are colour blind people going to struggle? The easiest way to check for this is by visiting vischeck and seeing what the site looks like with various types of colour blindness. An astonishing 10% of all males have some form of colour blindness, so its a good idea to check to see if any text fades into the background when seen though their eyes.
    3. What about screen readers? There are many types of screen readers varying from systems that simply read out the text on a screen, to ones that translate whats on the screen into braille.Its always a good idea to use alt tags to describe whats on an image (this is also good as it will help SEO and page validation!)
    4. Subtitles for video/audio?I know its not often done, but putting subtitles onto video and audio content is going to help hearing impaired users use your site.
    5. Check over how the site functions when a mouse is not used. Think about tab indexes for form fields etc. It would be a real pain to have to tab through all the fields on a form to get to the second text box.
    6. Ensure link text sounds right out of context. Many screen readers have the functionality to read out all navigation and links so the user can quickly find where they want to go. This isn’t much use when all the link text says is ‘click here’. Using relevant anchor text for a link is also a good idea for SEO. 2 birds with 1 stone!

    Posted in Web Design | No Comments »

    Cross Browser Compatibility - January 9th, 2009

    It is important when building a website to give consideration to how it is going to look in different browsers. What looks great in Firefox can look awful in Internet Explorer.

    Cross browser compatibility should not be confused with multi browser compatibility. Multi browser means something that works with several browsers whereas cross browser means that it works with all major browsers.

    Many web developers choose to design only for what they consider to be the most popular browser. This is a mistake as you can be alienating a considerable number of potential buyers of your product or service by presenting them with a messy site.

    There are many elements of a website design that can have an effect how it’s viewed in different browsers but HTML, Javascript and CSS (Cascading Style Sheets) are often the main culprits.

    Some minor issues can just make a small cosmetic difference while others can totally break a webpage.

    It is impossible to make every website 100% compatible with all browsers but you can build a site so that it works with the most popular. The most popular browsers as of December 2008 are:

    Firefox
    IE7
    IE6
    Chrome
    Safari
    Opera

    Building websites using W3C compliant code will help you get consistent results across browsers. The main thing to do to achieve the right results is test test test!!

    Posted in Web Design | No Comments »

    « Previous