Turn on thread page Beta
    • Thread Starter
    Offline

    0
    ReputationRep:
    Hi,

    I am in charge of running a website and was hoping for some advice...
    I am creating on a laptop with a widescreen and it appears fine. However, apparently when its viewed on a 'normal' screen you have to scroll across to see the whole page because its too wide.

    Is there anyway of making it generic so it will automacially fit to the size of the screen it is viewed on?

    Please help and I hope this post makes sense!!

    Thanks
    Offline

    14
    ReputationRep:
    (Original post by Kate987123)
    Hi,

    I am in charge of running a website and was hoping for some advice...
    I am creating on a laptop with a widescreen and it appears fine. However, apparently when its viewed on a 'normal' screen you have to scroll across to see the whole page because its too wide.

    Is there anyway of making it generic so it will automacially fit to the size of the screen it is viewed on?

    Please help and I hope this post makes sense!!

    Thanks
    http://www.pegaweb.com/articles/screen-resolution.htm
    • Thread Starter
    Offline

    0
    ReputationRep:
    Thank you soo much!
    Offline

    0
    ReputationRep:
    An alternate method would be to use CSS and divs and use the min and max width properties. The above method above will just make your content stuck at a width of 779 px therefore if you use a high resolution like 1280x1024 (like many TFT users have) you would have a blank bar to the right (or both sides if you centre the table).

    Using variable width properties in css will allow your site to adapt to any screen resolution without leaving blank space (within reason - tiny resolutions probably won't work if you've got big images).

    I haven't got a good link to hand but if I find one, I’ll let you know.

    HTH
    • TSR Group Staff
    Offline

    20
    ReputationRep:
    TSR Group Staff
    Do NOT use fixed widths. It is seriously bad practice in web design. A much more sensible solution is to use percentages. Having a page like this:

    Code:
    ...
    <body>
    <div style="width:90%">
    Main content here
    </div>
    </body>
    ...
    Will allow your page to stretch and contract (to an extent) according to the size of the browser window (which one should not assume to be maximised). For images, either set them to a "fail safe" width that will appear on most resolutions (web statistic programs will give you an idea of the average res of your visitors), or use thumbnails.

    Setting width to 100% is perfectly acceptable, and will obviously remove page margins on each side.
    • Thread Starter
    Offline

    0
    ReputationRep:
    Thanks for the advice but I am slightly confused lol

    I am using Dreamweaver so is there an easy way to do this?

    Thanks again
    Offline

    2
    ReputationRep:
    tell us the website so we can see your detailed codes. then we can tell you exactly where to fix.
    • Thread Starter
    Offline

    0
    ReputationRep:
    Ok, its www.ruls.co.uk

    I'm using a widescreen laptop and I can see the whole banner without scrolling across which I don't think you can on 800 x 600.

    In order for it to appear well in both types of screen would I have to do something similar to www.ucla.edu ? (ie have main body in middle and block of colour around)

    Thanks again
    Offline

    13
    ReputationRep:
    I think its the 194% in the table width that's causing it to stretch. All you have to do is decrease that and center the table. Also, the banner is too long to be viewed fully at 800x600. You need to make a smaller one. I can just a bout see all of it at 1280x1024.
    • TSR Group Staff
    Offline

    20
    ReputationRep:
    TSR Group Staff
    Sorry, I don't deal with generated websites.
    Offline

    10
    ReputationRep:
    Do NOT use fixed widths. It is seriously bad practice in web design. A much more sensible solution is to use percentages.
    About 99% of professional sites do though.
    Offline

    3
    ReputationRep:
    (Original post by Dez)
    Do NOT use fixed widths. It is seriously bad practice in web design. A much more sensible solution is to use percentages.
    That's not correct in all cases. Many sites require fixed width.
    • TSR Group Staff
    Offline

    20
    ReputationRep:
    TSR Group Staff
    99% of professional sites do because 99% of them were either made before CSS was even invented, or by people who don't know their W3C from their WC3.

    Do you have an example, samba?
    Offline

    0
    ReputationRep:
    Kate987123, I'm looking into your code regarding sorting the page width issues. In the meantime, just a few other suggestions:
    • Change the title element to something more descriptive, for example: "Reading University Law Society - Calendar". This will help users with multiple windows/tabs open to know which window/tab is showing what. It will also help with your search engine listing.
    • Don't scale up your images using the height and width attributes as it leads to jagged disproportionate text like in the Herbert Smith image. If you have a vector version of the image, scale it up then export it with the new size. If not, for consistency, proportionately scale down the images to the size of the smallest image.
    • Wide character spacing is good for titles but for main content I'd suggest decreasing the character spacing a bit which will make it easier to read.


    HTH
    Offline

    10
    ReputationRep:
    Some fixed width sites...

    BBC - http://bbc.co.uk
    Digg - http://digg.com
    YouTube - http://youtube.com
    Download - http://download.com
    Flickr - http://flickr.com

    etc
    • TSR Group Staff
    Offline

    20
    ReputationRep:
    TSR Group Staff
    Those sites do not require fixed widths. In fact, it'd be an great improvement if they did not use fixed widths. I didn't buy a 17" monitor to have half of it taken up by grey and white.

    For a good example of a variable-width site, you're on one. TSR uses vBulletin, which does make use of variable width measurements to great effect.
    • Thread Starter
    Offline

    0
    ReputationRep:
    Hey,

    Thanks for all the advice

    I'm happy for the website to use fixed width so I'm gonna try and sort it out today...but will probably be back within 10 mins with more questions!!

    Thanks again
    Offline

    0
    ReputationRep:
    There isn't really anything wrong with fixed width imo..

    Shouldn't have a ridulously expansive resolution anyway, puts strain on yer eyes..
    • TSR Group Staff
    Offline

    20
    ReputationRep:
    TSR Group Staff
    I'll use whatever resolution I bloody well want, thank you very much. It isn't a user's job to conform to a website, it should be vice-versa.
    Offline

    0
    ReputationRep:
    (Original post by Dez)
    I'll use whatever resolution I bloody well want, thank you very much. It isn't a user's job to conform to a website, it should be vice-versa.
    Yes, but do you think every single website actually cares about annoying the 8% or whatever it is of users who adopt a different resolution to the standard 1024x768. The answers no. Fixed resolution websites often work very well, and if you're that bothered about having to put up with them you should change your resolution.
 
 
 
Poll
Were you ever put in isolation at school?

The Student Room, Get Revising and Marked by Teachers are trading names of The Student Room Group Ltd.

Register Number: 04666380 (England and Wales), VAT No. 806 8067 22 Registered Office: International House, Queens Road, Brighton, BN1 3XE

Write a reply...
Reply
Hide
Reputation gems: You get these gems as you gain rep from other members for making good contributions and giving helpful advice.