24

Most organisations I know of when testing responsive designs (and responders to the question What is the smallest screen size you design for) use 320px as the narrowest device width they test for, when testing if layouts still make sense, images are still clear, and any responsively-scaling interactive items are still clickable.

As far as I can tell, this is based on the fairly arbitrary assumption that there are no popular devices in widespread use for web browsing that have a narrower width than an old iPhone held in portrait orientation ("width" measured in virtual/CSS pixels, see below).

Is this true? I'm looking for evidence on which to base such a rule of thumb - particularly for building new sites where no user data exists yet.

The ideal would be some kind of device-size equivalent of browser usage stats. Failing that, info on devices that are this narrow plus relative sales figures would also be a useful rough gauge.

Obviously, if you have a large, established site, you could get data about existing users from Google Analytics and similar, but this is no use if:

  • Your site is new or under development
  • You're trying to reach out to a new demographic
  • You're aware that some devices are underrepresented due to past poor usability

To quickly avoid a common confusion, this is 320px virtual pixels aka "CSS pixels" aka "density independent pixels" etc. Most modern devices have many more actual physical pixels - device pixels - than this (pixel density / "retina display"), but interpret content as if the width was the virtual pixel width so that it doesn't become tiny.

Improve this question
5
  • What about smart watches e.g. "LG G: 1.65-inch LCD display with a 280x280 resolution" (result from Google). If the physical resolution has a width of less that 320, the virtual width is probably smaller too.
    – Danny Varod
    Mar 12, 2015 at 16:16
  • 1
    Good question. It'd depend on the usage stats - if a substantial number of people use it regularly to browse the web, I don't care if it's a watch, phone, games console, toaster or fridge. If there's no evidence it's common or commonly used for web browsing, it goes in the 'unsupported' bin alongside old-school feature phones and early Blackberrys.
    – user56reinstatemonica8
    Mar 12, 2015 at 18:38
  • 1
    Another useful link is google's list of devices: material.io/devices
    – user31782
    Feb 1, 2017 at 15:25
  • @user31782 Great link, that plus the observation that only watches are narrower than 320 dp (and those range 136-241 dp) would make a good answer
    – user56reinstatemonica8
    Feb 1, 2017 at 16:35
  • 1
    Now how about 2020? :) Is there any devices that survived and in use? I usually refer to this website, but it doesn't even have 320 now gs.statcounter.com/screen-resolution-stats/mobile/worldwide
    – sr9yar
    Aug 25, 2020 at 9:00

3 Answers 3

Reset to default
18

I have used the following listing to justify a minimum of 320 wide:

https://viewportsizes.mattstow.com/

While it's not completely exhaustive, it's expansive enough to make the point that there are only a few phones in the last few years that have <320px screens, and I have never had anyone argue that the number isn't de minimis.

If you're doing this for responsive layouts, I usually do set a <320 viewport font style, but set the minimum body width at 320... those almost nonexistent users can damn well scroll :-)

Improve this answer
6
  • Nice, +1. Sorting by most recent first, it looks like the most recent <320 is the Nokia Asha 302 from March 2012, at 314px wide, using Nokia's now-defunct proprietary OS. Even the Samsung Galaxy Mini 2 was 320px wide. I have to go back to 2011 for anything <310px. Compelling argument!
    – user56reinstatemonica8
    Mar 12, 2015 at 18:12
  • @user568458 that's what I got too! I just didn't want to mention it in the answer because I wanted to phrase it in a way that would stay relevant for future readers :-)
    – tohster
    Mar 12, 2015 at 18:16
  • The most recent moderately popular Android phone I can find with less than 320px width was the original Samsung Galaxy Mini, from early 2011. That's 240px x 320px, so even a user with an exceptionally small 4 year old phone can still use a site with a minimum of 320px+, with an imperfect but usable choice between landscape orientation or side scrolling.
    – user56reinstatemonica8
    Mar 23, 2015 at 10:00
  • @downvoter can you explain why you downvoted? Irrespective of whether you believe in responsive breakpoints or not, the OP asked whether there are devices narrower than 320px so this answer provides a factual reference.
    – tohster
    Apr 14, 2015 at 17:23
  • Downvotes on SE are broken, 90% are just meaningless animalistic grunts from the ignorant. I stopped caring about downvotes years ago, sadly. This is the best answer, so have an accept.
    – user56reinstatemonica8
    Apr 14, 2015 at 17:32
4

I can only relate to one of the gurus of UX (even if sometimes I don't agree) :

Once again, responsive design is not about “mobile”, “tablet”, and “desktop”. It’s about creating experiences meant to look and function beautifully on anything that can access the Web. Brad Frost

source : http://bradfrost.com/blog/post/future-friendly-fruition/

But anyway, Today (and I insist on that) you don't want to read a full article on a 320px wide device, adapt to the user context and will.

Improve this answer
3
  • What do you mean by "Today (and I insist on that) you don't want to read a full article on a 320px wide device"? I don't understand that phrase. And yes, I don't care if the <320px device is a mobile, tiny tablet, tiny laptop, toaster... just whether it and its web browser are in widespread use.
    – user56reinstatemonica8
    Mar 12, 2015 at 18:08
  • 1
    I mean that the question is not "Are there devices narrower than 320px ?" but "What's the tiniest device my users will use to see my website" And you're the one to know that.
    – François D.
    Mar 13, 2015 at 8:02
  • Well, no, not if only looking at existing users is not an option for any of the three reasons outlined in the question. And assumptions like "I think 320px is narrow, so I'm going to guess that no-one uses devices smaller than that for the web" is exactly the kind of attitude I'm looking to get away from. I'm looking for real evidence about real web users in 2015.
    – user56reinstatemonica8
    Mar 13, 2015 at 8:47
1

According to yesviz.com/devices.php, each of these devices has a viewport width of 162 px:

  • Apple Watch SE, 40mm
  • Apple Watch Series 6, 40mm
  • Apple Watch Series 5, 40mm
  • Apple Watch Series 4, 40mm

Although web browsing with Apple Watch is unpopular, it's possible.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.