O'Reilly logo

Enterprise Web Development by Victor Rasputnis, Viktor Gamov, Anatole Tartakovsky, Yakov Fain

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 10. Responsive Design: One Site Fits All

Up until now, we’ve been writing and rewriting the desktop version of the Save The Child application. Will it look good on the small screen of a mobile device? Beginning with this chapter, we’ll deal with mobile devices, too.

Let’s discuss different approaches to developing a web application that can work on both desktop and mobile devices. There are three choices:

Seperate versions of native applications
In addition to your web application that works on desktops, develop a separate version of the native application for multiple mobile devices. Development of native mobile applications is not covered in this book.
Single HTML applications with multiple UIs
Develop a single HTML5 web application, but create various UI layouts that will be applied automatically, based on the screen size of the user’s device.
Hybrid applications
In addition to your web application that works on desktops, develop a hybrid application. This web application on steroids works inside the mobile browser but is packaged as a native app and can invoke the native API of the mobile device, too. Chapter 13 is dedicated to hybrid applications.

This chapter focuses the second approach, called responsive web design (RWD). This term was coined by Ethan Marcotte in his article, “Responsive Web Design.” The concept that underlies RWD is that the design of the web page changes, responding (reacting) to the display size of the user’s device. We’ll modify the design ...

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