Web Design Forums

Wrams · 04-09-2008, 16:32

Hi All!
If im going to build a website myself whats the best sizes and what size header etc etc?
I don't know if this is a lame question but i'll soon find out...

P.S I'll make my own headers in Photoshop CS3.

emil · 04-09-2008, 16:37

Design for the lowest resolution your users have. If you don't have stats, a safe thing to do would be to design for 1024x768 (roughly 960 pixels wide and about 550 pixels above the fold)

sub · 04-09-2008, 16:40

Designers Toolbox: Web Safe Area

emil · 04-09-2008, 16:50

Neat resource, that. I seem to have missed this bit.

Wrams · 04-09-2008, 17:07

Thanks Guys.

funkyprem · 04-09-2008, 18:17

that sir, is a quality resource!

Synook · 05-09-2008, 03:17

That's very useful.

Frenelli · 05-09-2008, 08:06

I don't get how it works.
Why not just make all webpages 1200x900 since that fits on a 13" screen. and that's the smallest.

Agricola · 05-09-2008, 08:57

Quote:

Originally Posted by Frenelli

I don't get how it works.
Why not just make all webpages 1200x900 since that fits on a 13" screen. and that's the smallest.

Are you Serious?

Frenelli · 05-09-2008, 09:25

Totally, please explain how this works since i'm a bit lost.

pagey · 05-09-2008, 09:46

Its all dependent on screen resolution, not just monitor size.

Right click on your desktop, click properties and then go to the settings tab. Fiddle with your resolution and see how things change.

Different users use different screen resolutions, so the most popular ones must be catered for, which is why websites based on 800 x 600 were so popular a fwe years ago. As the most used resolution is now higher (1024 x 768), websites are being made wider.

Frenelli · 05-09-2008, 09:50

So how many pixels should I make a website?
If every computer had 1024X768

sub · 05-09-2008, 09:54

Depends on the browser.
Read the info at the link above.

Frenelli · 05-09-2008, 09:56

Quote:

Originally Posted by sub

Depends on the browser.
Read the info at the link above.

well isn't there a middleground that will work on every browser?
i'm sure if you make it small enough it will show up on any browser on 1024x768 no?

Agricola · 05-09-2008, 10:04

I am amazed you say you do web design yet have no idea how resolution and pixels work.

the resolution is how many pixels are being displayed, so 800x600 means 800 pixels wide and 600 high. The image you see on your screen is produced by a graphics card or on board graphics chip . If you have your graphics settings set to 800x600 and view a web page with a fixed width of 1000 pixels, then obviously you are not going to be able to see the whole page on your screen and you will have to scroll left and right to see some of the content.

Monitor size will only effect the visual size of an image, if you have a 13 inch monitor that is capable of running 2000 odd pixels and you set the graphics card to show this, then you will have difficulties reading text or even making out desktop icons, but output to a 28 inch and everything is nice big and easy to read.

Frenelli · 05-09-2008, 10:12

Quote:

Originally Posted by Agricola

I am amazed you say you do web design yet have no idea how resolution and pixels work.

the resolution is how many pixels are being displayed, so 800x600 means 800 pixels wide and 600 high. The image you see on your screen is produced by a graphics card or on board graphics chip . If you have your graphics settings set to 800x600 and view a web page with a fixed width of 1000 pixels, then obviously you are not going to be able to see the whole page on your screen and you will have to scroll left and right to see some of the content.

Monitor size will only effect the visual size of an image, if you have a 13 inch monitor that is capable of running 2000 odd pixels and you set the graphics card to show this, then you will have difficulties reading text or even making out desktop icons, but output to a 28 inch and everything is nice big and easy to read.

Well I'm more into the DESIGN part than the WEB part.
But thanks for the explanation.

Agricola · 05-09-2008, 10:17

Quote:

Originally Posted by Frenelli

well isn't there a middleground that will work on every browser?
i'm sure if you make it small enough it will show up on any browser on 1024x768 no?

until this year it was standard industry practice to make all website viewable for people who used 800x600 , by making the content no wider than 780 pixels, give or take a few. Again see link provided above to see what "safe areas" are

However the statistics this year show that as people replace older machines, upgrade or actully learn they can change to higher resolution, the need to support 800x600 resolution is dying. This year the BBC website abandoned its 800x600 support and went over to 1024x768.

The whole argument though is do you abandon 800x600 support when a significant percentage of your visitors still use this?

Wrams · 05-09-2008, 10:19

I have a 24" HD Monitor and a GForce FX 8800 GT Graphics Card in my tower. My settings are set at 1920x1200 pixels and some sites look small others fit perfect and look great. If you running a standard onboard graphics card then you need to find the best display settings for that card. Most onboard graphics cards will only support up to 1280x720 before making everything look nasty. The best way for you to learn what size is good for screens is to learn pixel ratio then try different settings, so even people with low resolution will see your site as you intend it to display.

04-09-2008, 16:32	#1 (permalink)
Wrams Its me Wrams Join Date: Aug 2008 Location: Bristol, England Posts: 31	Website Sizes Hi All! If im going to build a website myself whats the best sizes and what size header etc etc? I don't know if this is a lame question but i'll soon find out... P.S I'll make my own headers in Photoshop CS3.

04-09-2008, 16:37	#2 (permalink)
emil dt immigrant Join Date: Nov 2004 Posts: 11,275	Design for the lowest resolution your users have. If you don't have stats, a safe thing to do would be to design for 1024x768 (roughly 960 pixels wide and about 550 pixels above the fold) __________________ Design & Illustration

04-09-2008, 16:40	#3 (permalink)
sub Cream of DT Join Date: Jul 2005 Posts: 13,836	Designers Toolbox: Web Safe Area __________________ K "I&ORQ" B

04-09-2008, 16:50	#4 (permalink)
emil dt immigrant Join Date: Nov 2004 Posts: 11,275	Neat resource, that. I seem to have missed this bit. __________________ Design & Illustration

04-09-2008, 18:17	#6 (permalink)
funkyprem For all your goober needs Join Date: Dec 2004 Location: Coventry, UK Posts: 1,848	that sir, is a quality resource! __________________ The human race is faced with a cruel choice: work or daytime television. prem ghinde

04-09-2008, 17:07	#5 (permalink)
Wrams Its me Wrams Join Date: Aug 2008 Location: Bristol, England Posts: 31	Thanks Guys.

05-09-2008, 03:17	#7 (permalink)
Synook What happened? Join Date: Jul 2008 Posts: 2,196	That's very useful. __________________ Web developer • Aspektas • Blog • Twitter • •

05-09-2008, 08:06	#8 (permalink)
Frenelli Senior Member Join Date: Jul 2008 Posts: 318	I don't get how it works. Why not just make all webpages 1200x900 since that fits on a 13" screen. and that's the smallest.

05-09-2008, 09:25	#10 (permalink)
Frenelli Senior Member Join Date: Jul 2008 Posts: 318	Totally, please explain how this works since i'm a bit lost.

05-09-2008, 09:46	#11 (permalink)
pagey . Join Date: Aug 2006 Location: . Posts: 1,757	Its all dependent on screen resolution, not just monitor size. Right click on your desktop, click properties and then go to the settings tab. Fiddle with your resolution and see how things change. Different users use different screen resolutions, so the most popular ones must be catered for, which is why websites based on 800 x 600 were so popular a fwe years ago. As the most used resolution is now higher (1024 x 768), websites are being made wider.

05-09-2008, 09:50	#12 (permalink)
Frenelli Senior Member Join Date: Jul 2008 Posts: 318	So how many pixels should I make a website? If every computer had 1024X768

05-09-2008, 09:54	#13 (permalink)
sub Cream of DT Join Date: Jul 2005 Posts: 13,836	Depends on the browser. Read the info at the link above. __________________ K "I&ORQ" B

05-09-2008, 10:04	#15 (permalink)
Agricola Senior Member Join Date: May 2007 Location: England Posts: 1,143	I am amazed you say you do web design yet have no idea how resolution and pixels work. the resolution is how many pixels are being displayed, so 800x600 means 800 pixels wide and 600 high. The image you see on your screen is produced by a graphics card or on board graphics chip . If you have your graphics settings set to 800x600 and view a web page with a fixed width of 1000 pixels, then obviously you are not going to be able to see the whole page on your screen and you will have to scroll left and right to see some of the content. Monitor size will only effect the visual size of an image, if you have a 13 inch monitor that is capable of running 2000 odd pixels and you set the graphics card to show this, then you will have difficulties reading text or even making out desktop icons, but output to a 28 inch and everything is nice big and easy to read. __________________ War is Gods way of teaching Americans Geography Wot Speeling Mishtake?

05-09-2008, 10:19	#18 (permalink)
Wrams Its me Wrams Join Date: Aug 2008 Location: Bristol, England Posts: 31	I have a 24" HD Monitor and a GForce FX 8800 GT Graphics Card in my tower. My settings are set at 1920x1200 pixels and some sites look small others fit perfect and look great. If you running a standard onboard graphics card then you need to find the best display settings for that card. Most onboard graphics cards will only support up to 1280x720 before making everything look nasty. The best way for you to learn what size is good for screens is to learn pixel ratio then try different settings, so even people with low resolution will see your site as you intend it to display.

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

Thread Tools	Search this Thread
Show Printable Version Email this Page	Search this Thread: Advanced Search