Site Review: E-Commerce Site

[irbk]

Hi all,
I would greatly appreciate your constructive criticism on

http://www.darkalchemist.com

I myself am not a web designer, just a lowly programmer. So I'm having issue making the site look "good" rather then just "eh". I was hoping that you might be able to help me out in that area. I'd really enjoy suggestions on the navigation. I need a different menu system, as what I have starts to wrap if your res is less then 1024 x 768. Plus, I still have more categories to add to my top level menu. I just can't think of something that might look better for the menu's.

Thanks in advance!

 

[ChrisHunt]

Hmmm... First Impressions

It looks really disjointed. You've got the old library picture and the parchment at the top, but the bottom's all clean-cut modern sans serif font. I'd definitely experiment with serif fonts, and using less primary colours to give the rest of the page a more weathered look.

The text on the home page is really hard to read, and it doesn't really make it clear what the site is about. What is this, some kind of role-playing game?

I know that RPG-style stuff is going to appeal to your target market, but they still need to know that this site is primarily about selling gothic-style objects, rather than something else.

How about styling a <div> to look like a bit of parchment (e.g. see how I do the newspaper cutting at

http://www.mcgonagall-online.org.uk/poems/pgdisaster.htm

) and use it for notes from the "Dark Alchemist" on various pages. They can be full of fantasy-speak, and will give your site lots of character. However, you do it in addition to regular plain English describing the workings of the site.

You need an "about" page to say who, and where you are. You need a contact page, including a bricks-and-mortar address. You need some information up-front about shipping costs, international sales, etc. People aren't going to trust you with their money if you don't.

What's a "Catalouge"? The word you're looking for is Catalogue (or maybe Catalog if you speak american instead of english)

-- Chris Hunt
Webmaster & Tragedian
Extra Connections Ltd

 

[irbk]

Thanks for the ideas. I'm going to lose the letter on the home page in favor of having "sale" items there. I'm still thinking about how to handle the navigation. I feel that I've got too many catagories to just list them in a left hand menu. I think that would cause the menu to get too long.
I'll play with the color scheme a bit too and see if I can't get a bit more flow between colors. Perhaps loose the yellow in favor of a white.

Thanks for the ideas so far and please keep them coming!

 

[audiopro]

Just a few thoughts...........
The top graphic is excellent and the page looks better without the glaring yellow, although I would consider a text colour offering better contrast with the black background.

I would go with the left hand menu and include a graphic with appropriate text with each menu item, just eye candy but you have some really good images there and it would make the whole page look like it belongs together.

May I also suggest you present a selected item as a page in an old book, with Roman Numeral page numbers, to keep the theme going.





Keith

http://www.studiosoft.co.uk

 

[irbk]

Like the idea's audiopro. Question for you though, when your saying "go with the left hand menu" are you saying for all the menu items or just the "sub menus"?

Thanks and keep them coming!

 

[audiopro]

I would keep the left hand menu identical on each page with the relevant page highlighted, as you have now.
As for sub menus, I always like the idea of enticing customers in so instead of having a sub menu, display the first few items of each category with a 'show more' link within each section. Your sub menu effectively fills the whole page.
Your images are very striking, use them to attract interest rather than just illustration.


Keith

http://www.studiosoft.co.uk

 

[irbk]

Made more changes. Droped the top nav bar in favor of left hand nav buttons (though, I'm having a problem with the CSS not making the div be 100% of the page length high).

More comments please!

Thanks!

 

[audiopro]

The divs on your page are all in line so will wrap around to the start of the next line each time the full width is exceeded. Start with a container div which effectively is the whole page. Create 2 divs within this container, one for the nav and one for the content.
All of the content code needs to be placed in the second, inner div.
I would use tables for that kind of layout but to mention such old fashioned yet reliable methods in this forum is virtual suicide so I never mentioned it.

The text of the individual items is very difficult to read.


Keith

http://www.studiosoft.co.uk

 

[irbk]

Problem is that I'm not sure I want to limit myself to a peticular size. I know I can fix it by having something like

<div container>
  <div left style=width 200px>
   left stuff here
  </div end left div>
  <div content style= width 600px>
    content stuff here
  </div content>
</div container>

But that limits me to a page size of 800px wide. I was really trying hard to make the page sort of flot to fit what ever resolution the system viewing it is set for. I'm not sure what I want to do now. I've actually been told that some people like the page wraping under the left nav bar. Personally I don't. What do you folks think?

 

[irbk]

AudioPro-
Please expand on "text is difficult to read" Do you find the font difficult to read? Is it the size? Is it the color? I have no issues with it myself so I'm not quite sure what to do to resolve the issue.

 

[audiopro]

Dark red text on a black background doesn't offer enough contrast to be easily seen, at least not in small font sizes.

Re - Column sizes
Your menu items will be the same width no matter what resolution is set to so the width of the menu div will be fixed but the main body will expand to full width.
Are you serving the pages from a database?


Keith

http://www.studiosoft.co.uk

 

[audiopro]

How big are the items you are offering for sale?
I would include appropriate dimensions of each item to avoid confusion.

Keith

http://www.studiosoft.co.uk

 

[ChrisHunt]

If you want to stop the content wrapping under the menu, do something like this:

<div id="menu">...blah...</div>
<div id="content">...yadda...</div>

Give div#menu a fixed width in ems (so it grows if the text is re-sized) and float it left.

Don't give div#content a width, but give it a margin-left a little bit wider than div#menu's width. div#menu will then float into that margin.

Alternatively, if you wanted to put the menu after the content in the markup (some say this is better for SEO), you could absolutely position the menu into that margin instead of floating it.

-- Chris Hunt
Webmaster & Tragedian
Extra Connections Ltd

 

[irbk]

Good idea Chris! Hadn't thought of the margin-left! That would fix the issue.

Keith -
Do you suggest a lighter red, or a different color completely? That peticular red was chosen to match the red in the A of alchemist. Something about making the site flow your supposed to use consistant colors. I'm not opposed to using a lighter red or going White (white because I use that in the about page).

 

[irbk]

Oh, sorry, Keith, I'm serving pages from a DB.

 

[audiopro]

The actual colour isn't the issue really, it's the lack of contrast between the text and the background which makes it hard to read. Lightening the background of the individual item areas would increase the contrast. A variation of your attractive header section, bordered in red would possibly do the job. Serving from a DB rather than creating static pages makes experimenting with backgrounds a breeze. I would try some variations and see what you come up with although I still like the idea of presenting each item as a page in a book.

Keith

http://www.studiosoft.co.uk

 

[irbk]

Breadcrumb Question-
I've gotten comments that peeps are getting "lost" in the site so I'm setting up breadcrumbs at the top of the page.
Here is the question. Assuming your on page 3 of the "Rings" section of "Jewelery" what do you feel is "better" for a breadcrumb
A.
Jewelry > Rings
or
B.
Jewelry > Rings > Page 3
I'm leaving the page navigation at the bottom so either way some one could see that they are on page 3, but then it's in 2 different spots. Option A is a bit easier to code but Option B isn't that much more difficult to do either.
Comments?

Thanks.

 

[audiopro]

How about numbering each item?

1 of 10
2 of 10
3 of 10
4 of 10
5 of 10
6 of 10
More .......

Keith

http://www.studiosoft.co.uk

 

[irbk]

I think I'm just going to stick with
Jewelry > Rings
with leaving the page numbers at the bottom, so if you were on the 3rd page of rings it would be something like

Jewelry > Rings
Items here
Previous 1 2 3 4 5 6 Next