Technical & Websites, Top Tips, Hints & Advice

Web Design Gets Touchy-Feely (Or How to Design Your Website for Touchscreen Pads and Monitors?)

Written by Ann Stanley on 21st December 2010

All Hail the Touchscreen!!

web design for tablets

Walk into a high street computer shop these days, turn to the desktop PCs, and you’re likely to find yourself confronted by something new. Yes, it’s the all-in-one touchscreen PC. A desktop that only needs one unit, which does not need a mouse or keyboard (although you are, of course, welcome to use these too). If they really take off this Christmas and over the next year, these innovative new PCs could change the way we design and use computer applications. And given the already ubiquitous presence of the touchscreen in a wide range of devices from the Nintendo DS to smartphones, sat-navs to the iPad and now these PCs, there is already a hefty public appetite for the interactivity the touchscreen allows.

For businesses with websites, this could be of vast importance as touchscreens can allow for a new level of customer interaction through well-designed touchscreen-friendly sites. Users will feel much more involved with your business if their touchscreens give them a much more ‘hands on’ level of interaction. If users are virtually touching your products through real-life physical motion, a connection between customer and product is more likely to be generated.

So how will web design need to adapt for these new machines?

Web designers thinking about how their websites will be viewed and accessed on touchscreen computers will need to consider a wide variety of new issues:

  • Bright Colours – dirt from fingers means dark colours will be a naughty no-no. Bright colours not only look jolly, but they hide grease and dirt too.
  • Switch it around – Left handers like to surf the web too! Make sure your menus and buttons are easily accessible to both the lefties and the righties.
  • Bigger is better – Nice big buttons make it easier to get around your site. If, like me, your fingers are big and clumsy, a small fiddly menu is the last thing you want on your shiny new touchscreen PC.
  • Fast and easy – one of the pros of the touchscreen is that it can be a lot quicker. However, as well as making your site quick to load, it needs to be intuitive to navigate.
  • Hide the cursor – if you aren’t using a mouse, you don’t need a cursor. Users aren’t going to lose track of their fingers. They might just lose a cursor though. Why distract them from your site with a silly little arrow they don’t need?
  • Rethink screen layout – how will users interact with each page? Remember, those cumbersome hands can get in the way and block some of your pictures or text.
  • Don’t wear them out – Lots of long hand movements across the screen and needless clicking could wear your user out and put them off staying on your site. Think carefully about how necessary each movement is and how to minimise arm fatigue.

Step into the heady future of web design

All these issues are but a drop in the ocean of what might be possible and what might need to be considered. But don’t forget the humble mouse-user, or even those using a stylus (which brings its own set of issues into the fold). Touchscreens present a whole new era of interactivity, and no doubt web designers will find fascinating and innovative new ways to harness this in the coming years. What will be particularly interesting to follow will be the ways in which businesses use this to improve the relationship between the brand or product and the customer. Interactivity is already a big selling tool, and touchscreens are, if they aren’t already, set to quickly become part of that.

Posted by Jon Potter

Image: Salvatore Vuono / FreeDigitalPhotos.net