The Road Ahead - HTML5 Mastery: Semantics, Standards, and Styling - page 334

Note Adaptive images ( http://adaptive-images.com ) is a concept related
to responsive design that is for handling the scaling of images on a page so they scale
down for mobile devices and scale up for desktop displays.
The viewport
On a desktop environment, the viewport is the area of a web page visible in a web
browser. For instance, if you opened up a web page on your desktop and resized the page
down to the physical size of a mobile phone display, the area you see is the viewport.
You will likely see scrollbars appear so you can scroll to the rest of the content. You'll
also notice the text may wrap to fit in the visible area, if it is not otherwise sized with
CSS.
The behavior of the viewport on a mobile device is slightly different. Unlike a desktop
environment, in a mobile environment, the web browser covers a fixed area. The view-
port defines the area in which text would be wrapped and so forth, which may extend
outside the viewable area. The default viewport on iPhone, for instance, is 980 pixels
wide (to comfortably accommodate the 960-pixel web page width commonly used in
web design), but the page may be scaled down so it fully fits in the 320-pixel viewable
area ( Figure 8-1 ) .
__________
2 See the seminal article by Ethan Marcotte on responsive web design at http://alistapart.com/art-
icles/responsive-web-design/ .