SitePoint Sponsor

User Tag List

Results 1 to 10 of 10
  1. #1
    SitePoint Addict
    Join Date
    Jan 2005
    Location
    Hiding from the world
    Posts
    333
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    sustainable fish website

    Hi,
    so doing a re-design on our sustainable fish website. currently looks like this www.fishonline.org (and merging in www.goodfishguide.co.uk).
    They were 2 separate websites the first being aimed at industry and the second at consumers. But it isn't working well so they are being joined again.

    this is the working draft http://beta.fishonline.org

    If you could give feedback on the overall design that would be great. There are a few bits still not working or quite finished but at the moment i am after feedback on the more general feel.

    What do you think the site is for? is it obvious what to do and what information you can get?

    If you wanted to know if your albacore tuna (for example) is sustainable, how easy is it to find out?

    any thoughts appreciated

    thanks

    p.s valid HTML5
    Last edited by TechnoBear; Jan 2, 2014 at 08:33. Reason: "Old" URLs delinked to avoid confusion.
    If i am a product of your imagination you should try harder!

  2. #2
    SitePoint Member
    Join Date
    Dec 2013
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Dropdown menu goes under images, and font need change.

  3. #3
    SitePoint Zealot Lieto's Avatar
    Join Date
    Sep 2012
    Location
    Ukraine. Kiev.
    Posts
    106
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    Looks cluttered and lacking "yummy" look and feel.

  4. #4
    SitePoint Zealot WebEminence's Avatar
    Join Date
    Jan 2012
    Location
    Chicago, IL
    Posts
    129
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Agree that it looks pretty cluttered. Not sure where to look. One piece of advice would be to eliminate one of the menus at the top. They both look like main navigation which makes it cluttered and confusing.

  5. #5
    SitePoint Addict
    Join Date
    Jan 2005
    Location
    Hiding from the world
    Posts
    333
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,
    thanks, no exactly what i wanted to hear but useful none the less

    So i've amended some bits and pieces and i think it looks more logical where to go now, hopefully. (n.b the fish to eat and avoid links just take you to the results page at the moment)

    So the site is a sub site of www.mcsuk.org and in an effort to make it easy to move between the various sites i have implimented the top menu with the dropdowns. Whilst in the fishonline website though it needs a menu to move around hence the tabs.
    So i can't really remove them easily.

    'drop down goes under the images' ... i can't seem to replicate that problem could you let me know what OS/browser you are using.

    If you have time to have a look and see if it looks better that would be appreciated.
    If i am a product of your imagination you should try harder!

  6. #6
    SitePoint Evangelist silver trophybronze trophy
    Join Date
    Jul 2013
    Posts
    406
    Mentioned
    22 Post(s)
    Tagged
    0 Thread(s)
    'drop down goes under the images'.
    I can't see this either, but in Internet Explorer 7 the drop downs don't have the blue background: the drop down background is transparent.
    While the text-color is white, and the background in the Fish tabs content is also white, there is not much to see.


    In this testpage one of the dropdowns (the "Get Involved") is opened by default.
    • I tested in a real IE7, but if you paste the link in netrenderer.com, you can see it yourself.
    • IE8 and above do it good, according to Netrenderer.

    Note: the main site mcsuk.org has the same problem in IE7!

    =======
    It has to do with the rgba-notation of the background. If you add this...:
    Code CSS:
    ul#menu li.mega div.drop {
        ...
        background: #003055;
        background: rgba(0, 48, 85, 0.9);
        }
     
    .highlight {
        ...
        background: #668DB2;
        background: rgba(223, 227, 231, 0.7);
        }
    ... the problem is solved.


    Now IE7 has a fall-back for the not supported semi-transparency of the rgba-notation.
    I saw somewhere in the stylesheets that there are given also a fall-back colors. I don't know why it's not working - maybe it's a matter of specificity, but I suspect something in the dropdown javascript *) which is prohibiting the good behavior.

    _____________
    *) With a beautiful css dropdown menu you don't need this kind of javascript (with jQuery as condition): a css menu is running without any javascript (and without a delay in the page load because of the scripts).

  7. #7
    SitePoint Evangelist silver trophybronze trophy
    Join Date
    Jul 2013
    Posts
    406
    Mentioned
    22 Post(s)
    Tagged
    0 Thread(s)
    At the moment the main slider and meaningful text are only visible after scrolling a whole page down (at 1280*1024px; worse at smaller screens).



    at the moment

    For the design I should suggest to omit the large "inside header" block right under the tabs. The page header "Fishonline, Your guide to sustainable seafood" can be transported to the main header of the page, as a kind of second logo.

    I think also the "Fish finder" Search box can be missed: in the tabs above it is clear that there is a FF'er on a separate page.
    The 2 download links ("Mobile App" / "Pocket Good Fish Guide") will not be the first thing the visitor is looking for: they can be moved downwards to under the slider.
    A short description instead should not be bad (2 2.5 lines), such as:
    "Welcome on this sub-site of MCS. Here we brought together all kinds of information about sustainable seafoods. Do you want to know something about a certain fish you want to eat? Then go to the 'Fish Finder' (link)! Besides general information you also can find over here the 'Fish Recipe of the Month'. And much more!"
    In this way you still have 100px less height under the tabs, and the slider will be more prominent.


    This will clarify for the visitor that (s)he is on a rather separate sub-site of the MCS-site, and in the meantime under the tabs you can come straight to the point.

  8. #8
    SitePoint Member
    Join Date
    Jan 2014
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm not sure if any of the comments about the site looking cluttered were already addressed, but I find them still relevant. On mobile the site is pretty much unusable (check out Google's PageSpeed).

    I guess it's cool that it's HTML5-valid (I haven't checked myself, taking your word for it), but you are using tables for design, you are not taking advantage of any new HTML5 tags (for example nav for navigation) and the site is not at all responsive.

    I don't personally like the style much (the colors, the buttons etc), but that's just a preference, obviously. So if nothing else, I would just make the page less cluttered, focus on delivering the most important messages, make the site more responsive and above all - have only one navigation menu.

    PS: I only tried the site on a Linux netbook with the latest Chrome (and did a bit of testing with PageSpeed as noted above and Pingdom).

  9. #9
    SitePoint Member
    Join Date
    Mar 2013
    Posts
    21
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Review both as a developer and person interested in sustainable fish.

    As a developer.
    Specifically on the "Fish To Eat" page. I would make the page full width. Move the sidebar (refine your search) to be above the list of species. Once you scroll down to just a few species there is a blank white void that is prime real estate. You could make the "refine your search" an accordian or some other hidden/open feature if your're concerned about page fold.

    On the home page the slideshow was just below the fold. I'm on a 15" Macbook Pro. I would move the search box into the header and not have the breadcrumb on the home page. If there is any way to get rid of the alert at top I would. This will buy you a little more real estate which show a bit of the slider above the fold and draws my interest to it.

    As a fish lover.
    In general I found it cluttered an not sure what to do. It looks like a wealth of information and that can be a drawback if you're trying to get it all on the homepage. I recently watched a MOZ video about how homepages are now more about branding than they are showing everything you can do.

    FWIW, I typed in steelhead and got no results.

    I hope this is helpful.

    Good luck.

  10. #10
    SitePoint Wizard maartenvr's Avatar
    Join Date
    Jun 2002
    Location
    Canada
    Posts
    1,679
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It is a little confusing at the top. It almost seems like there are 2 headers from different websites combined together. And this is losing you a lot of valuable space above the fold.
    I do like the overall layout. Very informative as well.
    The slider on the home page is very slow.

    also when clicking on the green menu items, it keeps having that fish finder there. I am viewing on a laptop, and basically every screen above the fold is the same. Makes someone think it is an unfinished website!
    Maarten


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
  •