HTML head - Meta:Viewport

Terms:

Hardware pixel: A physical pixel on the display. For example, an iPhone 5 has a screen with 640 horizontal hardware pixels.

Device-independent pixel (dip): A scaling of device pixels to match a uniform reference pixel at a normal viewing distance, which should be approximately the same size on all devices. An iPhone 5 is 320 dips wide.

CSS pixel: The unit used for page layout controlled by the viewport. Pixel dimensions in styles such as width: 100px are specified in CSS pixels. The ratio of CSS pixels to device independent pixels is the page's scale factor, or zoom. (in terms of CSS pixels, which are, a relative length unit. 1 CSS pixel can consist of multiple device pixels)

Viewport is not yet part of the W3C or WHATWG standard, it was originally invented by Apple for the iPhone.

Now it’s a de facto standard(standard in fact). You will use it when facing main stream mobile devices, which means all iOS & Android & Windows Phone devices.

<meta name="viewport" content="width=device-width,initial-scale=1" />

Codes above defines a responsive viewport, first part instructs the page to match the screen’s width in device independent pixels; second part instructs the browser to establish a 1:1 relationship between CSS pixel and device independent pixels.

Read more:
https://developers.google.com/speed/docs/insights/ConfigureViewport
https://developer.mozilla.org/en/docs/Mozilla/Mobile/Viewport_meta_tag
http://www.quirksmode.org/mobile/metaviewport/
https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html
http://viewportsizes.com/ (Viewport sizes quick search)