And this is what the same page looks like on a Nexus 4 tablet.
Now access tab the ‘Emulation’ tab and you’ll see a lot of nice options. The main option is which device to emulate. Pick a device, for example ‘Nexus 4’ and refresh the page. Notice there’s a thick grey dot, instead of the usual mouse pointer. This is because the ‘Emulate touch screen’ option (in the ‘Sensors’ section) is enabled. It enables you to interact with the page as if you were using a touch device, where the mouse is your finger. It’s also clear to see this site has an adaptive layout; it detects we’re accessing it on a device with a much smaller screen and as such, redefines the layout accordingly. It’s more focused towards a device with a screen in portrait mode. Another thing to notice is the little ad on top of the screen. Clearly, the site not only detected we’re using a smaller screen, it also notices we’re using an Android device. Because of that, an ad is displayed promoting the CNN app on the Google Play Store.
We can see the same thing when we set the device to ‘Apple iPad 3 / 4’. Now, we’re having yet another layout of the same page, plus an ad that hints us to install the CNN app for iPad. All in one browser!