Comments on Layout

Discussion in 'Web Design & Coding' started by k3o, Apr 17, 2006.

  1. k3o

    k3o My name is James VIP Member

    Joined:
    Feb 4, 2004
    Messages:
    413
    Likes Received:
    1
    Location:
    England
    What do you think on this layout? Any comments or critiscism?
    Thanks.

    Do you have any comments on the left panel where it says Welcome? Do you think the grey fits in?

    [​IMG]
     
    k3o, Apr 17, 2006
    #1
    1. Advertisements

  2. k3o

    James Photojournalist

    Joined:
    Dec 24, 2002
    Messages:
    6,662
    Likes Received:
    35
    I don't like the large naviagation buttons, I would try to re-size them a bit. The rest of the lay is alright although I would try to dress it up a bit by changing the fonts.
     
    James, Apr 17, 2006
    #2
    1. Advertisements

  3. k3o

    k3o My name is James VIP Member

    Joined:
    Feb 4, 2004
    Messages:
    413
    Likes Received:
    1
    Location:
    England
    Ok - what fonts would you suggest? I like Tahoma but I don't think it suits the layout.

    I quite like the navigation buttons, but what is it you don't like about them? I will do my best to improve :)
     
    k3o, Apr 17, 2006
    #3
  4. k3o

    James Photojournalist

    Joined:
    Dec 24, 2002
    Messages:
    6,662
    Likes Received:
    35
    They seem a bit too large, maybe a tad smaller would help. I personally like Trebuchet MS for titles, headers, etc.
     
    James, Apr 17, 2006
    #4
  5. k3o

    S Walch MAME 0.64 :) VIP Member

    Joined:
    Jun 2, 2003
    Messages:
    1,026
    Likes Received:
    14
    Location:
    Manchester
    Gonna have to agree with james - the navigation buttons are way too large.

    Decrease by about 30% and it'd be perfect.
     
    S Walch, Apr 17, 2006
    #5
  6. k3o

    k3o My name is James VIP Member

    Joined:
    Feb 4, 2004
    Messages:
    413
    Likes Received:
    1
    Location:
    England
    I have decreased the navigation button size, but if you look in the screenshot, the actual link is out of proportion. I have changed a couple of fonts but I'm not sure if I like them.

    [​IMG]

    If you need the code I'll PM it to you.
     
    k3o, Apr 17, 2006
    #6
  7. k3o

    James Photojournalist

    Joined:
    Dec 24, 2002
    Messages:
    6,662
    Likes Received:
    35
    It looks like you have some sort of padding, decrease it and you should be all set.
     
    James, Apr 17, 2006
    #7
    k3o likes this.
  8. k3o

    k3o My name is James VIP Member

    Joined:
    Feb 4, 2004
    Messages:
    413
    Likes Received:
    1
    Location:
    England
    I have tried that - I use padding to get it to the appropriate height but if I reduce the padding the top part of the link stays in the same place and the bottom part moves up. I'll PM you the code so you can see how I've coded it.
     
    Last edited: Apr 17, 2006
    k3o, Apr 17, 2006
    #8
  9. k3o

    S Walch MAME 0.64 :) VIP Member

    Joined:
    Jun 2, 2003
    Messages:
    1,026
    Likes Received:
    14
    Location:
    Manchester
    The decreased size is excellent.

    I believe you use the same thing I use on my site for the background colour to the links. This is the code I use for them:

    Code:
    #navigation { 
    background-color: #484848; 
    padding: 0; 
    height: 46px; 
    width: 650px; 
    }  
     
    #cell { 
    float: right; 
    margin: 0; 
    padding: 14px 0; 
    }
     
    a.navi:link { 
    color: white;  
    padding: 14px 2px; 
    text-decoration: none; 
    margin: 0; 
    }  
     
    a.navi:hover { 
    padding: 14px 2px; 
    margin: 0; 
    background-color: #000000; 
    }  
     
    a.navi:visited { 
    padding: 14px 2px; 
    color: white;  
    text-decoration: none; 
    margin: 0; 
    }  
     
    a.navi:active { 
    padding: 14px 2px; 
    color: white;  
    text-decoration: none; 
    margin: 0; 
    }  
    That's the CSS, and in the HTML I have it as thus:

    HTML:
    <div id="navigation">
     <div id="cell">
      <a class="navi" href="website.htm">Home</a>
      <a class="navi" href="model_1.htm">Model 1</a>
      <a class="navi" href="model_2.htm">Model 2</a>
      <a class="navi" href="switch.htm">50/60 Hz switch</a>
      <a class="navi" href="mod_chip.htm">Mod Chip Instilation</a>
     </div>
    </div>
    
     
    S Walch, Apr 18, 2006
    #9
    1. Advertisements

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments (here). After that, you can post your question and our members will help you out.