If your website doesn’t properly display elements on different screen sizes using responsive design techniques you will end up making your viewer “pinch and zoom” or scroll off the screen to see your content.
While it might not seem like much, non-responsive elements become “friction points” that interrupt the user experience making them think “How do I get the info I want? Do I zoom out? Do I scroll to the right? Yuck! Other websites don’t make me do this…”
Friction points cause people to become annoyed with your website. Reducing friction points will improve your user experience, engagement and increase your bottom line.
Listed below are the top screen sizes in use from Sept. 1, 2022 – Sept. 1, 2023, in the United States of America as reported by StatCounter.
Knowing this information is critical if you are designing and testing a website for modern responsive design behavior.
Market Street tests all web design projects against screen sizes with 5% or greater market share in North America at the time of development with our display simulator. We adjust our designs so that our websites work on all three device segments listed below.
Popular Screen Sizes – Q3 2023
Phone or Mobile Device
- 16.3% – 390×844 – iPhone 12, 13, 14
- 10.3% – 414×896 – iPhone XR, XS Max, 11, 11 Pro Max
- 8.1% – 428×926 – iPhone 12 Pro Max, 13 Pro Max, 14+
- 7.1% – 375×812 – iPhone X, XS, 11 Pro
- 5.2% – 375×667 – iPhone 6, 6s, 7, 8, SE
- 4.8% – 412×915 – Galaxy A31, A32, A51, S20 Ultra, Note20
- 4.3% – 360×800 – Galaxy S20
Tablets or Small Screen
- 26.1% – 768×1024 – iPad Mini
- 9.1% – 810×1080 – iPad 10.2″
- 8.6% – 800×1280 – unknown
- 7.9% – 1280×800 – MacBook 13″ (viewport)
- 5.8% – 601×962 – unknown
Desktop or Laptop
- 20.7% – 1920×1080 – Full HD display, business-class laptops & modern desktops.
- 12.2% – 1366×768 – Budget-oriented laptop displays.
- 8.8% – 1440×900 – Older budget-oriented desktop displays.
- 7.4% – 1536×864 – Full HD display at 125% zoom level.
- 5.4% – 1280×720 – Standard HD, older budget laptops & TVs.
NOTE: I have used the term “Screen Size” in this article to also include “Viewport Size” to keep the conversation focused and easier to understand.
Crazy Idea: Contact Us to see how your website looks on popular modern display sizes! We will happily test your website with our display simulator, FREE of charge, and show you how different visitors see your website, offer limited to the first 100 websites.
