The iPad has recently gained tremendous fame worldwide. A huge mass of people are getting attracted to this newly emerging device. We can already see people using an iPad whether they are in a bus or a coffee shop.Why it has become so popular in such a short time? The answer is, it’s such a computer that you can simply hold in your hand and read like a book. It’s a more intimate way to interact as now you can lounge with the computer rather than having the difficulty to sit on it. This technology change has turned the world of website designers upside down. It has led the web designers to rethink about the design tactics. The designers have started designing specifically for the iPad because it seems undeniable that the device will hold strong position in the future. To give a more positive user experience web designs and layouts must be more compatible to the iPad.

iPad features: what web designers should consider?

Let’s consider what actually iPad comprises that’s forcing the designers to change the way they design.

iPad modes:

The iPad has two kinds of modes

• Landscape
• Portrait

By mode it means the way you can view your website using the iPad. So either you can view it in landscape or portrait mode.

Primary iPad navigation tool:

The device is perfectly simple. It has no keyboard, no mouse. So how are the users going to interact? Yes, the primary tool here to interact with is your fingers. The users will use their fingers to navigate on the iPad.

The question here is: Why are these features bothering the designers so much?

With iPad users do not need to follow the standardized and defined ways of viewing and interacting with websites. They can zoom in and out the website pages as it suits them and can view the websites in any of the above mentioned two modes. Here comes the fact, why the designers need to bother? In order to make your website accessible as well as usable on the iPad (having two different viewing modes) a designer needs to create two different layouts for the website. This requires a website to be developed in smart fluid width design.

iPad has killed flash:

The iPad does not support flash. If you want your website to contain animations and videos it has to be designed in HTML5 because websites designed in this language are easily viewed in iPad. HTML5 has all the elements that were previously found only in Adobe Flash.

iPad has killed hover effects:

As users will use their fingers to navigate the website so the hover effects that are only suited to pointer based devices are useless for iPads. For a smooth user experience with iPads the hover effects must be removed. The links in a website can also no longer be concealed in text and need to be re sized.

Colour contrast:

The iPad can be used in different locations. You can use it anywhere indoors or outdoors according to your choice. This brings some disadvantages like the ipad’s screen is glossy and it reflects light. This hinders user’s interaction with the content that is displayed on the website.

Some examples where web iPadfication is already going On

Twitter redesign

The new design of twitter is very close to iPad application. Additional in-line links and media support is possible with the iPad version. Twitter for iPad is shown below

The image shows new twitter.com home page

With the iPad twitter more columns can be displayed and their sizes adjusted.

Apple’s Me.com webmail interface

Apple’s MobileMe Mail is almost identical to the Mail application built into the iPad. The Mail application for the iPad is shown below

Now compare the new Me.com webmail interface of Apple

Apple’s MobileMe calendar

This is a pixel by pixel recreation of calendar for iPad. The calendar application for iPad looked like

Now compare Apple’s MobileMe calendar

Editorial page of New York Times

The image shows the iPad friendly version of the New York Times editorial page

The image below is an updated iterated version of New York Times opinion page which is also developed keeping in mind the iPad friendliness. The columns can be easily selected using finger and stories are organized in grids to make it easier for the users to access the page.

Recommendations: what steps the designers should take to keep up with iPad?

The future of web browsing lies in these computerized tablets called iPads. It has been discussed in detail how the device affects the way websites are designed and built. In such a scenario following things are advised to the designers.

Use of JavaScript and CSS

Smart designers will efficiently use JavaScript and CSS in combination which will provide the users a rich experience using the iPad. There are some situations where the web developer cannot accommodate the needs of the user using the fluid width design. In such cases the designer should use multiple CSS for different devices and device configurations.

Interactive web designs rather than complex designs

The designers should avoid using complex designs rather than create interactive and intuitive designs as the future of website design is shaped by iPads.

Adaptable websites

The designers should design the website in such a way that it is accessible on desktop PCs, tablets and other mobile devices. It means that the website should be adaptable to multiple platforms and should not look the same.

You should keep in mind that with this website design for iPad you are not reinventing the wheel rather you are enhancing the usability of your site for the iPad device. Therefore, don’t forget to have quality content, maintain keyword placement and keep fighting for your website rankings.