O'Reilly logo

Beginning iOS Application Development with HTML and JavaScript® by Richard Wagner

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Chapter 7

Designing for iPad

WHAT YOU WILL LEARN IN THIS CHAPTER:

  • Knowing special design considerations for iPad
  • Understanding limitations of Safari on iPad
  • Creating a Split View app

The iPad is mobile, but it is not a phone device. That statement is a “no-brainer” obviously, but when designing for the iPad it is easy to fall into the trap of thinking of it as a “giant iPhone.” On the contrary, the iPad is almost a perfect blend between the mobile and touch qualities of an iPhone and the larger visual experience and interaction capabilities of a desktop computer. Therefore, as you design web apps for the iPad, you need to give it the individual attention it deserves rather than just treating it as a bigger iPhone viewport.

In this chapter, I highlight some of the special considerations you should think about when designing an app for iPad. I then focus on creating a split view UI (user interface) design that emulates the look of a native iPad app.

SPECIAL IPAD CONSIDERATIONS

When you create a web app for iPad, you need to perform many of the same things you do when creating an iPhone app. Chapters 5 and 6 discuss the process of creating apps in full detail, but the following are a few of the key ways you can transform a normal web page into a web app that targets iPad:

  • Adding the viewport meta tag to the document head:
    <meta name="viewport" content="width=device-width; initial-scale=1.0;
       maximum-scale=1.0; user-scalable=no;"/>
  • Adding an iPad-specific media query:
    <link media="only ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required