I work with a graphic designer, she was asked to create a full width slider images, she asked me about the screen width, I said I don't know it varies, she wanted a number to use when designing I google and most websites say that 980 is the standard width.

This is nothing new for me, 10+ years ago when I started create websites, they used to teach that the standard with is 980px.

I tell her that, we test her design, it becomes pixelated, 980px true size is barely 3/4 of the screen.

Is the 980px width rule still a thing? If not what's the defacto width that we should ask designers to use when designing for PC.

Is there another for mobile? I know we can make everything responsive but in case we need a number. Like say we have a slider with text on it that doesn't get resized nicely.

  • I will say 1280 is the minimum and 2560 an ideal one to cover all types. Naturally the image quality should be lowered for large images to keep the file size under control. It also depends on the image - an image of clouds will look alright even after slight stretch, but a daylight cityscape with sharp edges of the buildings will show pixelation very easily.
    – Ren
    Commented May 17, 2019 at 17:52

5 Answers 5


The UX answer would be to provide the best experience for your customers.

If full-width is your solution then you will need to create and implement designs for multiple break points.

To answer your question directly. No.

980px is useful as approximation for a desktop users. It works on designs for 1024 and above. Example: a design with side margins.


IMHO, I don't think 980 is a good rule of thumb for anything fullwidth on desktop or tablet anymore, especially because of "retina" displays. If I had to choose one resolution to rule them all, I'd probably go 1440 or 1920, but you're still going to be shooting in the dark there and adversely affecting users with poor connections.

Some of this depends on what the slider imagery is (can it be solved with SVG?), whether it's being implemented as img tags or with CSS, whether text in the slider is actually in the image (not accessible), how apparent degradation would be, and how confident she can be that her users will be on high speed connections.

Ideally, she could ask for google analytics data (if it exists), but here are some stats for worldwide desktop screen resolutions in current use. As you can see, 1366/1440/1920 combine for almost 50% of usage. You could find some mobile stats on that site too.

I also think that this would be a ripe case for responsive images (dev-heavy link) and CSS backgrounds, if possible. It would require some closer developer collaboration, which she may or may not have access to.

  • Screen resolutions do not include DPI or DPPX. In addition, the Screen Size is not the same as Browser Viewport. I would guess that most web browsers are not being run in Full-Screen mode. Finally, most of these statistics are ambiguous as to whether that are screen or browser dimensions.
    – donohoe
    Commented May 22, 2022 at 19:52

Devices in the wild are too diverse for a single size to work well for everything.

  • Design for the widest monitor you'd expect, likely around 4096.
  • Create differently sized variants for smaller monitors. Could be via rescaling or cropping or other means.
  • Use javascript to detect monitor/window size to choose an appropriately sized image.

Trying to use a pixel width for a standard size has been a losing battle for years and no web developer or designer should have that as a goal. You do not know, and cannot reliably determine, the size of anyone's display size. So don't do that.

The best response I've ever read about this question is, start with the smallest possible display width--which is 320px for mobile devices but you could start at 280px--then widen it out until it looks like $#%&. That's your breakpoint.


No. However you won't get a clear answer on what that new (higher) number is.

I myself am going with 1280px - but my focus is in media so this answer is subjective.

Many stats sites talk about very large displays for laptops and desktops in general. However screen display is not the same as browser display. From my own general user-testing, most people do not have the browser viewport the same as the screen - especially on much larger displays.

In addition, the stats on Screen Size do not include information on DPI (or dppx). DPI is often used for the actual device pixels and Dots Per Pixel (dppx) for the amount of device pixels per CSS pixel (in Retina displays this will be 2).

When I look at my own stats for site traffic in GA, I assume that any device with a screen width > 1600px has a 1.5 or 2 dppx. So for all reports of a 1900px (width) I put it down as 1266px display monitor.

My own personal sanity check on this is that the average max-width for most western news media sites (the industry I care about) is an average of 1300px.

Screenshot of max-width on various western media news site homepages which is about 1300px

Your Answer

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

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