Anyone want to critique my website?

Discussion in 'HTML' started by BTM, Jun 3, 2007.

  1. BTM

    BTM Guest

    This is a website me and two other people designed for a class
    project. It's going to be a website for a local divison of Habitat
    For Humanity, a charity that helps build houses for lower income
    families. Anyway, I'm in the process of working with HFH to put the
    website up on an actual server, and figured I'd do some retooling and
    updating before it goes up.

    Basically, the site's purpose is to tell people about HFH, how they
    can donate or volunteer, or apply for HFH's services. It's meant to
    be for anyone, from the computer savy to someone who doesn't use the
    internet very often.

    If you're curious, I'm the one who came up with teh basic "design" of
    the site. Often when I'm thinking about what type of website to
    create, I get a mental image or theme to put in, and this one the idea
    of wood stuck to me, as Habitat's main mission is buidling houses...
    so I figured the whole wood/construction motif would be a good look.

    You can check out the link here..

    http://mypage.siu.edu/mallan/habitat/

    Appreciate any suggestions you might have...

    Somethings I'm already thinking of changing...

    1. Ditching the frames.

    I dunno, thinking maybe the frames just aren't needed.

    2. Shrink the menu bar

    Thinking the menu bar on the left takes up too much room, thinking of
    going for a smaller font and reducing the length of the boxes.
    BTM, Jun 3, 2007
    #1
    1. Advertising

  2. BTM

    M Guest

    "BTM" <> wrote in message
    news:...
    >
    > If you're curious, I'm the one who came up with teh basic "design" of
    > the site.


    > Often when I'm thinking about what type of website to
    > create, I get a mental image or theme to put in, and this one the idea
    > of wood stuck to me, as Habitat's main mission is buidling houses...
    > so I figured the whole wood/construction motif would be a good look.


    Good in concept but overworked on the site IMO. Use SOME texture but maybe
    some complementary colours instead of more wood.

    Or, consider, contrasting colours -- dark greens perhaps.

    I like the menu mouseovers (but see comments below).

    >
    > You can check out the link here..
    >
    > http://mypage.siu.edu/mallan/habitat/
    >
    > Appreciate any suggestions you might have...
    >
    > Somethings I'm already thinking of changing...
    >
    > 1. Ditching the frames.


    Good idea. At smaller window sizes in Firefox, your menu disappears past the
    bottom but has no scrollbars.

    "Frames" can be done with CSS. Or put the menu in an iframe.

    > Thinking the menu bar on the left takes up too much room, thinking of
    > going for a smaller font and reducing the length of the boxes.


    Your menu is image files. Using text instead allows users to specify their
    own fonts, sizes instead.
    Consider using css to provide visual cues of live menu items rather than
    javascript.
    Lots of people turn javascript off so they would have no visual indicator
    that the menu is live.

    Otherwise, it looks fine. If you have an artistic side, Google for free
    website templates and use one you like as a jumping off point.

    M
    M, Jun 4, 2007
    #2
    1. Advertising

  3. On Jun 3, 5:10 pm, BTM <> wrote:
    > This is a website me and two other people designed for a class
    > project...


    Ditch the frames, they are not needed here. I would also lose the
    background images, it is something I would expect from a class
    assignment, but probably not found on a good commercial site.

    The menu sucks. I would just have it across the top as links since
    there are no sub menus. Get a better quality image for the logo, it
    is really bad. And the image for HabitatForHumanity is amateurish, I
    would lose that too. Replace it with a better image of the logo, or
    just use a normal font. I know what you were trying for, but it
    didn't work.

    Your contact us uses a mailto: These don't always work. Change it.

    In the about us page, change the titles of your table columns to
    something better. "Names" should be Name, or in this case maybe
    change it to "Member Name" "Jobs" should be something like "Current
    Position" or "Community Position"

    This page is pretty far from being a professional page, but then it is
    not supposed to be. School is for learning, and that's what you
    should be doing. All and all, good job.
    Travis Newbury, Jun 4, 2007
    #3
  4. BTM

    Bergamot Guest

    M wrote:
    >
    > "Frames" can be done with CSS. Or put the menu in an iframe.


    Why do you think an iframe is any better than regular frames? It isn't.

    BTW, CSS "frames" have their own problems, perhaps worse than HTML
    frames. Avoid using them.

    --
    Berg
    Bergamot, Jun 4, 2007
    #4
  5. BTM

    BTM Guest


    >"Frames" can be done with CSS. Or put the menu in an iframe.
    >
    >> Thinking the menu bar on the left takes up too much room, thinking of
    >> going for a smaller font and reducing the length of the boxes.

    >
    >Your menu is image files. Using text instead allows users to specify their
    >own fonts, sizes instead.
    >Consider using css to provide visual cues of live menu items rather than
    >javascript.


    Er,,, not exactly sure I know how to do that... I THINK I understadn
    what you're saying... don't do a lot direct editing of the CSS (only
    had a beginner's class in Web Design...)

    >Lots of people turn javascript off so they would have no visual indicator
    >that the menu is live.


    >Otherwise, it looks fine. If you have an artistic side, Google for free
    >website templates and use one you like as a jumping off point.


    Cool!

    Thanks.
    BTM, Jun 4, 2007
    #5
  6. BTM

    BTM Guest

    On Mon, 04 Jun 2007 03:42:56 -0700, Travis Newbury
    <> wrote:

    >On Jun 3, 5:10 pm, BTM <> wrote:
    >> This is a website me and two other people designed for a class
    >> project...

    >
    >Ditch the frames, they are not needed here. I would also lose the
    >background images, it is something I would expect from a class
    >assignment, but probably not found on a good commercial site.


    Technically, it's not a commercial site, but yeah, I see what you're
    saying...

    >The menu sucks. I would just have it across the top as links since
    >there are no sub menus. Get a better quality image for the logo, it
    >is really bad.


    > And the image for HabitatForHumanity is amateurish, I
    >would lose that too. Replace it with a better image of the logo, or
    >just use a normal font. I know what you were trying for, but it
    >didn't work.


    I'm assuming by this you mean the one in the center of the top
    banner... That was kind of a "standby", so yeah, I can see that...

    >Your contact us uses a mailto: These don't always work. Change it.


    To what do you think?

    >In the about us page, change the titles of your table columns to
    >something better. "Names" should be Name, or in this case maybe
    >change it to "Member Name" "Jobs" should be something like "Current
    >Position" or "Community Position"
    >
    >This page is pretty far from being a professional page, but then it is
    >not supposed to be. School is for learning, and that's what you
    >should be doing. All and all, good job.


    Especially considering how little they taught me on web design in the
    four years I've been in college... depressing huh? I am about to
    graduate and I was wanting to get a job doing this...

    But, hey, that's off subject... :)
    BTM, Jun 4, 2007
    #6
  7. BTM

    M Guest

    "BTM" <> wrote in message
    news:...
    >
    >>"Frames" can be done with CSS. Or put the menu in an iframe.
    >>
    >>> Thinking the menu bar on the left takes up too much room, thinking of
    >>> going for a smaller font and reducing the length of the boxes.

    >>
    >>Your menu is image files. Using text instead allows users to specify their
    >>own fonts, sizes instead.
    >>Consider using css to provide visual cues of live menu items rather than
    >>javascript.

    >
    > Er,,, not exactly sure I know how to do that... I THINK I understadn
    > what you're saying... don't do a lot direct editing of the CSS (only
    > had a beginner's class in Web Design...)


    Nothing much to it really.

    Go to this page, download it and then study the source.

    http://www.xs4all.nl/~peterned/examples/cssmenu.html

    You'll see the css styles embedded in the head of the file. Look for the
    section titled a: hover. Start playing around with the 'attributes'

    border-color:gray;
    background-color:#bbb7c7;
    color:black;

    Change them, save the file, observe what happens, etc. You'll get the idea
    soon enough.

    Can't go into everything about CSS but for simple stuff, it doesn't take
    much to master. Start Googling for css tutorials if you want to get into the
    real guts of it.


    M
    M, Jun 4, 2007
    #7
  8. BTM

    andrew Guest

    On 2007-06-04, BTM <> wrote:
    > On Mon, 04 Jun 2007 03:42:56 -0700, Travis Newbury
    ><> wrote:
    >
    >>On Jun 3, 5:10 pm, BTM <> wrote:
    >>> This is a website me and two other people designed for a class
    >>> project...


    [...]

    >>Your contact us uses a mailto: These don't always work. Change it.

    >
    > To what do you think?


    You will find that a mailto link is a magnet for spam. There is an
    excellent article on this at:

    http://nikitathespider.com/articles/IngenReklamTack.html

    The lazy man's approach, which I use myself, is at:

    http://www.addressmunger.com/

    This approach is poor HTML practice but an excellent survival
    tactic in the battle to keep spam away from your inbox.

    Andrew.


    --
    Andrew's Corner
    http://people.aapt.net.au/~adjlstrong/dapper.html
    andrew, Jun 4, 2007
    #8
  9. BTM wrote:
    >> "Frames" can be done with CSS. Or put the menu in an iframe.
    >>
    >>> Thinking the menu bar on the left takes up too much room, thinking of
    >>> going for a smaller font and reducing the length of the boxes.

    >> Your menu is image files. Using text instead allows users to specify their
    >> own fonts, sizes instead.
    >> Consider using css to provide visual cues of live menu items rather than
    >> javascript.

    >
    > Er,,, not exactly sure I know how to do that... I THINK I understadn
    > what you're saying... don't do a lot direct editing of the CSS (only
    > had a beginner's class in Web Design...)


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
    <meta http-equiv="content-language" content="en-us">
    <title>No JavaScript</title>

    <style type="text/css">
    html, body {
    margin: 0; padding: 0; font: 100%/1.4 arial, helvetica, sans-serif;
    }

    ul#navbar {
    margin: 0; padding: 0; list-style: none;
    /* set width relative to font */
    width: 10em; float: left;
    }

    ul#navbar li {
    margin: 0; padding: 0;
    }

    ul#navbar li A {
    /* make into block element to fill space and center text */
    display: block; padding: .5em 0; text-align: center;
    /* base color */
    color: #eb5; background-color: #863;
    /* set size relative to base font */
    font-size: 1.2em; font-weight: bold; text-decoration: none;
    }

    ul#navbar li A:hover,
    ul#navbar li A:active,
    ul#navbar li A:focus {

    /* set the hover effect, you could use a background image
    to more closely mimic your original page */
    color: #fff; background-color: #530;
    }

    </style>
    </head>
    <body>
    <!--
    MSIE has a whitespace bug that added extra spacing, to fix
    remove whitespace between closing LI and next opening LI tag
    -->
    <ul id="navbar">
    <li><a href="#">About Us</a></li><li>
    <a href="#">What's New</a></li><li>
    <a href="#">Prospective Owners</a></li><li>
    <a href="#">Volunteers</a></li><li>
    <a href="#">Donors</a></li><li>
    <a href="#">Links</a></li><li>
    <a href="#">Contact Us</a></li>
    </ul>

    <p>The rest of your page...</p>


    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
    Jonathan N. Little, Jun 4, 2007
    #9
    1. Advertising

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

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Weyoun the gowd damn Dominion Vorta who certainly

    Astronomy Website Critique

    Weyoun the gowd damn Dominion Vorta who certainly, Apr 3, 2004, in forum: HTML
    Replies:
    20
    Views:
    1,135
    Weyoun the gowd damn Dominion Vorta who certainly
    Apr 5, 2004
  2. Familyman
    Replies:
    24
    Views:
    938
    dorayme
    Feb 12, 2006
  3. Richard Thoms
    Replies:
    59
    Views:
    1,375
    Neredbojias
    May 15, 2006
  4. Richard Thoms
    Replies:
    0
    Views:
    411
    Richard Thoms
    Jun 3, 2006
  5. John Salerno

    Anyone want to critique this program?

    John Salerno, Jul 3, 2011, in forum: Python
    Replies:
    8
    Views:
    327
    Chris Angelico
    Jul 5, 2011
Loading...

Share This Page