mediasalt

I don’t even own one, but I’m already thinking about designing websites that play well with the iPad (and retro-fitting the current ones).

Here are three resources that have caught my attention this week. What tools and tips have you discovered to help design iPad-friendly websites?

1. iPad Peek

Visit: http://ipadpeek.com

This site makes it fun to test your website. If you want to test portrait orientation, just click on the top edge of the iPad.

A few of things to keep in mind:

• “Flash is not going to work on iPad, even though you might see it working here [iPadPeek.com].” You can always disable flash on your browser if you want the true experience.
• Your desktop screen resolution is probably much higher than a iPad (1024 X 768 pixels).
• iPad Peek is open source. Grab the code here.

2. iPad Orientation CSS

Visit: http://www.cloudfour.com/ipad-orientation-css

This is a great tutorial showing how easy it is to use CSS media query declarations on iPad sites based on orientation.

3. Designing Websites for the iPad

Visit: http://devlounge.net/design/designing-websites-for-the-ipad

“Whatever you personally think of Apple’s iPad, the thing will probably sell like hotcakes. And with wi-fi web browsing as its main feature, you want the sites you design to look great on the iPad’s browser. If they look okay on iPhone screens, just ‘okay’ won’t cut it anymore- not with the large screen on the iPad. Here, some things to keep in mind for iPad-friendly web design.”