Now that the iPad dust is settling, it’s clear that Apple’s hot new tablet is only the first of many from multiple vendors.  The iPad is unique—for now—but it’s just the start of the next generation of mobile computing.

That’s a wonderful opportunity for web designers and content providers, but it is also a significant challenge.  It gives us the opportunity to reach more readers, more of the time.  But it also poses a significant challenge since we need to design sites that work well with tablets, other mobile devices, and standard desktops and laptops.  Who wants to develop the same site three times for three different kinds of devices?

Here Come the Tablets -

Companies from HTC to Notion INK are releasing tablet computers with only touch screen interfaces. Without a keyboard and mouse, attributes like “hover” are null.  So, too, are languages that might not be supported across multiple platforms

These are big changes, and they pose serious challenges for developers and designers.   I’m certain most of us don’t want to develop the same site 3 times (web, mobile, and tablet).

How am I coping with this challenge on my next website?

Layout -

960 Grid System. I’ve always been a fan, but I have strayed because of increased traffic from widescreen monitors. Going back to 960px will give me a website that fits perfectly with landscape mode on most tablets. As tempting as a horizontally scrolling website is, I still find that kind of scrolling isn’t easy on a normal browser.

The tablet’s screen feels tighter, a lot tighter.  When using an iPad to look at content on a blog where I am the web manager, I noticed that the content is very tight against the browser’s edge.  Yet it looks fine on my netbook, with similar resolution.

Text -

Colors with strong contrast are crucial because tablets are aimed at casual, on-the-go computing. Easy accessibility is a big reason people like tablets, and they won’t plunk them down in a fixed position.  That means the devices will be used under a wide variety of lighting conditions.   We have to respond with text that’s easy to read, whether the tablets are outside in direct sunlight, in an office with strong fluorescents, or in a bedroom with dim table lamps.

Links and Navigation -

With the iPad’s touch screen sensitivity, links and navigation aren’t big issues.  But that’s only for the iPad.  Links and navigation probably will be issues for other new tablets. Until other device manufacturers (Cough “HTC”) get up to par, targets need to be larger.  The simplest way is to use padding, which I’m sure most do already.

I noticed, while using the iPad, that I had no interest in hyperlinks. In contrast, I’m always clicking through to supportive articles on blogs.  While hyperlinks are still important for browsing on computers, I’m thinking about writing a plug-in for WordPress that adds links under the articles to increase accessibility across platforms..

While the hover attribute is still key for regular computing, it can’t be used to its full extent on the iPad.  The same could well be true on other tablets coming out soon.   This limitation on hovering could also cause issues with some JavaScript functions and CSS uses, like drop down menus. Thankfully, there is a small upside.  It discourages those atrocious in-text advertisements (read: DONT USE THEM. Ever.) .

Advertisement -

Keep it tasteful.  By tasteful, I mean do your best to keep readers focused on your content.  That’s the heart of the matter.  Placing advertisements as roadblocks already angers most users, and it will be even more distracting to casual readers using tablets.  Even on a desktop, where we have a lot of extra real-estate, the screen can seem cramped with a 960 Grid.

Bottom Line: Options for Developers and Content Providers -

One obvious strategy is to build a website specifically for the iPad. Although that’s certainly a simple, straightforward way to go, it carries a big downside.  As more tablets come out, they won’t use Apple standards so you won’t necessarily be able to reach them.  A lot of specifications are bound to change cross platforms.  For now, then, it’s probably best to generalize for your audience.

The good news, I am happy to report, is that a lot of tablet manufacturers will stay ahead of the game by embracing new standards like HTML5 and CSS3.  Those standards should make life a little easier as we design for a new generation of tablet computers.   Those tablets are going to be widely adopted—they are a major step toward ubiquitous computing–and that’s an exciting (if daunting) prospect for those of us who design and develop.