Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Review two pet food websites (choose your favourite)

Which is your favourite 7 members have voted

  1. 1. Which website is your favourite?

    • Website 1
      0%
      0
    • Website 2
      100%
      7

Please sign in or register to vote in this poll.

Featured Replies

Hi, i have two desigs for a pet food website. Please take a look at and let me know which design you think is better. As much detail as possible would be appreciated in terms of telling me why you perfer one website over another (your opinions are appreciated).

 

Also, please vote on the poll as well as responding to this, thanks to all who take part in advance!

 

Website 1: www.franksprogold.co.uk

 

Website 2: www.new.franksprogold.co.uk

 

Thanks again everyone!!

Hi, I'll probably leave a more detailed reply. However for now, its the second one, by as far I can throw (sorry to harsh).

 

It won't take much to have the second one looking spot on. Imo don't even consider the first one.

 

I really like what I see on the second one.

 

Stevo!

Number 2....obviously.

 

What I dont get is you say you got 2 designs, yet the first is clearly from like 2009/2011, yet the latter is 2012.

 

The second is clearly more up to date and modern.

 

One thing I did notice, why are you using drop downs when there is no need? The contact page on the second site, has "Contact Us", then a drop down that says "contact us"....kinda pointless imo. Same for the home link.

 

My 50 pence.

The second one, it has a lot more structure to it then the first one.

 

There are a few things on the second one that I would personally change thought.

 

The greens used on the menu don't work so well with green used in the header.

 

The twitter and facebook logos look like they are floating in space, so it might be better to have them more to the right.

 

The David Ashcroft link at the bottom is too hard to read on the background

 

Home and Contact us on the menu should be clickable links, I got a bit annoyed that I had to move my mouse down just to click a different button that said the same thing, plus if you click on the link in the menu the dropdown vanishes and so you have to hover over it again.

 

 

But in comparison the second one is nicer.

I would be more likely to buy from the first one. It has a genuine look to it where as the second one has a look/feel that makes me seem like it's a scam site. This might just be my own personal experience, but the first site has a better feeling to it which expresses a sort of small retail company. I think that everything is easy to find, but it could use a little more than just green to separate some things from others. I can understand why others say that the 2nd site looks better from a design stand point, but I would be more likely to buy from the first site, which is the goal here...

Instead of just picking between both websites, I've decided that both websites are going to get evaluated.

 

Website 1

Website one kind of looks like it was designed in FrontPage to run on Internet Explorer 5. The distinct two columns of links either side of the off-centred white background. The use of Comic Sans makes me very sad inside, and personally want to vomit all over my screen just so I can't see it. Websites should be neutral and balanced with colour, and this one isn't. Green leaf salad and Caesar dressing springs to mind.

 

Clicking links is rather fun though, they get bigger when you click them. Endless comical fun.

 

I guess I should suggest how it could be improved (without changing the design)... Firstly, centre it. Off-centre websites aren't visually appealing and prevent the user from viewing the whole viewport properly. Additionally, colours should be balanced across the entire website, using complementary colours to provide a balance, and to increase the aesthetic appeal. Also, the block of white containing the body doesn't look too good with the pastel green background.

 

When utilising links as well, they should be a different colour to the rest of the text. This provides the user with clear distinctions between text and links. Also, the banner image at the top doesn't provide balance between itself and the rest of the content.

 

Website 2

Website two is both aesthetically pleasing and user friendly. Personally, I think that the use of current technologies such as jQuery while keeping the traditional approaches to web design has been done well. The colour scheme is pretty well balanced, and the background provides a breakaway from the large block of white used for the body.

 

However, there are a few things that bug me as a web application programmer/designer.

  1. The menu bar for "Home" only has one option, this should be turned into a static link instead of waiting for th user to drop it first.
  2. I would sent the background for the dropdown menu to be a neutral dark gray with white text. The green background and transparencies make it hard to read.
  3. The gold text is a bit over used. Use a dark gray or similar as this is much easier to read on the white background.
  4. Increase the margins between the content and the right navigation.
  5. Disown the green text there, pick something different (green should never be seen).
  6. Perhaps put each block inside it's own container in the right hand bar. This will break up the content making it eaiser to follow.
  7. Reduce the site-wide font size a little. I know it's easier to read when large, but you don't have to scroll as much.
  8. Move the footer text into the gray bar at the bottom, make it an off white so that it blends in.
  9. The HTML Entity code for © is ©
  10. The table border spacing, set to 0. Border spacing is soooooo 1995.
  11. Frame the pictures in the product description and throw them on the right hand side.
  12. Other styling concepts could be used on the pages to break the content up even further.
  13. The social network links both point to the same website.

 

The second one (in my opinion) is far superior to the first as it boasts a well used structure, it utilises a healthy colour palette, and provides a modern touch to a classic website. The content is pretty much static, so the use of jQuery on the website has turned it from something FrontPage produces into a well designed and trustworthy website.

1. i disagree with KingTarquin about the font size ;) for me readability comes way before having to scroll alittle more :)

 

2. use a dark gold for headings as pointed out above the gold for copy doesn't work

 

3. remember favicon

 

4. the red and green from the first site say quality, the new ones look cheap/budget i do like the comic sans though for that classy feel

 

5. i was joking about the comic sans

 

6. what's the graph paper look in the header?? or is it a football net?

 

7. dont use click here as link text - it gives users no idea where they are. going click here to see why - http://uxmovement.com/content/why-your-links-should-never-say-click-here/?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed%3A+uxmovement+%28ux+movement%29

 

8. the dogs in the header look a little golden - is that intentional?

I think the second design is the better one. The reason I say that is because it's more up-to-date and more pleasing. The first website would have been good 10 years ago. Personally if I was shopping on either of these websites I would pick the second one, because it is more professional. When I shop online I look for professional designed websites because it tells me a lot about the business and how serious they are.

 

So I choose the second one.

your background image is huge at 4mb - sort the levels if you need to and save it as a jpeg ;) (e.g. http://pp.kpnet.fi/prescott/stuff/background.jpg )

also Franks should have an apostrophe in where it appears in the copy ;) oh and i tried the site with #333 text and it looked a lot better than the gold text for paragraphs ...

 

and it still needs more white space around the main content

Edited by dap

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.