SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Enthusiast
    Join Date
    May 2001
    Posts
    26
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    friendly layout?

    Thankyou everybody for your knowledge on setting up my website. I am however having problems with the table layout, I have set tables before, but I have only ever designed for a 800*600 format, not 1024 * 768, now I am finally making the move and designing for both.

    In this case I have started with tables and used the percentage feature to auto size my tables, however I am using dreamweaver 4. I set the layout table and use the 100% on that, then I put my layout cells to divide my page (navigation, etc), THIS is where my problem lays, when you resize the browser window the page looks fairly messy.

    Can anybody advise on the best ways to layout these tables and cells to make sure they work the best, good advice or a really good tutorial is what I need, any suggestions?

    You can check out the mess so far at:

    http://www.digiboxnetwork.com

    By the way the site you are looking at is just beta, no links work yet or anything.

    Thanks for any help
    Michael Prosser

  2. #2
    Prolific Blogger silver trophy Technosailor's Avatar
    Join Date
    Jun 2001
    Location
    Before These Crowded Streets
    Posts
    9,446
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'd still design for 800x600. Restrict the table width to 770 pixels wide. You can center the table if you wish, but I'd keep the table with all the content at 770 px. That way you are safe.

    Sketch
    Aaron Brazell
    Technosailor



  3. #3
    SitePoint Zealot
    Join Date
    Jun 2001
    Location
    Southampton, UK
    Posts
    121
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    770px is too wide - check this out: http://hotwired.lycos.com/webmonkey/...html?tw=design

  4. #4
    Prolific Blogger silver trophy Technosailor's Avatar
    Join Date
    Jun 2001
    Location
    Before These Crowded Streets
    Posts
    9,446
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    what do you mean it's still too wide?

    Sketch
    Aaron Brazell
    Technosailor



  5. #5
    SitePoint Evangelist pip's Avatar
    Join Date
    Jun 2001
    Location
    Cape Town, South Africa
    Posts
    548
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I realise that this is the wrong way of approaching a situation like this, but if you're interested you should give it a bash.

    What I normally do is set my table witdh to 100% then the side that I want to keep a specific pixel size I specify in pixels and make sure that there is an image place holder in the cell of the same size. Then place a 100% width in the cell that should stretch accross the whole page. There's a slight bug doing it this way in Netscape, however if you have content within the cell to be stretched, it works fine.

    Just to make sure I've mentioned it, this is not how it should be done, but I normally get it to work on all browsers

    <TABLE BORDER="0" WIDTH="100%">
    <TR><TD WIDTH="100">
    <IMG SRC="pixel.gif" WIDTH="100" HEIGHT="1"><BR>
    </TD><TD WIDTH="100%">
    <BR>
    </TD></TR>
    </TABLE>
    - Pip
    ---------------------------------------------------------------------------------
    Nothing takes the taste out of peanut butter quite like unrequited love.

  6. #6
    Prolific Blogger silver trophy Technosailor's Avatar
    Join Date
    Jun 2001
    Location
    Before These Crowded Streets
    Posts
    9,446
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks for the tip. I am reworking allnations-durham.org to be DW4 designed/cleaned/etc and not so FP2k intensive. Once that is done, I will be redoing livingpages.net with the same concept of cleaning, reworking and editing glitches. These tips are great.

    Sketch
    Aaron Brazell
    Technosailor



  7. #7
    SitePoint Zealot techie2003's Avatar
    Join Date
    May 2001
    Location
    Boston, Massachusetts
    Posts
    103
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I just design for about 770 and just let a background tile in one direction, either left or right. And it looks fine in most browsers/platforms.

    Thought this prolly isn't a great example, here's one that I did a while ago in a big rush.

    Dang, now I gotta stop doing 770 and start going smaller, prolly 725 just to be safe...
    My computer: Dell Latitude CPx | P3 650/500 w/ 256 MB RAM | 15" 1024x768 | IE 5.5 DSL
    gO rEd SoX! | "The greatest thing you'll ever learn is just to love and be loved in return" - Christian, Moulin Rouge
    l e a r n t o q u e s t i o n | c l i o 3 6 0

  8. #8
    1-800-JMULDER JMulder's Avatar
    Join Date
    May 2001
    Location
    The Netherlands
    Posts
    1,745
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hmmm, I am using 750px wide =\
    Jeroen Mulder

    w: www.jeroenmulder.com

  9. #9
    SitePoint Enthusiast
    Join Date
    Jul 2001
    Location
    Wolverhampton, UK
    Posts
    81
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hmmmmm, the problem i find is that when tryin' to desgin a site with percentages then u have to be very conscious about the images you are gonna ne usin' because they can often be too small and so leave big gapgs, or too big and pull your sites design all over the place leaving you with an almightly mess

    With %ages tho you just have to accept that you can't design a site for every resolution unless you go out of your way to make different images and check it at each res to see specific probs, but if you gonna do this then might as well do 7 different versions of the site, which would be laborious unless you are very database reliant in which case onece you have got the templates for each site sorted then the content is just read in to that page and only have to change the data in the database...

    some food for thought,
    beachball


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •