Grow your CSS skills. Land your dream job.

Website design feedback/critique

  • # October 20, 2012 at 4:11 pm

    Hello,

    I am redesigning a charity website and would appreciate some feedback or any suggestions for improvement.

    This is the original website – [http://rasa-advocacy.org.uk/](http://rasa-advocacy.org.uk “”)

    This is the redesign – [http://rasa-wakefield.org.uk/wp/](http://rasa-wakefield.org.uk/wp/ “”)

    Thanks

    GMB
    # October 20, 2012 at 4:24 pm

    A couple of quick thoughts…

    First of all, it looks a lot nicer than the original, more immediate eye-appeal, IMO, more inviting for the visitor.

    What I like (mostly macro-level stuff):

    + — more generous overall layout
    + — Bigger, catchier header
    + — Slideshow
    + — animated drop downs

    What I’m not crazy about:

    + — the very wide text area
    + — the lines are too long IMO for the type size
    + — the excessive space at the bottom of the footer and the fact that it floats up on pages with little content (i.e. need a sticky footer)
    + — the black highlight (an oxymoron) for page name on hover
    + — the page name isn’t centered in the colored rectangle
    + — neither is the upward arrow in the back to text icon

    And a general pet peeve: the contact page. For basic messages, wouldn’t linking the “contact” menu item to a basic mailto link be better?

    Sorry for the funky formatting! I’m not having much success using markdown here…

    # October 20, 2012 at 9:16 pm

    I agree with everything with one issue: using a mailto: link is probably not a good idea for a site that may receive a fair bit of exposure…That is a spam attack waiting to happen (unless encoded in some way of course…)…

    Id recommend setting the global font size to 16px instead of 14px…and the menu font-size to 14px (you will have to make the search region a hair smaller) but, as far as accessibility you’d gain a few points in my book.

    I would also increase the line height…it is often something that is overlooked but increasing it can really improve readability.

    edit: one more thing – the scroll up arrow; i think it should be the dark blue, not a black…it doesn’t fit the UI…

    Excellent work though…the initial site was rough.

    # October 21, 2012 at 10:02 am

    @jshjohnson,

    I think the website it dramatically better, gives it a more contemporary look rather than a early 2000’s or 90’s approach.

    To embelish on what @kgscott284 said in regards or using the mailto:. If it’s really necessary to use it than you can incorporate something like this to protect against spam.

    html

    <span class="email">name[at]domain[dot]com</span>

    jQuery

    $(function() {
        $('.email').each(function() {
            var $email = $(this);
            var address = $email.text()
            .replace(/s*[at]s*/, '@')
            .replace(/s*[dot]s*/g, '.');
            $email.html(''+ address +'');
        });
    });

    or use php if so choose, just my two cents..

    # October 21, 2012 at 4:50 pm

    I’ve been using http://wordpress.org/extend/plugins/si-contact-form/ for awhile mow with no problems.

    # October 22, 2012 at 8:59 am

    You spelled Seekers as Seeksers on the top right.

    # October 22, 2012 at 9:21 am

    Thanks for the feedback guys – I appreciate it.

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".