Photoshop File Website

Hello, I was wondering what the size should be for a website to full width, the width size I should
work with within the photoshop or Illustrator when doing wireframes as well? and of course the height depends on how much content correct?

Here is sample of full width I am speaking about:

My two cents :wink:

I think viewport width could to a degree depend on who you target? Casual users (mind; only my experience watching less than ordinary users) I see more often let the browser fill the screen. I usually narrow the browser in order to make room for two side by side, because not many sites make use of a really wide screen/viewport.

In really wide viewports I would like an approach like the smaller two-panel example in the foreground. That way you have more content above the fold. And if the screen is narrower the left panel drops below, nav I would prefer on the right hand panel.

It finally comes down to how content need to be presented from the visitors viewpoint, and what your target visitor would expect trying to handle it.

There is a simialr discussion going on here if it helps.

1 Like

There is no width any more as all devices are different so the question should be "how can I present my content in the best format to cater for whatever width the device is?. It’s the reverse logic to creating a design because the web isn’t paper and has no edges or boundaries.

Therefore you need to look at your content and decide how best that content will look at certain widths. As Erik said above you have to think about your content needs to be presented and things like line length and readability are important. You also need to arrange your content into manageable sections depending n the width of the device.

You can of course set a max-width for content (maybe around 1200px) but that doesn’t mean one line of text should be 1200px wide. You should arrange for columns at the wider viewports and less columns at smaller viewports or move sidebars out of the way etc.

Background images can of course be full width but big images mean big file sizes so be careful.

In the end the width depends on the content and on the device. The width in photoshop should take last place and serve only as an indication of what the site may look like at that size.

Sorry if that’s not much help but these days there is a push towards designing in the browser rather than in a paint package (although I know that will never fully happen).:slight_smile:

4 Likes

thanks guys @PaulOB @SamA74 @Erik_J ill take a look at this in more detail later…

ah I see…yeah that weird I was taught to design first in photoshop with wireframes and mockups not designing in the browser…is 1024 x 768 considered full width aspect ratio?

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