Resolution problem with Website

Hi,
 I am a totaly beginner at web designing and I have run into a problem with resolution of the website.  My computer is set at 1440 x900 pixels when i viewed the website the size seems perfect for me... however, when people with lower screen resolution like 1240 x 768 pixels view the website EVERYTHING becomes REALLY REALLY big.....

i was wandering if there is anyway i can fix this problem so that no matter what resolution ppl view it in the size will be right??? here's my website below


http://groups.northwestern.edu/tasc

thank you
revolution69Asked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

 
webwomanCommented:
No. There's not. This is not a print piece, you do not control other's monitor size, or resolution.

Set your monitor to 1024x768 so you see what most of the world does, and realize that some people will have larger monitors and higher res, and some will have smaller and lower res. Get used to it.
0

Experts Exchange Solution brought to you by ConnectWise

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
 
grogmanCommented:
You will find that a large number of websites out there optimize their pages for viewing on either '800x600' or '1024x768' resolution screens. You can force your page to a certain size (for example by encasing the page within a DIV tag and setting its width property to a value such as '768px'), so that the page always appears the same size. People with higher-resolution monitors will simply have some extra blank space at the side. If this is not what you are looking for, please let me know.
0
 
iscodeCommented:
you can detect resolution and point people to different page
like this

<%@ Language=VBScript %>
    <SCRIPT Language=VBScript>
          Sub window_onload
          if screen.height = 480 Then
                window.navigate ("http://dinside.dk/640480/default.asp")      
          End if
                if screen.height = 600 Then
                      window.navigate ("http://dinside.dk/800600/default.asp")
                End if
                      if screen.height = 768 Then
                            window.navigate ("http://dinside.dk/1024768/default.asp")
                      End if
          End Sub      
    </SCRIPT>

hope this helps
iscode
0
Cloud Class® Course: Microsoft Exchange Server

The MCTS: Microsoft Exchange Server 2010 certification validates your skills in supporting the maintenance and administration of the Exchange servers in an enterprise environment. Learn everything you need to know with this course.

 
webwomanCommented:
And do three times the work? Maybe you like doing that, I don't.
0
 
iscodeCommented:
>>And do three times the work? Maybe you like doing that, I don't.

what work are you talking about webwoman ? :)

its just "save page as" with new name and change table width's

ofcourse there are many other ways to solve it like with css templates and etc.

I mention this as option, to show there are solutions to revolution69  problem
0
 
iscodeCommented:
0
 
iscodeCommented:
another way :) using css

<SCRIPT language="JavaScript">
<!--
if ((screen.width>=1024) && (screen.height>=768))
{
//alert ("1024 X 768");
document.write ("<link REL=STYLESHEET TYPE='text/css' HREF='includes/main1024.css'>");
}
else if ((screen.width>=800) && (screen.height>=600))
{
//alert ("800 X 600");
document.write ("<link REL=STYLESHEET TYPE='text/css' HREF='includes/main800.css'>");
}
else if((screen.width>=640) && (screen.height>=480))
{
//alert ("640 X 480");
document.write ("<link REL=STYLESHEET TYPE='text/css' HREF='includes/main640.css'>");
}

//-->
</SCRIPT>
0
 
webwomanCommented:
You REALLY want to write 3 stylesheets, do 3 sets of graphics, etc. -- why? So it can break 3 different ways?

Screen width/height isn't BROWSER WINDOW, which, of course, can change on the fly.

Design it to be FLEXIBLE, and you don't need three, or six, or 500 variations. Realize that it's not going to be exactly the same for everybody, and design something that looks good at ALL resolutions. Are the graphics going to look EXACTLY the same? No, and they don't have to. You think that Amazon does 3 stylesheets? CNN? BBC? eBay? Think they create various sets of graphics to try and make everybody see EXACTLY the same thing?

YOU decide what resolution you want your screen at. If you like everything small, you set a really high res. Don't like things that small, don't set that high a res. It's up to YOU. It's not up to ME.
0
 
Havin_itCommented:
Seconded.  This discussion hasn't yet even touched upon the joys of 640X480 or even (gasp) 320x240 displays on phones and other such devices. Okay, the smaller ones are pretty rare but they are still out there...

If your focus is on scaling layout elements to be consistent with text size, consider using 'ems' instead of pixels or percentages for the sizes.  This renders the sizes proportional to the element's font-size (typically, you would put a font-size attribute on the <body> so all your elements inherit the same size unless they define their own).  You can in theory use this same practice with image dimensions, but do plenty of browser-testing before you go live - sometimes the 'live' resizing done in browsers is pretty shocking.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.