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.

Homepage for critique please

Featured Replies

Hi,

 

I'm attempting to make a site for myself for a small company selling custom canvas artwork.

 

This will be my third site (all using dreamweaver) so I'm still not far along the learning curve. It's only 1 page so far

 

My last site was far too image heavy (most of the page was a sliced up psd) so I have tried to use more CSS with this one although there are probably still too many images.

 

It is very much a work in progress - looking at it now I think I probably need to work on making the top navigation a bit clearer, improving the logo, adding more content to the images on the slider and some general neatening up with regards font choices and colours.

 

I'm looking for any constructive criticism to help improve the look and usability of the site. What bits work and what bits don't?

 

myconic prints

 

 

Thanks

I like it, its easy to navigate when the links are live of coarse, color scheme is good, pictures are good quality, site in general is quick and you can without to much brain power work out what you do. Excellent.

 

Take a look at your meta tags etc though for optimisation of coarse. Otherwise work in progress well done. What I particularly like is that it does not look like a template... to many of those around.

Good job by any standard, especially for a third attempt.

 

I dont think you have anything to worry about with regards to it being image heavy - loads quickly and doesn't look too busy.

 

I tried to think of some constructive pointers but anything I say would be my own design preferences - personally prefer to build quite minimal websites which don't try to present too much info at one time but that is a design choice and this is yours. Yours works well so just follow your own design instincts and keep doing what you're doing.

I don't like the fact it's all in cold colors like gray and blue.

 

You could change the sidebar menu a bit, by using blocks and use some other colors on hover.

The URL really confused me (http://www.firefishmedia.co.uk/). I was expecting something with warm colors honestly.

 

In any case, I think the graphics are great idea, but amateurish looking. Meaning, they need to be redone to look better and possibly more realistic/higher quality. They look like they were done with someone with little photoshop experience. I don't know if that was the case or not.

 

The rotating banner seems pointless as it is void of any valid information.

 

The side menus either need to be rethought or at the very least added more padding to the left and right. They are much to close to the sides.

 

The footer is great. Love it.

 

Your homepage headers need to stand out more. The article headers stand out more which is confusing hierarchy wise.

 

For the search box, I would do away with the border around it, and play around with integrating the box into some sort of graphical background (if that makes sense... I does in my mind). Take a look at this article which I find to be helpful http://www.smashingmagazine.com/2008/12/04/designing-the-holy-search-box-examples-and-best-practices/. Maybe you can do something like this (in practice, not exactly like this: http://media.smashingmagazine.com/cdn_smash/images/search-box-design-showcase/yell.gif Just a thought.

  • Author

Thanks for all the responses, I'll get on with making some improvements tomorrow.

 

RA; I like the colour scheme but agree it could be a bit cold. I might see what it looks like with some orange touches.

 

cib; the url is just one that I have registered for uploading various bits, I'm still not 100% sure about the name myconic prints so I haven't registered a domain name.

 

I'm far from a pro on photoshop but I should be able to get them better, I was trying out a few different effects with stitching and painting on canvas so I will improve the graphics now I've decided which way to go. I plan to add more info to the rotating banners as well; do you think the first image should be the company logo etc rather than the same as the rest of the banner image types?

 

Thanks for the search box info, I'm still not sure whether it's really required as the site is only relatively small.

Since your logo is already present, I see no reason to include it in the rotating banner. Keep it to the services you offer as well as a calle to action / button to lead them further into the site.

  • Author

"as well as a calle to action / button to lead them further into the site"

 

Do you mean to include this button on the first image of the rotating banner? I'm not sure how to do this using the jquery slider but I will look into it.

 

Also what do you mean when you the homepage headers need to stand out more? The main header with the navigation and logo?

 

I've made a couple of changes to the sidebar padding and redone the top and bottom stitching. (Not a great improvement but I've got rid of any white that was there, I think I need to work on getting the drop shadow a little more realistic)

 

 

Thanks

Edited by ffmedia

Do you mean to include this button on the first image of the rotating banner? I'm not sure how to do this using the jquery slider but I will look into it.

 

I didn't see what slider you are using, but does it support HTML content instead of plain images? If it is the first, you could place the button like you would any button, and have it rotate this way. I don't use a button on mine (because my button is above the rotating banner), but the content is still HTML. So you can see what HTML content in a rotating banner looks like (mine actually fades, but you get the idea).

 

Also what do you mean when you the homepage headers need to stand out more? The main header with the navigation and logo?

 

Sorry I didn't make myself clear. I have a habit of doing that. I was referring to your main content headers. For example. One of them starts with "check out some of our work on the gallery page". The headers get lost and have no visual relevance. Also on a side note, I personally try to stay away from referring to pages as pages as you do here. i would have had the text say "check out some of our work in the gallery". Visitors typically know they are going to be linked away to a "page". Thats just my personal preference though, so thats just a suggestion.

 

I've made a couple of changes to the sidebar padding and redone the top and bottom stitching. (Not a great improvement but I've got rid of any white that was there, I think I need to work on getting the drop shadow a little more realistic)

 

The sidebar is vastly improved. Good job. The white text is hard to read though.

 

Do you have a account at http://www.photoshopuser.com, they have a great video tutorial on stitching that might help you.

Edited by cibgraphics

I agree with an earlier post - the colours aren't right. I would expect an off-white/pale cream colour for the canvas. It's a nice idea - just needs refining.

 

If you're going to be using work examples etc, and adding colour through your work, I'd keep the rest of the site fairly neutral adding subtle colour. Have you tried wood somewhere? Seeing as canvas' are made from wood and canvas? Just a thought....it might not work, but worth trying?

  • Author

Thanks cib.

 

I've added some stitching to the top navigation as well now. I'm using the jquery coin slider, as far as I know it only allows basic html images to be used but I may be wrong. If it does I might look for a different way to rotate the images that allows html.

 

I'll get on with improving the clarity of the headers and tweaking the sidebar tomorrow.

 

Thanks for the help

If you are looking for another slider, I suggest Easy Slider 1.8. It appears as though only 1.7 is available currently. The link for 1.8 in the comments is currently broken for me. But luckily I backup everything. 1.8 is worth it because he adds easing (need to get the jquery easing plugin to use)

 

http://www.cibgraphics.com/downloads/easyslider18.zip

 

There is documentation in the js file. He uses images in his example, but you can use any html you want. Plus you can use your own next and prev buttons which make it more flexible than the one you are currently using.

 

Additional documentation for 1.7 at http://cssglobe.com/post/5780/easy-slider-17-numeric-navigation-jquery-slider

I always seem to come across as a jerk when giving critique on a website design because i'm really picky.

I like the way you're going with this but it still seems a bit bland. I.E. blue and light grey? really?

and the images are really simple, there is no shading or anything to give it that little edge.

Have a look at this site, it's simple, easy to use and attractive.

 

I came across this website before: http://www.fontsquirrel.com/

 

This website is really attractive, make notes on why it is, and incorporate these within your designs.

 

Also, have a look at my website: www.snippetcloud.com

  • Author

Thanks.

 

Improving the image slider content and finding a better (warmer) colour scheme are next up on the to do list when I get some time.

  • Author

I've now gone for a more natural canvas colour and made the images bigger (Thanks mrsminkie). I've spent a bit of time looking for a suitable image scroller and have gone for the content flow jquery script.

 

I haven't done much work on the header/nav menu yet and I don't think the colours are quite sharp enough so I need to address that.

 

I need to decide what to do with the sides regarding border/edge effects, any suggestions welcome.

 

Restyle with new colour scheme

 

Any thoughts? Better/Worse then the first attempt?

Edited by ffmedia

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.