That day, Microsoft unveiled Windows 8 to the world. A revolutionary reimagining of the world’s bestselling OS, one which blurred the lines between the computer and the tablet.
We’ve known for some months now that it was coming. And I’ve believed for some months now that Windows 8 heralds a complete reimagining of web design principles.
More and more, people are accessing the web using their mobile and tablets. Most of which are touchscreen devices. We’ve seen the stats for other websites we’ve built and maintain, and the ComScore reports too.
Microsoft realises this. That’s why they’ve built an OS that supports touch gestures on laptop and tablet screens as well as laptop trackpads.
Yet, websites continue to be designed for the point-and-click generation. They’re “optimised” for the mobile, and display on a tablet as they would on a PC.
But is that the same as “designed for touch”?
I would think that if a site were designed for touch, it wouldn’t have tiny hyperlinks you can’t put your finger on.
It wouldn’t force you to pinch-zoom to select text or a link.
It wouldn’t have plugins that don’t work on tablets and mobile phones.
It wouldn’t make you touch-and-drag the site around so you could see what’s hidden in the margins.
There’s clearly a big difference between “works for touch” and “designed for touch”.
The strange part is, the same publishers design mobile and tablet apps that are absolutely gorgeous and work the way a touchscreen user would want them too.
So why should the touchscreen experience on a website be anything less than gorgeous? Or different from the experience on a computer?
I believe that it’s up to publishers and digital marketers to drive a change. A new language of web design for the touchscreen generation.
When we were designing the site, we threw all standard website references out of the window. And immersed ourselves in the world of mobile and tablet apps.
Every element on the page, the way the wireframe has been planned, has been adopted, from tablet apps. As have all the little usability cues.
The site is responsive. It smartly resizes to fit any screen. Or any orientation.
There are no tiny text hyperlinks. Only buttons you can press comfortably with a finger or a thumb.
On a touchscreen device – tablets, mobile phones, Windows 8 hybrids – you navigate with swipes. Swiping horizontally lets you navigate between sections; swiping vertically lets you explore a section further.
We wanted to keep the user experience consistent across devices. So you can also swipe through the site using the trackpad on your Win8 and Apple laptops, which support multitouch gestures. An aspect that should build familiarity through consistency and sheer novelty.
We haven’t sacrificed basic usability, however. You can also navigate by clicking through the links. Or using the arrow keys.
We learnt a lot about touch UI while working on the site. Every few days, we’d have to get together to solve a design or usability issue that popped up while developing. There are still features we need to add and problems we need to solve. That’s why we’re still iterating, and will be constantly trying new ways to solve old problems.
It’d be interesting to apply this thinking to other websites – like news media, for example, or e-commerce. Each of those will have their own problems, and we’ll have to find new, interesting ways to solve them.
A first step…and in my mind, a necessary one.