Ideal Resolution For Fixed Design

[ivanmax]

Hi everybody,

 

As always, first of all thanks a lot for all your help :nod:

 

Well, a question that everyone of you must have ask him or herself a million times.

 

After trying to make a liquid site I have found that it just give me trouble. It works fine in most screens but it looks horrible in a few others. Therefore I have decided to go for a fixed size.

 

Which one should I choose? Is 1280 for 768 the best one?

 

Please help me with this. I am falling badly behind my schedule...and if I don´t get the site done by june I will fail one of my university subjects (and will look like a moron by the way).

 

Thanks a lot,

 

Iván

[OJB]

There are still people out there who use 800x600 screen resolutions, but there aren't many to be honest - I think you can find this out from google analytics of your site (if you have that)

 

I tend to work towards 1024x768 nowadays and if I am using a fixed with I tend to aim for around 900px width with margin left and right set to 'auto'. Therefore people will smaller screen resolutions won't have TOO much scrolling to do, and those with higher resolutions will have space either side of the main block of content and it will still look OK.

 

 

If you are using Firefox, get hold of WebDeveloper Toolbar, it has the capability to resize your browser to set heights/widths so you can easily check your pages in other dimensions.

Edited April 14, 2009 by OJB

[TCH-Bruce]

I agree with OJB, 1024x768 is a good fixed size. And I concur the WebDeveloper Toolbar is one of the best plugins available.

[TCH-Thomas]

Agrees with above people, although I am still using 800x600.

Visiting a 1024x768 site makes me have to scroll, but not enough to make me annoyed, wider than that will do it though.

 

And another vote for the web developer toolbar.

[ivanmax]

Well, I have worked more on the liquid layout and have tried it in about 6 different monitors (3 I got at home and three more at my university).:

 

http://www.primaryteachingresources.net/te...ml/trying4.html

 

It works perfectly fine in all of them except in one of the old monitors at university, where the upper stripe (the one that contains the "primary teaching..." text and the image) looks much bigger than the 130 px I gave it. Could you please tell me if the site looks ok in your screen?

 

I have designed for 1024x768 and to be honest haven´t care about those who use a 800x600 resolution, as I don´t think there are anybody still using that resolution in my country. The site I am building is destined to be used by bilingual English-Spanish teachers in Spain.

 

I would really appreciate it if you let me know how the site looks in your screen.

 

Thanks in advance.

 

Iván

Edited April 15, 2009 by ivanmax

[ivanmax]

Sorry, that is the link to the site:

 

http://www.primaryteachingresources....l/trying4.html

 

And that is how it is supposed to look:

 

http://www.flickr.com/photos/22338638@N06/3444438404/

 

Does it look like that in your screen?

 

Thanks a lot,

 

Iván

[TCH-Thomas]

It looks good in 1024... for me.

 

In 800... only issue I see is the black line between "logo" and the "menu bar", in 800, this black line does not go all the way out to the right side of the page. Apart from that no issues in 800...either.

[ivanmax]

Yes, I have to check that thing about the black line. I think actually the pic goes down too much at 800x600 but I don´t really know why.

 

Well, thanks a lot,

 

Iván

[OJB]

Other than what Thomas mentioned it looks good for me in Firefox.

 

There are however issues with other browsers:

 

IE6 - The coloured blocks at the top are not sitting next to eachother, they are sitting below eachother. I don't think IE6 supports min-width property - not too sure on that actually. There is also a massive load of space at the bottom of the page.

 

Google Chrome, IE7, Opera and Safari for Windows all have the massive space at the bottom of the page too.

 

Opera also appears to have double thickness borders between your columns.

 

 

 

I would recommend using the WebDeveloper toolbar and validating your CSS and XHTML because it will make fixing bugs much easier if your code is valid. At present there are 3 xHTML errors and 41 CSS errors.

[ivanmax]

Hi,

 

Thanks a lot. That´s is exactly how the site looks in the old computer at my uni. I suppose it has IE7 o IE8 installed. Well, I have tried to install these browsers in my computer to no avail.

 

I have however corrected all the CSS and HTML errors. Now the page has no errors at all according to the validators.

 

Could somebody how has IE7 or IE8 look in their computers? This is driving me mad. Aren´t these new browsers supposed to support at least the same as the previous ones?

 

Also, could somebody tell me why there is a huge black gap at the botton of the page?

 

Well, getting nearer I suppose. I will keep on trying for a few days. If I can´t make this work properly I will go for a fixed design.

 

Thanks to all of you.

 

Iván

[ivanmax]

Hi,

 

Sorry, forgot the link:

 

http://www.primaryteachingresources.net/te...es/html/xx.html

[ivanmax]

Hi,

 

Please check that tool. It is great to see your site in different browsers:

 

http://browsershots.org/

 

Hope you like it,

 

Regards,

 

Iván