25 Jan 2010

Sticky fingers on your web site

Written by Brian Teeman
sticky fingers

If there is one thing I am fairly confident of this year is that touch will become an even hotter topic.

The recent CES saw a plethora of new touch enabled computers, Apple is still promising to release the iSlate (maybe even this week) and more people are browsing the web every day on their mobile phone.

So have you checked to see if your web site is touchable?

The basic rules of web site accessibility apply equally to any web site being viewed on a touch device or small browser.

  1. Avoid tables
    Small screen browsers do a great job at scaling and zooming your site to fit the device but as soon as you use tables for your layout they start to have problems. Check out a table based site such as the Joomla forums to see what I mean.
  2. Avoid adjacent links
    When you're using a mouse it is not too hard to correctly select the right link from a group of links but try doing that with fat fingers. All links should be rendered clearly with separation between the links
  3. Check any drop down menus and mouseover effects
    When browsing with your fingers its not possible to hover over an item. If you need to hover over the top level of your menu to expand then your viewers won't be able to. One option here is to ensure that all top level menu items are real links (even #).

 

blog comments powered by Disqus

About Brian Teeman

  • As a co-founder of Joomla! and OpenSourceMatters Inc I've never been known to be lacking an opinion or being too afraid to express it.

    Despite what some people might think I'm a shy and modest man who doesnt like to blow his own trumpet or boast about achievements.

    But it seems that no blog exists without an "About" page so rather than talk about what an amazingly great guy I am and list all the things I've achieved (and failed at) in life from my Cycling Proficiency Test in 1976 to winning an award for the "UK Individual Contribution to Open / Source" in 2005 here are some links.

    {...}