News & Tutorials

Common Viewport Sizes

Website Viewports

Using the meta viewport value width=device-width instructs the page to match the screen’s width in device independent pixels. This allows the page to reflow content to match different screen sizes, whether rendered on a small mobile phone or a large desktop monitor.

  Device Name Platform Portrait Width Landscape Width
  iPad  iOS 1024 768
  iPad Mini  iOS 1024 768
  iPhone 6 iOS 375 667
  iPhone 6 Plus iOS 414 736
  iPhone 7 iOS 375 667
  iPhone 7 Plus  iOS 414 736

 

  Device Name Platform Portrait Width Landscape Width
  Android Tablet  Android 1280 800
  Android Phone Android 360 640

Full List of view port sizes 

Why be mobile friendly?

  • Mobile usage is exploding
  • Single website multiple devices
  • Single content single URL
  • Blogging and Social media bring mobile visitors
  • Recommended by Google
  • Responsive design is beneficial for SEO
  • Responsive designs adapt for future devices

In late 2012, Google conducted an independent survey titled “What Users Want Most From Mobile Sites Today.” Of the 1,088 smartphone users that were surveyed, about 67 percent indicated they would be more likely to purchase a product or service from a business that built a mobile-friendly website. Compounded with the fact that 61 percent of users also said they’d leave a site that’s not optimized for mobile and it’s clear that having a mobile-friendly site is more important than ever.

Is your website Mobile Friendly?

Find out if your site is mobile friendly using Googles new mobile friendly tool

Follow us