Mobile app version of vmapp.org
Login or Join
Martha676

: What is the standard width for a website in pixels? Any number greater than 0 and less than infinity. Current best practices for Responsive Web Design (RWD) are to support every device

@Martha676

What is the standard width for a website in pixels?


Any number greater than 0 and less than infinity.

Current best practices for Responsive Web Design (RWD) are to support every device regardless of its width in pixels. Typically this involves using media queries to provide different styles for different ranges of screen sizes. The actual ranges used matter less than the design being consistent across sizes, and the site maintaining functionality across sizes.

Users are very likely to see different screen sizes without thinking much about it, so you want to minimize the amount of surprise when they drag a window to dock on half their screen, or happen to tilt their phone.

Some common width ranges used are:


extra small: 0-480
small: 480- 768
medium: 768-1024
large: 1024-1200
extra large: 1200+


These ranges are so common that I'd say they're practically a standard. Not all ranges need to be used, for example a site might be fluid width for anything below 768 and then fixed width and centered for 768+.

With all that said, be aware that the numbers you use don't particularly matter so long as the site is functional on whatever device a user chooses to view it on.


where are statistics?


Now to the tricky part, the actual data. If you're redesigning a site, the only data that matters is your own. What Wikipedia or Stack Overflow, or Google, or any-other-large-website-that-might-list-analytics-data says is irrelevant to your data for your site.

If your statistics show most users primarily using a particular range of device widths, you should probably focus on serving those users first. That all said, If your design is properly responsive you won't need to focus on any particular size at all.

For new websites or sites that didn't previously have analytics, heavily consider using a mobile-first approach, and be sure to use analytics so that you can properly adapt to your user base.



Old, Out-of-date Pre-RWD Version for Posterity's Sake

I am surprised that no one else has thought to mention browser size by google.

As for standards:

80% of viewers can handle up to 1000px width, but the ones that can handle more than 1000px width often don't. With wide screen monitors many people will align their windows to half the screen. Now that Win7 supports drag-n-dock, it's likely it will become even more popular.

As for height: your first impression to the user is at the top of the page up to around ~600px. However, most users know and expect content to fall "below the fold" and are willing and able to scroll.

If you want to go wider than 1000px, I'd highly recommend a fluid layout so that users on netbooks and smaller screens can still see the content properly.

~960px tends to be a standardized width, but really it depends on the content and the style.

10% popularity Vote Up Vote Down


Login to follow query

More posts by @Martha676

0 Comments

Sorted by latest first Latest Oldest Best

Back to top | Use Dark Theme