Client: Ghostwritten for TipsBlogger.com
It’s not news that the iPad has taken the world by storm. From the 99 year old who got the iPad as her first computer to the mass of people ditching their Amazon Kindles in exchange for this new ultra-portable computer, iPad is sending computer manufacturers into a tizzy.
If keeping your audience engagement rates high and your bounce-rates low is important to you, here are 8 ways to optimize your blog for iPad and keep consumers on your website:
Remove any and all Flash
Whether you simply have flash introduction, have your videos embedded with Flash code, or your entire site is built using Flash—get rid of it. Neither the iPad nor the iPhone can read Flash and Apple developers have no intention of making the devices compatible. Any Flash objects on your website is replaced by a blue box for anyone trying to view it on the iPad. Check out Apple’s list of iPad Ready Websites.
Update your code to HTML5
This isn’t a requirement, but it’s by recommendation of Apple. Besides, with the world wide web upgrading to HTML5, you might as well update your site, which the Apple iPad can not only read, but is a clean framework that will also help you in other areas such as the time it takes for your site to load.
Look for website plugins
If you are running any type of open source Content Management System (CMS), keep on top of available and upcoming plugins that will automatically format your website for the iPad. Joomla already has a plugin released, called the Mobile Content Switch which will let you choose which content people can view depending on which device they’re browsing from.
Drop complicated navigation
On the iPad, drop-downs and other hovering-type menus don’t always work as smoothly as they do on computer browsers. In most cases, the user can only get into the first layer of navigation and nothing underneath. If you decide to design an iPad-compatible version of your website, a more simplistic navigation will help users get to the areas of your site that they’re looking for without being obstructed.
Remove any fixed positioning CSS
Since you can’t resize your browser on the iPad like you can on a computer, Apple warns against using fixed-positioning in your CSS. The fixed elements depend on the size of your browser, and since the iPad had a fixed width and height, this can cause overlapping of elements like text and images.
Pay attention to Apple
Apple does more than most companies to get users involved in their products. They’ve put together extensive kits for developers who want to create apps on the iPhone and iPad, so it’s no surprise that they already have a helpful Preparing Your Web Content for iPad guide.
Test your site on an iPad
This doesn’t mean you need to go out and buy one, you can always just stop by an Apple store and test it out or borrow one. Just because your website displays correctly in Safari doesn’t guarantee it’s working on the iPad, since the browsers are built differently and optimized for different sized screens.
Create your own app
Not only is this a great way to monetize the content on your website, but creating an app for the iPad gives you increased exposure to consumers who might have known about your site beforehand. Whether you are a content publisher or you sell shoes online, an app created for the iPad is obviously the ultimate in iPad optimization. Start developing apps by downloading the iPad SDK.
Remember, you’re designing for a touch screen. Apple has taken care of all the back-end work that transforms your HTML into touchable objects, all you have to do is make your calls to action easy to click and your layout clean to view.