CHAPTER 1: Introducing Java Web Development 37Responsive web applications are device-agnostic, in that they adapt themselves to the device on
which they are run. The technique goes as far as rethinking the way page layouts are designed. You
can go one step further by designing the web application with the smallest screen (smartphones)
in mind and then progressively enhance the application to run on desktop screens. This technique
is known as mobile-first design. The philosophy of a mobile-first design is that if you design
the interface and the web components to run with acceptable performance on a smartphone,
the performance on desktop screens will be blazing fast. In addition, using the smartphone real
estate wisely will also be applied to the desktop screens, which will result in better usability of the
application.
The core technologies employed in developing responsive web applications are CSS3,^18 jQuery^19
and jQuery plug-ins,^20 LESS,^21 CoffeeScript,^22 and front-end frameworks such as Bootstrap,^23
Polyfills, and Modernizr.
Figure 1-23. The same responsive site on a smartphone
(^18) http://www.w3.org/Style/CSS/current-work.en.html
(^19) http://jquery.com/
(^20) http://plugins.jquery.com/
(^21) http://lesscss.org/
(^22) http://coffeescript.org/
(^23) http://getbootstrap.com/