Dimensions for designing a webpage

Design & UX
1

What are the best dimensions to use in Photoshop when designing a website for a desktop? Should I use multiple ones or just one?

Also, if anyone knows of any good Photoshop web design templates (like, grids etc) it would be greatly appreciated.

Thanks!

2

When designing a webpage in photoshop, you really need to envision how you want it to display as the screen sizes go down. E.g. are you going to have those X columns stack ? What about removing certain elements of the page in mobile?

I wouldn’t worry about specific dimensions.

3

I am designing a similar theme but totally different layout for mobile, so that can be left out of the equation as I will do that separately.

With the actual desktop display, the actual webpage is going to stay the same size as it is going to have big margins on the left and right, a kind of narrow display. As the sizes go down the margins will shrink, a similar design that twitter have.

4

So it really doesn’t matter? should I just design one with huge margins (max size) and one with no margins (min size)?

5

Most websites do like a max-width:1000px; wrapper and margin:0 auto; it, which will expand to 1000px, and after 1000px viewport, it will begin to center on the page. Much like how I have done my website - http://www.codefundamentals.com

You will see, if you are on larger than 1000px display, it will center the page for you.

Then it willfill the full width of the page in smaller sizes (don’t use that actual HTML as an example, as I go for different visual effects.)

But generally ~1000px wrapper and then auto margins.

6

I’d design one with SOME margins on each side (I assume the space on the margins won’t matter?)

As you go down in size, I’d assume those margins diminish (or are removed completely.)

7

Basically yes, until on a small screen you just have the narrow webpage, similar to your website.

Thanks for your help, it makes a lot of sense.

By the way, your website looks really cool and helpful, the logo is genius aswell :smile:

8

Hello Tobyhall2000, I suggest you a link here for you, hope that you can get much information about what dimension use for a desktop website and many more…
http://www.hobo-web.co.uk/best-screen-size/

Post edited by TechnoBear to remove self-promotional link

9

That article is a bit misleading. It assumes that desktop users will have their view-port maximized.
I haven’t done any testing, but I have a feeling this is rarely the case.

1 Like
10

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.