[Webinar] Streamline your web hosting managementRegister Today

x
?
Solved

Alternating web page code for monitor display modes

Posted on 2007-12-05
4
Medium Priority
?
357 Views
Last Modified: 2012-06-27
Is there any way that a webpage can be made smaller or larger for the setting on the user's monitor. According the set display mode this page I created http://myproboxer.webs.com/ comes up badly in that you have to scroll horizontally to get the full content.
0
Comment
Question by:kgpretty
  • 2
4 Comments
 
LVL 29

Accepted Solution

by:
Göran Andersson earned 750 total points
ID: 20414653
You usually don't consider the size of the monitor, but rather the size of the browser window. My browser is always about half the width of the monitor, so if you would adjust the page according to the monitor size, I would only see half of the page.

Your problem is very common. Almost every person involved in layout for the web struggles with it, as there is no perfect solution.

A common way to handle it, is to assume that the monitor is at least 800 pixels wide, and that anyone with such low resolution has the browser maximised, so that you can safely use about 780 pixels without needing to scroll horisontally. The space to the right of that with is usually used for secondary material, like ads.

Another way to handle it is to use the full width of the browser window, and let the content adjust itself, for example using floating elements.
0
 
LVL 6

Expert Comment

by:gxp071
ID: 20415946
As mentioned above web developers as a rule make a decision very early on to go one of two ways when designing a website.

fixed/ static width, or
variable width,

Pro's & Con's

fixed width sites can be guaranteed to look similar in most browsers. but can look silly on wide screen monitors especially if the developer chooses to make the site fit on to an 800px wide monitor...  avg 7% of site users.

variable width sites are harder to design and plan as they can change size,  gfx have to be designed to repeat horizontally to allow for scaling. Can look better on different size monitors but can also make screen reading of text difficult on really wide monitors.

there is a third alternative which is a variable width site caped at a set size. However this takes intermediate css skills.

Generally designers choose to go for a 1024px wide site static site or less as 46% (avg) still have a res of that size or above. examples

www.bbc.co.uk -- less than 800 px static
facebook.com -- viewable at 800 px static
microsoft.com -- less than 1024 px static
apple.com -- less than 1024 px static



to change your site edit:

<table width="80%">      

to be a fixed size ie .. 1024px


at the moment your sit's width is variable to fit 80% of the browser but its minimum width is being dictated by the width of you content i.e. how wide the images are.

Hope that helps point you in the right direction.








0
 

Author Comment

by:kgpretty
ID: 20416748
What are the "floating elements" all about? I'm not familiar with them.
0
 
LVL 29

Expert Comment

by:Göran Andersson
ID: 20417848
0

Featured Post

The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Originally, this post was published on Monitis Blog, you can check it here . Websites are getting bigger and more complicated by the day. Video, images and custom fonts are all great for showcasing your product or service. But the price to pay in…
While opting for any web-to-print solution, you need to discuss with your team and some of your end users and know their opinions about your decisions. In this article we list down some questions you need to ask yourself.
Learn how to set-up custom confirmation messages to users who complete your Wufoo form. Include inputs from fields in your form, webpage redirects, and more with Wufoo’s confirmation options.
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.
Suggested Courses

591 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question