SitePoint Sponsor

User Tag List

Results 1 to 22 of 22
  1. #1
    SitePoint Enthusiast
    Join Date
    Aug 2011
    Posts
    26
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Please review my small community website. Thanks!

    Hello!

    First, I'd like to thank everyone for the first round of testing. All of your suggestions really helped me improve the design! I've got a bunch more done on the website now, and I hope to go live within the next month.

    http://torontorabbits.com

    Known issues / Next steps:
    - Some of the internal links under "About Rabbits" aren't pointing anywhere yet because I have a bunch of PDFs to upload and a couple more html pages to write.
    - "Local Listings" is a Wordpress blog, on wordpress.com for now but I plan to migrate it to an installation. That's a whole other kettle of fish.

    I'd really appreciate your feedback! Thank you so much

  2. #2
    SitePoint Member
    Join Date
    Jul 2013
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    <!doctype html> on your header shows that you are using html5,

    So, what is this?:

    <div id="stickyfooter">
    </div><!--closes #stickyfooter-->

    Use html5 tags: <footer></footer>. You are writing html5 code without html5 tags..

  3. #3
    SitePoint Enthusiast
    Join Date
    Aug 2011
    Posts
    26
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you so much for your feedback! I'll look into this. I'm that doctype declaration because someone suggested it in an earlier review, but I foolishly never looked into the implications of this. Now I definitely will!! Thanks again.

  4. #4
    SitePoint Evangelist silver trophybronze trophy
    Join Date
    Jul 2013
    Posts
    406
    Mentioned
    21 Post(s)
    Tagged
    0 Thread(s)
    Hi nicol,
    Yes, you can use the html5 <footer> tag as well; but in the meantime people with non-html5 supported browsers (f.i. Internet Explorer 8 and earlier versions, at this moment about a small 10% of the surfers in Canada) don't profit of the new tags.
    To serve also the old versions, you can leave the <div> with the ID as hook for the css:
    HTML Code:
    <footer>
        <div id="stickyfooter">
        ...
        </div><!--closes #stickyfooter-->
    </footer>
    =======
    In small devices (especially mobile phones) the images get a huge enlargement, and the width of the page is far more then the screenwidth.


    Screen of 600*800px

    The smaller the device, the worse the effect!

    If you do something like this:
    Code:
    @media only screen and (max-width: 600px) {
    	html, body { 
    		min-width: 0;
    		width: 100%;
    	}
    	#bunwall ul li {
    		width: 130px;
    	}
    }
    ... then the page width will adapt to the available screen width (no need for horizontal scrolling), and the images will be shown in rows of 2 or 3:


    mobile phone of 320*480px

  5. #5
    SitePoint Zealot
    Join Date
    May 2013
    Posts
    122
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Looks good. But I think adding a brief content to tell exactly what you're site is all about can help more. I believe logos of social media services are more effective visually than the first letters of their brand names. Images convey more instant recognition to the audience than mere text.

  6. #6
    SitePoint Member
    Join Date
    Apr 2013
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes, I agree with Hamiltondist as of adding some info what your site is about.

    I'd suggest you making the pics of rabbits clickable and 'your bunny here' too. They can link to a page of that rabbit with its history and more pics for example, more funny pics. The ability to add your own bunny should also work.
    Add some google adsense context ads to earn some money and maybe some banners, cuz there are plenty of space.
    In your footer you can add some text for search engines robot crawlers telling everyone what can be found on your page or a small text with relevant keywords devoted to rabbits and what is the aim of your sommunity.
    In fact the most simple idea is to see how your competitors are working with their sites and add the best they have to your site

  7. #7
    SitePoint Member
    Join Date
    Jul 2013
    Posts
    18
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Love it, I think you should keep the emphasis on images for the main page, after you have started redirecting the listing page. Bigger images of the rabbits filling the content area would look nice. I like the header, as for the social media links. I think a light blue/white design would work better. Just my thoughts from a fellow Torontonian.
    Last edited by ralph.m; Jul 18, 2013 at 03:15.

  8. #8
    SitePoint Enthusiast
    Join Date
    Aug 2011
    Posts
    26
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you everyone! All of your advice is really helpful. I'm working on some improvements and will post a link soon!

  9. #9
    SitePoint Evangelist silver trophybronze trophy
    Join Date
    Jul 2013
    Posts
    406
    Mentioned
    21 Post(s)
    Tagged
    0 Thread(s)

    Jumping pages

    Ah, now I see "The Jumping Page" : changing from a small page like the homepage to a larger page like the About page is giving a small left jump of the page in Firefox, Chrome, Opera and Safari.
    The reason is the centered page, in combination with the fact that these browsers don't have a reserved scrollbar space on the right side in case the page is fitting the screen height. You can force the scrollbar space for short pages with:
    Code:
    html {
       height: 100%;
       padding-bottom: 1px;
       }
    The 1px will make the scrollbar, and now all pages stay horizontally centered in the same way: no more jumping.

    BTW, the change of the logo rabbit for different pages is a surprising & cool invention!

  10. #10
    SitePoint Member
    Join Date
    Feb 2008
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    One main area for me is a usability issue around the navigation. A few years back Smashing Magazine reviewed different types of navigation and one trend was to provide addition text under main navigation buttons (that acted as addition explainer text) See here: http://www.smashingmagazine.com/2010...design-trends/ (scroll down to "Custom Toronto" example)

    This is watch I immediately thought your sub navigation was, so was surprised when the two lines were bother click-able links linking to individual pages.

  11. #11
    SitePoint Enthusiast
    Join Date
    Aug 2011
    Posts
    26
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by bbacarat View Post
    One main area for me is a usability issue around the navigation. A few years back Smashing Magazine reviewed different types of navigation and one trend was to provide addition text under main navigation buttons (that acted as addition explainer text) See here: http://www.smashingmagazine.com/2010...design-trends/ (scroll down to "Custom Toronto" example)

    This is watch I immediately thought your sub navigation was, so was surprised when the two lines were bother click-able links linking to individual pages.
    Thank you for your feedback, but I'm not sure I understand. I checked out your link, and I understand the concept ... I, too, thought that's what my sub navigation was!? (We're talking about the secondary navigation bar on the About Rabbits pages, yeah? and there's a simpler one on the About Us pages, too?) So, I'm not sure what you mean by your last point, could you re-phrase? THANK YOU SO MUCH!!!!!

  12. #12
    SitePoint Enthusiast
    Join Date
    Aug 2011
    Posts
    26
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Okay folks, I've taken your advice -- SO WONDERFUL, I'M SO GRATEFUL! -- as well as some advice I got on a different message board, and I've done a redesign. http://torontorabbits.com/new/caresheets.html It's just one page. What do you think?

    Two things I have not even begun to consider yet: mobile-readiness and html5. Don't worry I'm taking your advice seriously and plan on tackling it soon.

    For the social icons I decided to download from iconarchive.com because I just don't think I have the skills to design my own. The ones I'm using in the link above are just one idea I'm playing around with. The other style I'm considering is the traditional glossy tile.

    For the image gallery on the home page, I've played around and made it look a lot better, but the problem is it's totally static. Someone recommended I do something like this: http://tympanus.net/Tutorials/Thumbn...andingPreview/. Awesome, but how? Does anyone know any scripts out like this, that I could adapt for my site?

  13. #13
    Non-Member
    Join Date
    Jun 2012
    Posts
    160
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Looking at the site, I have a few more concerns in terms of placement and design for you to maybe consider:

    1. The Local Listing and About Rabbits links next to the logo shouldn't be as large as the logo. They completely overshadow the logo which shouldn't be the case. Make your logo more bolder or make the links smaller.

    2. Perhaps consider using an opacity effect on the photos of rabbits.

  14. #14
    SitePoint Member
    Join Date
    Feb 2008
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by nicolasks View Post
    Thank you for your feedback, but I'm not sure I understand. I checked out your link, and I understand the concept ... I, too, thought that's what my sub navigation was!? (We're talking about the secondary navigation bar on the About Rabbits pages, yeah? and there's a simpler one on the About Us pages, too?) So, I'm not sure what you mean by your last point, could you re-phrase? THANK YOU SO MUCH!!!!!
    Yeah I think you understood what I was referring too.
    So the text under About Rabbits which on you design are sub navigational links. Don't look like they should be links. They look like additional descriptive text.

  15. #15
    SitePoint Enthusiast
    Join Date
    Aug 2011
    Posts
    26
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by bbacarat View Post
    the text under About Rabbits are sub navigational links. Don't look like they should be links. They look like additional descriptive text.
    Oh, I get it now -- on the link you gave me to Smashing, under Custom Toronto, I was looking at the secondary nav menu (Tote bags, Drawstring, etc), but you're talking about the words under the main nav-bar items (Start here, Learn here, etc), right? And on my web page, you're talking about the words "Caresheet & FAQ" and "Rabbit Web Library" etc? Sorry 'bout that, I was confused!!

    Okay thank you for your help! I'll take this into consideration

  16. #16
    SitePoint Enthusiast
    Join Date
    Jul 2013
    Posts
    33
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    Your website looks good. People who love rabbits will like it very much.

  17. #17
    Non-Member
    Join Date
    Jul 2013
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Nice website, but footer is not good. photo quality is normal.

  18. #18
    SitePoint Enthusiast
    Join Date
    Aug 2011
    Posts
    26
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    @Derwin Thank you for the feedback but can you explain what you mean? What is wrong with the footer? Thanks

  19. #19
    Non-Member
    Join Date
    Jul 2013
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    There is no wrong, but back ground color not matched with you website.

  20. #20
    SitePoint Member Apokalupsis's Avatar
    Join Date
    Aug 2013
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Derwin is right. It's a poor choice for footer bg color because of the lack of contrast. One of the reasons is the opacity attribute you are using:

    Code:
    opacity: 0.45;
    filter: alpha(opacity=45);
    Remove that and you get a much better color contrast.

    While better, it doesn't really match anything else on your site. I just selected the color of the Facebook icon in the upper right since you have other blues on the page: #38508D. This looks even better than the defaulted "brown" IMO.

    Another option is to change the footers bg and font colors to that of the header for a little more uniformity. There are a number of options available to you. Probably all of them are better than the current footer color scheme IMHO.

    ----

    Incidentally, there was another website that used poor color contrast, and I explained why it was poor and bad design here: http://www.sitepoint.com/forums/show...=1#post5560648

    And from the perspective of W3C, the color choices in that footer are indeed, objectively 'wrong.' It fails WCAG (Web Content Accessibility Guidelines).

  21. #21
    SitePoint Member
    Join Date
    Sep 2013
    Location
    Guelph, Ontario, Canada
    Posts
    21
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    To my opinion you can best spread the pictures out. There are to much of them on your home and to little on the rest of your pages. Also try to get your colour scheme a little more visible. The colours can work but I think you need to implement them a bit more. ie. backgrounds, header colours etc.
    I do like your website content/subject. Can't be enough info about domestic rabbits =) With a little work you can make an awesome site

  22. #22
    SitePoint Member
    Join Date
    Sep 2013
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    What I like about your site is that it's clean and simple. Looks like you've had quite a bit of feedback from others users.
    Some things I feel you could add to give it some value: Have you thought about a forum of some sort? I feel like that might benefit your site. Also it might be kind of cool if you could click those bunny pictures on the front page and have them go to more information about the rabbits. Like there name, what kind they are etc.
    Other than that like I said it's a great clean and simple site.


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
  •