God isn't bland. The Church shouldn't be, either.
Designing iPad-Friendly Websites

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.”

Share on TwitterShare on TumblrShare via email


  1. Web Design (Reply) on May 28th, 2010

    I think designing for the latest generation of technology is important, maybe not to dedicate the design completely to it, but just to bear things in mind, like the Ipad not supporting flash and the ability to view a site portrait as well as landscape.

  2. Nick (Reply) on August 19th, 2010

    One thing is for sure, a tablet revolution is starting and tough-to-toggle interfaces ARE the future for the average consumer. You can do some REALLY amazing things with iPad development and I certainly hope you start! We just launched our iPad site. We have a flash site, but built an HTML5 web app with offline capabilities that iPad visitors get whisked away to when visiting our main site.

  3. [...] Every day during the holidays, MediaSalt is counting down our most popular posts of the 2010. Today’s post was our 6th most popular, originally published on April 8, and written by Cleve Persinger… “Designing iPad-Friendly Websites.“ [...]

  4. Dan (Reply) on December 9th, 2011

    http://rethinkwebdesign.com is an iPad friendly website….build on drupal

  5. Dan (Reply) on December 9th, 2011

    http://rethinkwebdesign.com is an iPad friendly website….build on drupal.

  6. procab studio (Reply) on January 5th, 2012

    Great article !

    We are glad to announce you the first release of iPad version of procab studio website :

    http://www.procab.ch/ipad

    Enjoy


Connect with Facebook