I often find myself searching to see what are the latest specifications for mobile responsive screen sizes… so I figured I'd make this simple infographic and you can refer to.
That way, you'll always knows what size to test when it comes time to create a mobile friendly popup or opt-in on your website.
Mobile Responsive Screen Sizes Explained
The smallest screen size is currently the iPhone 4, coming in at 320 pixels wide.
Then we've got a pretty standard 360 pixels wide for many modern mobile phones.
If someone is reading on their phone, they might tilt the screen and get up to 480 pixels wide to visit your website with.
Beyond that, we enter into different tablet and iPad sizes. This tends to be in the 768 pixels wide range.
The next size up is 960 pixels wide, which is the traditional width for websites on a desktop or laptop screen size.
Today, there are also more modern and larger screens that can go as big as 1680 pixels wide.
Designing For Modern Screens
With more people browsing the web on their mobile devices, designing for smaller screens is absolutely necessary. Especially now that Google is counting mobile responsiveness as an SEO factor.
To find out more about how responsive design works read this article.
Feel free to share this infographic or include it on your blog or website!
Now I'd love to know what mobile responsive questions you have that we can answer?