resolution compatability issues

This is a discussion on "resolution compatability issues" within the Web Page Design section. This forum, and the thread "resolution compatability issues are both part of the Design Your Website category.



 Subscribe in a reader

Go Back   Webforumz.com > Main Forums > Design Your Website > Web Page Design

Notices


Reply
 
LinkBack Thread Tools
  #1  
Old Feb 7th, 2007, 16:57
New Member
Join Date: Feb 2007
Location: Virginia
Posts: 4
Thanks: 0
Thanked 0 Times in 0 Posts
resolution compatability issues

Alright, so here's my biggest issue with my page. When I worked on the CSS, I did all my work & tested it using 1600x1800. So it all looks good to me. Unfortunately, I failed to take into account how others would see it using a lower resolution setting. Yeah, a big, fat, ugly mistake on my part (but in my defense, I'm still just learning CSS).

So the question I have is how do I rectify this? How can I fix it?

Additionally, I seem to be having issues with my header not displaying in Firefox, even though everything seems to check out for compatibility. Whats the deal with that?
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote

  #2  
Old Feb 7th, 2007, 17:00
Elite Veteran
Join Date: Jan 2007
Location: You know where
Age: 31
Posts: 4,617
Thanks: 0
Thanked 0 Times in 0 Posts
Re: resolution compatability issues

Without a link it's hard to help.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #3  
Old Feb 7th, 2007, 17:16
Reputable Member
Join Date: Dec 2005
Location: Texas
Age: 19
Posts: 328
Thanks: 0
Thanked 0 Times in 0 Posts
Re: resolution compatability issues

I would probly move away from using pixels and go to percetages. They seem to work best. That may solve your problem.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #4  
Old Feb 7th, 2007, 17:16
New Member
Join Date: Feb 2007
Location: Virginia
Posts: 4
Thanks: 0
Thanked 0 Times in 0 Posts
Re: resolution compatability issues

here's the link:

http://www.ocs.usmc.mil
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #5  
Old Feb 7th, 2007, 21:26
Elite Veteran
Join Date: Aug 2005
Location: That Place
Posts: 2,044
Blog Entries: 1
Thanks: 0
Thanked 37 Times in 37 Posts
Re: resolution compatability issues

That layout is just too wide man. Works fine for me but most people will be at 1024x768. if not lower.
__________________

Last Blog Entry: Apps every Mac based web dev should consider (Jul 10th, 2008)
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #6  
Old Feb 8th, 2007, 13:16
New Member
Join Date: Feb 2007
Location: Virginia
Posts: 4
Thanks: 0
Thanked 0 Times in 0 Posts
Re: resolution compatability issues

Quote:
Originally Posted by moojoo View Post
That layout is just too wide man. Works fine for me but most people will be at 1024x768. if not lower.
Then what should I do to make it viewable for all users?
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #7  
Old Feb 8th, 2007, 13:26
Elite Veteran
Join Date: Jan 2007
Location: You know where
Age: 31
Posts: 4,617
Thanks: 0
Thanked 0 Times in 0 Posts
Re: resolution compatability issues

If you are running a fixed layout, you'll want the width of your site to be a maximum of 780px to compensate for users still on 800x600 resolutions. Many will argue that 1024x768 is the new standard and I tend to agree depending on your potential clients. Mostly old people still have their res at 800 and people who are visually handicapped.

If you want a liquid design, meaning that is streches with the users res, then, use % to set the width of your page.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #8  
Old Feb 8th, 2007, 14:15
New Member
Join Date: Feb 2007
Location: Virginia
Posts: 4
Thanks: 0
Thanked 0 Times in 0 Posts
Re: resolution compatability issues

Quote:
Originally Posted by karinne View Post
If you are running a fixed layout, you'll want the width of your site to be a maximum of 780px to compensate for users still on 800x600 resolutions. Many will argue that 1024x768 is the new standard and I tend to agree depending on your potential clients. Mostly old people still have their res at 800 and people who are visually handicapped.

If you want a liquid design, meaning that is streches with the users res, then, use % to set the width of your page.
What should my % be set to?
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #9  
Old Feb 8th, 2007, 15:39
Reputable Member
Join Date: Dec 2005
Location: Texas
Age: 19
Posts: 328
Thanks: 0
Thanked 0 Times in 0 Posts
Re: resolution compatability issues

I would say 90-95% this way you have your background chowing and it gives you room to work with. Just like i said im my previous post. Pixels are almost never a good idea being that there are such wide varieties of screen resalutions. This way it looks good for everyone and not people with those abnormally high screen res. Roughly set your width to 90% that what i find best.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #10  
Old Feb 8th, 2007, 17:03
Elite Veteran
Join Date: Aug 2005
Location: That Place
Posts: 2,044
Blog Entries: 1
Thanks: 0
Thanked 37 Times in 37 Posts
Re: resolution compatability issues

Unless they are 1600x1200 + in which case you get a really wide layout. =)
__________________

Last Blog Entry: Apps every Mac based web dev should consider (Jul 10th, 2008)
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #11  
Old Feb 8th, 2007, 20:21
Junior Member
Join Date: Jan 2007
Location: Seattle, WA
Age: 27
Posts: 22
Thanks: 0
Thanked 0 Times in 0 Posts
Re: resolution compatability issues

There seems to be a compromise made when you start having to consider resolutions much larger or smaller than 1024, but as pragmatic designers we make that compromise so that we can have maximum accessibility.

A good solution to this is to put the resolution-critical layout components in one stylesheet, and have alternate stylesheets for very large or small screens (think about PDAs, too.) Isn't that why we are using/learning CSS to begin with?
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #12  
Old Feb 9th, 2007, 15:39
Elite Veteran
Join Date: Aug 2005
Location: That Place
Posts: 2,044
Blog Entries: 1
Thanks: 0
Thanked 37 Times in 37 Posts
Re: resolution compatability issues

The best yet most time consuming solution is to provide the user with a choice between fixed and liquid. And of course as stated have linked style sheets for print, mobile etc...

Media Types for CSS: per http://www.w3.org/TR/REC-CSS2/media.html

all
Suitable for all devices.

aural
Intended for speech synthesizers. See the section on aural style sheets for details.

braille
Intended for braille tactile feedback devices.

embossed Intended for paged braille printers.

handheld
Intended for handheld devices (typically small screen, monochrome, limited bandwidth).

print
Intended for paged, opaque material and for documents viewed on screen in print preview mode. Please consult the section on paged media for information about formatting issues that are specific to paged media.

projection Intended for projected presentations, for example projectors or print to transparencies. Please consult the section on paged media for information about formatting issues that are specific to paged media.

screen Intended primarily for color computer screens.

tty Intended for media using a fixed-pitch character grid, such as teletypes, terminals, or portable devices with limited display capabilities. Authors should not use pixel units with the "tty" media type.tv Intended for television-type devices (low resolution, color, limited-scrollability screens, sound available).
__________________

Last Blog Entry: Apps every Mac based web dev should consider (Jul 10th, 2008)

Last edited by moojoo; Feb 9th, 2007 at 15:42.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #13  
Old Feb 9th, 2007, 17:24
Reputable Member
Join Date: Dec 2005
Location: Texas
Age: 19
Posts: 328
Thanks: 0
Thanked 0 Times in 0 Posts
Re: resolution compatability issues

Learn what works best with most screen reses and mobile divices because alot more people are starting to surf the net using cell phones ( ex: Black Berries, Side Kicks, ect...) This way you pretty much make 2 style sheets and your set. Generally you want a fluid layout. Fixed layouts are ok but only if made to fit an 800x600 res. The only downfall to this is as some people have really high screen reses it makes it harder for the viewer to read. Thats where the fluid design comes in because it forms to the viewers screen and they dont have to use a magnifying glass to read your content. The way you make a fluid design is by using percentages and the way to accomplish the viewing of your background where your design is centered, you use a high percentage like in the 90's and it fills the almost the whole screen but leaves enough to see the styleing of your background.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
Reply

Tags
css, header, resolution issues

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

Similar Threads
Thread Thread Starter Forum Replies Last Post
Compatability Problems? Digger Web Page Design 3 Aug 23rd, 2007 20:48
Cross browser and resolution compatability? Powelly Web Page Design 2 Jun 8th, 2007 14:20
Stupid IE Compatability michaelbenson Web Page Design 3 Jun 9th, 2006 14:00
Resolution Fix Udabar JavaScript Forum 6 Apr 10th, 2006 02:23
Browser compatability autumn_whispers2me Web Page Design 2 May 23rd, 2005 21:24


All times are GMT. The time now is 04:45.


Powered by vBulletin®
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.2.0 RC8
© 2003-2008 Webforumz.com : All Rights Reserved

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42