There is No Best Size for a Website

By Jacco Blankenspoor
We teamed up with SiteGround
To bring you the latest from the web and tried-and-true hosting, recommended for designers and developers. SitePoint Readers Get Up To 65% OFF Now

With responsive practically becoming the standard, it’s harder than ever to define the best size for a website. Before responsive became mainstream, we used to base our design width on which screen sizes were popular at the moment.

This way you knew that at least way a large portion of your sites’ visitors would see the site as you intended. But as screens became bigger, so did our websites. Only to be followed by smaller screen sizes, due to smaller laptops becoming popular.

Luckily responsive sites solve a lot of this bouncing up and down so you can make you website look good on most screens. But it still doesn’t answer the question of what is the best size for a website. Time to do some research.

A little bit of screen size history

Source: Statcounter

Source: Statcounter

Let’s first look at some of the most popular screen sizes over the years. According to the data Statcounter (a popular free visitor counter) provides, 1024×768 was the most popular size up until March 2012. That month it was surpassed by 1366×768, which is still the most popular today.

The difference between these two sizes? 1366×768 is widescreen with a 16:9 ratio, where 1024×768 has the more traditional 4:3 ratio. This shift marks the change from regular desktop monitors to the still very popular widescreen laptops.

The 1366×768 size is just for display screens ranging from 10.1 to 16 inch, but you can imagine it won’t look that pretty on the latter.

So it’s safe to say that if you decide to use a static size, 1366×768 is your safest bet. That is if you cater a general audience.

1920×1080 (Full HD screens) is on the rise too, especially with a tech oriented audience. This means these people will see your 1366×768 site with large empty spaces left and right.

And did you see the large “Other” line in the StatCounter screenshot? There’s just a whole range of different screen sizes to design for which don’t fall in the listed size categories. That’s where responsive comes into play.

How about responsive?

Making a site responsive is more popular than ever. It allows for one design which is displayed full width on any screen size. Adapting a websites’ view size is regulated with CSS and is based on the viewport of the device a visitor is using. The viewport is the visible part of your website, without scroll bars.

Annarita wrote an excellent article about the concepts of responsive design here on You can read it here.

A general assumption is that you can use a responsive design to make a website look good on any type of device. That is not entirely true. A responsive design makes sure that the maximum view space of each device is used when viewing your site. It basically means no horizontal scroll bars. But that doesn’t mean it will actually look good.

To see a live example, please have a look at one of my sites which uses responsive design. It uses a full page background image which I believe looks great on a Full HD monitor (which I’m using myself). The sidebars are still on default settings.

The WordPress theme I use is optimized for responsive, which means, for example, even the call-to-action “Apply” boxes scale down.

Now re-size your browser, and see what happens. The sidebars are moved below the main content, therefore losing their use as sidebars. They become just a bunch of boxes for which no one will take the effort to scroll down to see them. Imagine if you HAD ads put in there: this will severely reduce your earnings. It looks even worse on mobile, toO crammed up which makes your small mobile screen feel even smaller.

While I don’t like the sidebars below the content, I wouldn’t want them placed in between content either. I may be a bit biased since I really don’t like responsive (I decide to buy a larger phone and use desktop sizes instead), but you have to be really creative if you want to make proper use of sidebars.

You basically have to accept the fact that you need to include your most important links and ads in-content or they probably won’t get seen. But you need to be very sure this design still looks good on desktop or tablets (for which you should disable responsive), since it’s bound to mess up your layout if you don’t keep an eye on it.

Responsive design works better for layouts which don’t include sidebars in the first place. But there’s only so much room on smaller screens, so even with an optimized mobile layout you need to decide which content you want to show the most.

So is responsive the best “size” for a website? Probably yes, but life was much easier when we were all just using the same screens.

Let me know in the comments what you think is the best size for a website, or what your thoughts are on responsive design in general.

We teamed up with SiteGround
To bring you the latest from the web and tried-and-true hosting, recommended for designers and developers. SitePoint Readers Get Up To 65% OFF Now
  • Responsive design is just a compromise. It is important to underline the difference between “RWD” website ( Responsive Web Design, one website, one content) and “Mdot” website (dedicated mobile, tablet & desktop websites). Mdot website will then provide a better solution as each device has its own version of the same page, however it costs much more in time & effort. Unless you have the relevant budget & time (& you’re ready for very annoying/time-consuming website editing) to have an “mdot website”, you’ll do like most not-huge organization: use a responsive design.

    Some good links:

    • Hi Adrien, thank you for your valuable response. You’re right about Mdot websites, it’s a different approach but a tedious one. It would probably solve the concerns I have with responsive though :-)

      • Yes, it probably would. Although it might be really hard to find a system that makes sure your content is consistent across website versions. Responsive websites allow you to have the same content across devices. A user can share a page via email, chat, social website, or else & you can be confident that across devices the content will be reorganised (layout) but the content will remain the same.

        • I totally see the benefits of responsive, it’s just that I wish it could be different. Oh well, maybe I’m just old-fashioned ;-)

          • “maybe I’m just old-fashioned” maybe it’s not about beeing old fashioned but maybe about accepting to be right at some point until one day where our “way of doing/thinking” is just deprecated/wrong. The thing is, our field changes so fast that we barely have time to get good at something that another “cool” & possibly better concept comes in & what we learned is now wrong/deprecated. I see this every day & I find it too much sometimes, it’s all very exciting but the down side of this very-experimental & ever-evolving side of the industry is that there is no-one you can turn to and say “hey you old man, you got 25 years experience so you know it all, please enlighten me”, because a lot (all?) of this “old man”‘s knowledge is completely deprecated. Of course you will get exceptions but I have not met many unfortunately.

          • You said it right. Maybe we just need to wait this one out ;-)

        • Responsive should pre preferred way of “Mdot” sites in most cases. Even if you have complex solutions, providing fallbacks based on user agents should be used, not a redirect to site, where social sharing/SEO and a maintenance falls apart

          • I totally agree. The costs of maintaining separate websites is just far too high to even consider mdot sites as a solution.

      • Another point: if you are concerned that people (ie. who have a phone with a huge screen) can still see the website as if they were on a desktop, you can simply implement a button/dropdown to choose the device version of the website you want to view. It would be very easy to implement.

        • Hi Adrien, while this could solve the problem it does add an extra step to take, one which many won’t do. So you still need to have a mobile optimized version.

    • mvchx

      I really have to disagree that “Responsive design is JUST a compromise.”

      If you are paying attention to the market of devices these days, I would hope you recognize that responsive design is at least a necessary part of the solution moving forward. For instance, there used to be a gap between phone and tablet – it was called the 6″-7″ gap. It is there no longer. Devices range in size in a linear increase from small to large now.

      The idea that any company or organization is going to ever have the resources available to maintain a multi-faceted and multi-facing solution set is fast becoming an archaic one.

      Just as some groups (Mozilla) have presented ways to better understand from our side what device we’re dealing with, and then present the user with a design that best suits their screen size, so must we continue to push and *ask* via the proper channels for browser organizations to allow those proposals to become standard.

      I really do like the sentiment of this article even though the author himself doesn’t like responsive. I’m curious as to why they feel that way – because there are a lot of sites out there that prove that not only can responsive be maintained, but it can present the information in a prioritized fashion that maintains the integrity of information priority.

      YES it takes longer to create, but in the end, when my crew are done figuring out the solution, there is a huge sigh of relief that we’re not having to watch four different code bases for one site. We don’t have the time, nor the energy, (and our client doesn’t have the budget) for that approach.

      • Hi, thank you for your detailed reply. You’re right I’m not a big fan of responsive. What I don’t like is the fact that you have to settle for using the little screen real estate you have for mostly content (because that’s the focus when the sceen minimizes). There’s hardly any way of monetization, at least not as with the big banners you have on desktop and tablet version.

        I do agree that many sites are doing it right with responsive, but those are mostly without banners (and responsive banners aren’t that great)

        Some will like this specific fact because they hate all of these ads, but being a publisher myself I know you can’t hardly live without them on your site (and I do believe a good ad can complement you content).

      • “I really have to disagree that “Responsive design is JUST a compromise.””, let’s agree to disagree ;-)

  • My screen resolution is 1920×1080, but I rarely (almost never) have the browser maximized. 2/3 to maybe 3/4 of my screen width is more common for me. I will often widen the browser window simply to see more of my open tab descriptions. How common is it for people to use their browser in a maximized state?

    • I agree John, I never have my browser maximised out to the full screen width either, and think most people with larger screens are likely to have a few windows displayed at once rather than one whole window open when browsing the web.

      • Stefan M.

        Well, Jacco doesn’t. I browse full screen, as well. I prefere the tabs when I’m browsing for news articles, videos, fun… whatever.
        When I work on something, though, I prefere minimized windows because making connections between infos on different pages is easier when the pages are in sight. Switching between tabs in a such situation confuses me.

    • Good question :-) I myself always open everything full screen on my 32 inch monitor. But that’s because it was either a large screen or wearing glasses :-)

    • OphelieLechat

      I wonder if the popularity of smaller laptops might change this behaviour. I always have my browser at full size, because anything less than that just doesn’t leave enough real estate on my 11″ Macbook Air.

    • David FünfvorZwölf

      I think thats mostly influenced by the Users Operating System and it’s window management. On Win windows expand over the fullscreen when maximized, which is also the default window size. On OS X that’s 2/3 of the screen.

  • Matt

    Responsive design doesn’t mean that your ‘built for desktop’ website should just be stacked and condensed to fit on mobile. Your layout and content placement should still be considered as it responds. So the positioning and hierarchy of your sidebars and their content should be based on the importance of that content and not on where the boilerplate or wordpress theme places it. The D in RWD stands for design and is something that must be actively applied.

    • Hi Matt, you are correct. It’s a bit strange that the default way for most themes is sweeping from left to right over the site, where left becomes top and right becomes bottom.

      • Tanfastic

        This is a big frustration point for me when architecting site structure and page elements for my clients’ sites. Having blocks of page elements that you can place in different ways on desktop and mobile often doesn’t work in reality, but we don’t want to be recommending mdot sites as it doubles maintenance and upkeep. It’s often a tough nut to crack for sure.

  • Tim

    The best size for a website should be determined by your site’s purpose, it’s content and it’s target market. For example, a photography portfolio site could be responsive, but really who cares about looking at your photos on their phone? You are not going to be able to see any of the detail like you can on a desktop. And if you do, you have to zoom in to do it, which sort of defeats the purpose of having a responsive site in the first place.

  • Hi Matt

    Great article! I enjoyed reading it.

    I guess the answer to ‘What’s the best size for my website?’ comes down to so many factors, usually project and audience specific, but i’d be inclined to argue that in general, adopting a ‘mobile first’ philosophy is the strongest stance to take in today’s market, rather than simply seeing responsive as a kind of fallback or second best option.

    • Hi Robert, thanks (even though I’m not Matt :-)! Yep, it’s hard to answer the question what really is the best size. Regarding the “mobile first” philosophy: I can see why you prefer it, but in many cases dekktop + tablet account for the most visitors, meaning mobile shouldn’t be put first. It really depends on your audience indeed, I guess the younger they are the more mobile engaged they are.

    • Mobile first should’nt be nr1 phisophy in web design/development untill mobile as a whole is nr1 thing. Untill now we see big growth but biggest part of most websites are still desktop so desktop first should be applied in pretty much cases still, but after year or two that may change

  • That’s a good example of how important your targeted audience is. And let’s not forgot that besides size, mobile deviced doesn’t seem to handle all of the fancy scripting that well. Even with tons of memory on it you’re bound to have crashes, sometimes it’s just too much for it to handle.

  • John Syben

    It feels to me that your article is not really about figuring out the best size for a website. The answer to that question is simple: The best size for a website is the one that makes it easiest to consume the website’s content. As such, responsive design (if done well) is the optimal solution.

    Your issue seems to be more about the difficulty you have with placing revenue generating content on smaller screens so as to optimize income. This is a design/implementation issue, not a “best size” issue.

    • Hi John, I guess it depends on what you define as “best”. I believe there should be a healthy balance between providing content, and making money with it. So yes it’s a design issue, but you can’t separate it from size, being the most important factor to display additional (advertising) content.

  • Mohd. Mahabubul ALam

    We get this this question all the time: Is there an ideal length for website content? My honest answer is, “Absolutely not.”

    While I don’t recommend that you go on and on like the Great American
    Novel, there is no real best practice about website page length. Every
    website, business and web page is unique. The general rule of thumb for
    content length and density ranges greatly, from a minimum of 200 to
    maximum of 1,000 words per page, depending on the topic complexity and

    The main goal of website content is getting your message across
    effectively and enticing your reader to take action, while being
    concise. Remember, you only have a few seconds to capture someone’s
    attention and sell your idea…no matter how many rules and formulas you

    7 key tips for determining website content length

    Be helpful and relevant. The key to successful website copy
    is relevant content. Write for people, not search engines. You aren’t
    selling your product to search engines; you’re selling to people. Be
    interesting, solve a problem and offer a solution.

    Stay focused. Focus on one topic, service or product offering
    per page. Trying to fit in too many ideas on one page will confuse
    people and distract them.

    Be concise. Less is more when it comes to content length.
    Stay succinct while getting your point across. You want to write enough
    to convince your target customer to take action and make them want to
    know more, but you will lose anyone’s attention after a certain point.
    You only have about 8 seconds to capture someone’s attention.

    Incorporate headlines. Readers like to scan information on
    website pages. Make sure your website content includes headlines to
    guide readers’ eyes scanning through the page. Incorporating an H1 tag
    (headlines) in each web page also improves on-page search engine

    Use bullet points. Case in point. Whenever possible, bullet
    out ideas and tips so readers can absorb information quickly. Bulleted
    lists are easier to read and retain too.

    Be consistent. Many businesses make the big mistake of being
    inconsistent in their tone and message. Having a consistent voice makes
    people remember you, increases perception of reliability and enhances
    your overall branding and messaging.

    Add calls-to-action. The goal of most website content is to get people to take action. Including calls-to-action
    (CTA) on all of your site pages is essential. What does that mean?
    Somewhere on each page, ideally at the end or on the side, get them to
    do something. Ideas for CTAs include:

    Adding a link to your contact page

    Offering free information in form of a whitepaper or guide

    Enticing visitors to sign up for your e-newsletter

    Inviting them to connect with you on social media channels. Remember
    to tell them WHY too. There’s nothing interesting about a business who
    just calls out “Follow us on Facebook” without the WHY. Say what’s in
    it for them.

    While there are no real defined rules for exact website content
    length, following these basic standards will ensure that your content
    captures attention and ignites action from your readers.

  • Bob

    I’m afraid I don’t see what you are talking about with the airport jobs sites. The only thing that happens when I reduce the page zoom or the browser size (Firefox 26 or IE 8) is that all elements shrink proportionately. Nothing “moves” below anything else or is otherwise rearranged on the page.

    What “sidebars” are you talking about, the ‘Popular Airports’ and ‘Comments’ sections on the right? They remain in place no matter what I do? So what am I missing?

  • Carla Keegan

    Layout, design and content are all important factors when it comes to creating the best website possible. I’ve been reading some tips which has allowed me to look at my business page (which is WordPress) and think about making significant changes to it. There’s always potential to fix it but your article has outlined key points. Thanks!

  • Stefan M.

    I’m good with layout designing. Four years ago, a friend (programmer) said that if I learn programming I’ll be an amazing webdesigner. I learned HTML, CSS, then I quit because… I’m a perfectionist, and designing a layout that would look the same for all visitors was impossible.

    Forget about displays sizes varying from 1024 to 1366, but you had no way of knowing what the visitor’s vertical display space will be: some had no toolbars, others had too many. That sucked the most!


    Today I wanted to check out what’s new in webdesign and I learned about this “responsive” style needed because gadgets producers are selling all types of resolution displays.

    So far with new beautiful layouts!

    I’ve googled for “best responsive website designs”, checked a few selections and… I’ve noticed that no matter how good a layout looks on some resolution, it will always look like plane shit on another.

    Well, unless you want a super-minimal design with not much to display. In that case you’ll have a dull page on any resolution, but at least there are no differences from one display to another.

    An example would be Obama’s campaign responsive web page, an old version shown on a webpage named “what the neck is responsive web design” (1st result on Google, if you’re curious, then half way down into the page).

    The mobile version and the 4:3 versions are… awful, so unaesthetic! Meanwhile, the 16:9 version looks very nice.

    My conclusion?
    If you wanna make sure your page will look good on any display, you must create at least 3 layout versions for it, 5 would be decent, and more than 5 would be kinda crazy. But hey! If your image is supposed to sell, then it’s worth the investment.

  • Fine! Let’s say i don’t need a responsive website and there is no a best size for a website …what do you think might be the best considered width size for a website when it’s non-responsive? I read somewhere they said 1200px is the perfect one, any second thoughts about it ?

    • The article shows that 1366×768 is the most common screen resolution to date, so anything up to that resolution should fit on the majority of screens.

      If you want to use 1200px, fine. If you want to use 1280px, fine again. If you want to use 960px, also fine. It’s entirely up to you.

  • You’re right, going for 3 layouts is pretty standard: one for mobile, one for tablet, one for desktop.
    You can go for 5, but I’d suggest trying to do it right for 3 before that.

  • David Hunter

    Be interesting to read your thoughts Jacco, one year one, now that Google is forcing web design to be ‘mobile friendly’. Being an older designer in both years and simplicity, it seems that personal design for a client is now being dictated by technical requirements of those who decide whether our website is acceptable or not to be shown to the internet users who only look at sites on page 1 of Google results.

    • Hi David. Yes, Google with their “mobilegeddon” update shook things up a bit. Fact is, we were always at the mercy of the Big G, who constantly changes technical requirements to be “allowed” to be found. I haven’t seen any conclusive evidence that whether or not sporting the “mobile friendly” tag really impacts results, as these things shift on a daily basis for various reasons.

      I am still no fan of mobile/responsive sites, both as a user and as a developer, but I just got to adjust. Strange thing is though that especially AdSense based sites are hurting the most. Even in responsive mode, these type of ads just aren’t really made for mobile. They can easily cover your whole screen when using smaller phones, accidental clicks are common (although they are working on that), many phones still can’t handle a heavier site without crashing, and most of all, CPC’s are lower. But since Google is running the show with AdSense, I guess they know what they are doing?

      My thoughts on the best size are basically still the same as one year ago, but mobile is becoming more and more important and that’s just something I have to accept. For me, I try to steer away from AdSense for example, using affiliate programs to allow for in-content links. Every site I make is always responsive, but I try to stay away from sidebars as much as possible, so at least I get more control of placement. And I put as much of the money makers directly at the top of a page, since mobile users either scroll very heavily, or don’t scroll at all :-)

  • I try to avoid responsive webpages most of the time.
    Maybe a bit old fashion, but the downsides of a heavy responsive website are enough to let me setup a mobile version of the website on

  • Kim Kawlan

    Practical ideas , Incidentally , if your
    business needs to fill out a CA CDE B1-1 , my friend found a sample
    form here