Posts Tagged ‘iPad Design’

Designing Websites for the iPad

Thursday, July 22nd, 2010

The recent release of the highly anticipated iPad may just turn the web design world on its head. Whether you love the iPad, or hate it … the fact of the matter is that it has arrived and sooner or later we need to learn to design with it in mind.

So what should be taken into consideration when designing for the iPad?

*HTML 5- The iPad offers no support for browser plugins like Flash. If you are hoping to include video, animation or graphics on your site, it is imperative the site be designed using HTML5. HTML has long been the foundation for web development. Their latest version incorporates much of the elements previously only available via Adobe Flash. Luckily, websites designed with HTML5 are easily viewed on the iPad.

*Orientation:  The iPad has no correct way of viewing websites. That means you can view it either in landscape or in the portrait mode. But for the designer that means two completely different layouts for which to design. It is for this specific reason that the iPad highlights the need for smart fluid width design. Using a smart combination of CSS and Javascript the User Experience can be made to improve drastically.

*Contrast:  Because the iPad is a touch screen, it is important to build in a lot of white space and contrast to make the pad easy for visitors to use. After all, if they can’t click deeper into your site, you are never going to convert them.

*Test, test, test: while testing is an important component of any new web design, it has never been truer than when attempting an iPad friendly web design. There are already several sites out there that offer you the ability to take a ‘peek’ at how your new design will look on an iPad, a great tool is www.ipadpeek.com.

*Touch Screen: Primary method of user interaction with the iPad is and will be the fingers. The users will interact with our websites using fingers. So all those brilliant hover effects that were favorable for pointer-based devices, will be a hurdle in user experience on the iPad. Also the links can no longer be concealed in a text and left for the user to dexterously click upon it. We might want to resize the links so that the user experience does not suffer.