Need a new web host or having a problem with a script? Tips and advice on the best way to design, build and maintain your most valuable asset - your website!

Spice up my site

swarlley
Posts: 169
Joined: 16 Dec 09
Trust:

Spice up my site

I've been building a site using the weaver 2 pro theme. I love the theme and this happens to be one of the least ugly sites that I've ever made. However it still looks kind of bland me on the product pages

Would anyone care to chime in and offer some advice on how to spice of these product pages? Also if you have any thoughts on how to make the homepage more appealing I would like to hear those as well.

The website is http://www.epicjunkbox.com

Thanks for advice you can offer,
Chris
  • 0
Site Admin
aletta
Posts: 3719
Joined: 09 Jul 06
Trust:
Hey Chris,

I think any very specific advice I give you is going to be kind of piecemeal, but for starters...

PRODUCT PAGE:
1) I don't really like the justified text. It's very blocky. There are no subheadlines or anything to break up the text, so it's pretty intimidating.

2) The content is inside a box, and the headline of the item is outside the box. This means I do not see the headline, and I don't know what it is. I just see a big block of justified text. If you can, the headline and the text really need to be closer together and not separated by a box outline.

3) The drop shadow on your product image is very early 2000s. You could try making it a lot lighter, or removing altogether and going with a light grey border... or nothing at all.

HOMEPAGE
1) All your images are different sizes. This makes the page awkward. I understand it's hard when you're grabbing images from around the internet, but try to make them all the same size ... it would help with the layout.

2) I don't like the headlines under the images so much for some reason... they're reasonably large, so they wrap onto two lines pretty easily/awkwardly. There's also a large gap between headline and description text which makes them seem disconnected. See if you can tweak the font size of the headline and reduce this gap.

3) You might find the layout easier to work with if you got rid of the right sidebar. You already have navigation at the top of the page, so the stuff on the right is a bit redundant. That's debatable though.

=========

I tell you what: If I were you, here's what I'd do. Bigger picture advice.

I would outsource this as a design job. I'd pay probably up to a hundred bucks (but hopefully less) to get someone to work with the general layout, but give it a design facelift: Homepage and product page. I might even get a couple of different people to do options for me if I had the money to throw around.

If they gave me something I liked, but I wasn't able to do the theme tweaking/css myself, I'd then I'd take it to a WordPress designer and ask them to tweak the existing theme to be a close approximation of that design. Probably won't be exact, but true enough to the "vision".

Before doing this I'd sit down and really make sure I'd figured out what my own "vision" for this site is. What sort of sites do I want it to be like? What designs to I appreciate? What style of writing do I think works well?

Basically, who are my heroes from a design / content / tone / functionality perspective? I'd make myself a little digital scrapbook of all the bits and pieces I like.

All this will be handy for a designer coming up with a sweet layout for you.

This would be, in my opinion, the most straightforward way to getting a rocking design for your site. The bones are already there, you just need that little bit of "spice". Sometimes it's a lot easier to get someone else to come up with that -- even when you're skilled on the graphics front. Sometimes you're just a bit close and you need a fresh perspective.

Otherwise what I'd do is keep looking around at sites you like the look of, and you want to emulate. See what they're doing. See if you can do something similar on your site. I'd be looking at online store layouts like http://www.shopify.com/examples

For other inspiration you can look on design sites like http://cssline.com/, http://dribbble.com/, and any number of WordPress theme sites.
  • 1
Are your changes not showing up on your website? Try doing a hard refresh! http://www.refreshyourcache.com/en/cache/
 
swarlley
Posts: 169
Joined: 16 Dec 09
Trust:
Thank you very much Aletta. These are the kind of things I needed to hear.

I didn't realize how out of date the drop shadow was. Something about the page just felt strange and I couldn't put my finger on it. Maybe it was this.

Good point on the image sizes. I need to figure something out with this.

For some reason, I like the sidebar for the Facebook like box. I also plan on adding an opt in form above the FB box soon. Do you think there is a better way to do this?

I like your idea about hiring a designer too. Should I go through oDesk/Elance type sites or is there a better option that you know of?

I really appreciate all the ideas that you gave me to work with.
  • 0
Site Admin
aletta
Posts: 3719
Joined: 09 Jul 06
Trust:
I would probably go the oDesk/Elance route. You could look at Fiverr I suppose.

Another thing I didn't mention before: If you look at a site like http://photojojo.com/store/ -- the pictures look like they're all part of the same "family" (I guess) because they're standardised: Same size, white/grey background. They look cohesive. I think that's an issue with your site, but I don't honestly know how you'd fix it without buying the products and doing your own photoshoot, or some potentially clumsy photoshopping.

I think the sidebar is so weird for me because of your black background, which means you get that epic black empty space down the right of the page as you move further down.

http://www.smashingmagazine.com/ also has an epic sidebar, but it's less weird looking because it's light grey instead of black.

Looks like you've changed your title font since I last looked. There's actually a lot of fonts available to web designers these days (more than the old arial vs verdana vs times new roman) and they're really easy to add to your site.

http://www.google.com/fonts has an array, and they're free. You just get a snippet of code to put in the head of your page, and then you can call them in your CSS like any other font.

I think that's one of the other things that's niggling me about your site: The Arial. I've been spoiled by so many other web fonts that seeing Arial just takes me back five years. If you sort the Google fonts by popularity, it gives you some good options to try for starters.

You just have to be careful with webfonts that you don't go overboard, because they can slow down the loading of your site. Google tells you when you get a bit carried away.

I actually just showed your site to someone who is likely your demographic, because he was asking why I was working while I was meant to be on holiday. His comments:

Inside page = "It just looks like an a**load of text I don't wanna read."
Homepage = "He's not making very good use of the page. It's like it's got a whole lot of advertising space that hasn't been filled."
About me working = "Why are you woooorking. You're not even being paid!"
  • 1
Are your changes not showing up on your website? Try doing a hard refresh! http://www.refreshyourcache.com/en/cache/
 
swarlley
Posts: 169
Joined: 16 Dec 09
Trust:
Aletta,

Hope you had a good holiday and maybe even stopped working for a few hours.

I've changed the fonts around and ditched the Arial. I've been using a program called AdCrafter for the post pages and this is the reason they look so terrible. I think I'll just have to change all the old posts so they can be prettier and less like an assload of text hehehe.

I'm working at it though.
  • 0

This topic was started on Dec 20, 2013 and has been closed due to inactivity. If you want to discuss this topic further, please create a new forum topic.