Review Request: The Organic Super Site

Ack! Um, this really needs work. Badly. I'm sorry, I don't mean to be so harsh but there's really nothing else to say.

First of all, define a better colour scheme. That aqua background is just ugly and that pinky colour doesn't help much. Think of something with more of a natural and organic feel.

The text on this page seems to be kind of smooshed together - put some spacing in there! Use the tag, that's what its for, and header tags as well. Also avoid using "Click here" - people don't usually read pages like this, they skim for important information. For this reason it's a better idea to link important words that will have meaning to the user. I also think that the text could stand to be a little smaller.

Now, graphics. That logo thing isn't too bad, but the problem is that its style and colouring don't carry through to the rest of the design. Another problem is that the edges are really scratchy looking (anti-alias!). You should also try to make your navbar more interesting. Either make some nice looking graphics or use CSS styling to make them look nicer (ie. not default blue). Also try to organize all those links a little better. A list this long should probably be done as a left side menu, not a horizontal one.

Eew! I picked this "organic tradeline" page, what a mess! Try to streamline your design styling - minimize the number of font colours and styles being used. Avoid centering large amounts of text.

Alright, that's enough for now. I would suggest that you take a look around at other sites - either through the critiques forums here or something like coolhomepages.com.

Sorry to say this but the site looks old. You need to think about the layout as at the moment it looks like it's been thrown together at a bit with some things in tables/boxes and others not. Also the colours just don't go together IMO. Here are my suggestions:

- Redo the logo - make all the text fit on the picture, so either make the picture wider or the text smaller.
- Rethink the colours
- Get rid of the neon flashing 'New' images
- Make sure all your table borders are turned off and if you use tables for background colours ensure the tables are the same height if they are next to each other
- The links that are italic, don't have italic as it's hard to read and changing to normal on mouseover is awful as it makes the other text below it move
- Don't have 'Best viewed.......' have the links to the browser updrades by all means but saying your site is best viewed with them isn't going to make people download them!
- I'd get rid of the 'Quick Quiz' as then your three columns will all finish at more or less the same level which will make the page look better

You have a good base with which to start and with some tweeking and polishing it should look good. I didn't look beyond the first page as I think this is enough to be going along with!

Starting with you colors. I think a white background would work better for this site. The light blue clashes with almost everything. The light red background that you have for the cells that the links at the top are in looks funky too.

Loose the animated "New" thingys. Some of your links are italic and change to non-italic on mouseover. I'd get rid of the italic.

You need an introductory paragraph or two on the home page telling exactly what the site is about, what you have to offer and what your visitor will gain by hanging around the site. I know you have all of this on your about page but you should have something brief on the home page.

Also, I think you should mention the word food more as well as your other keywords that you have in your meta tags. I had to look at the faqs and you keywords to see what the organic thing was you are referring to was. It is food! LOL Am I right? So if you want to assume that some of your visitors may be as dumb as I am, they are thinking as they look at the home page, "Organic what?"

You definately need to be more descriptive with your text content. You seem to have a lot of good content. It jsut needs to be more orgainzed in my opinion.

a few other things to remove: at the bottom it has best viewed with ... anyone using older than Explorer 5 or Netscape 4 wouldnt beable to view your page anyway, its pretty safe to say ver4 is as old as they get these days. best viewed at 800x600 - why? you should be easily able to make your table at 100% meaning it will expand and contract to any size screen, there no reason to not use 100% instead of fixed size.

at the top right you have "Do you like our site ? Click here !" what if i dont like your site, arent I allowd to click there? going by the status bar link its a feedback form, so reword that question to something like "give some feedback here" or something, with feedback or here being the linked word. also having it at the top is useless, they wouldnt of seen your site yet.

the italic on mouseover is very old (same as bold or unbold), it makes the page jump around to much (your version only works in IE anyway). In Opera only half of your mouseovers (a:hover) removes the underline so check your CSS coding.

As mentioned, pick your colors wisely, pick some earth tones and arrange your content in a antural way or you'll be on your way to a winner. Your sites topic is a major one and world wide so you'll need to make it serious if you want anyone to take you seriously.

I would agree with most that has already been said. The thing that was done well was that you branded your site pretty well by having 'Organic' this and 'Organic' that. I have a degree in 'Organic' Chemistry so I guess that I could be put on your site.

The main thing to do is to figure out a color style that is pleasing to the eyes and matches better. Get rid of moving things since they are an irritation. Work on the logo. I would suggest a more subtle approach to a logo. Maybe have people and plants fading into a background with your text over it. Look at some other sites and see what they are doing to get some ideas.

Wow so much wrong with it ! But hey, I appreciate every word. It's good to have some idea of what to fix, and I certainly have a lot of idea what to fix now.

I can't respond to every comment but here's a few.

I like the colour (which is why I used it obviously) but I can see it gets the big thumbs down. I agree that white is better for background and I'll get to work on colour schemes. Here's a dilemma .... the colours I would associate with organic food are earthy colours - green and brown. But I have read that they are the two worst colours for selling. Yellow and red I heard are the best, but not very organic (well maybe yellow is). Any suggestions ?

About the formatting on the Organic Tradeline page, I agree that it's all over the place. But it is a page from a partner's site that I need to use so I didn't want to change it too much. But NOw that I think about it, I will.

The logo is my own variation on the original designer's thing, and I admit I'm crap at graphics. Time to call in my friend the design wiz.

Netscape and IE refernce. Consider it gone.

Re: the quick quiz - haven't figured out a way to make it fit neatly in the page, so I guess I should move it until I do.

Points taken about the text and flashy signs.

I have a question .....

Although I do use some javasript I have avoided using javascript drop down menus etc because older browsers can't read them. Is this not really an issue any more ? And what about Flash etc ? I have avoided using it for the same reason. Bear in mind that in my industry there are a higher than average number of viewers using old machines.

Thanks again for all your very useful feedback.

Blue

I would say that if you are aiming the site at industry bods then keep it plain and simple as flash & javascript can just slow things down and you don't really need this site to be flashy.

Thanks that's what I thought too.

Drop down menus aren't recommended for accessability reasons.

Yikes, those colors!

My eyes bleed when I see all that aqua on there!
Less is more, ya know? I don't know where you heard red & yellow sell things... they sell hamburgers because these colors make you hungry (McDonalds, BK, Carls Jr, Wendys, In-N-Out). This is no joke there's a reason they all have this color... but in websites and graphics, red means "bad" or "caution". Avoid red at all costs - it is not a good idea.

Green & brown can work well if they are done right. My suggestion is to try and incorporate a theme with the colors green, brown and white... and nothing else. Don't make exceptions, except for the occasional color photo. Trust me, it will make a world of difference.

Fonts are important too. With all that information on there, you need to bump it down to 10 point (not 12). Plus if you try Tahoma, it will take less space.

But above all else, lose the aqua at all costs. Bright colors do not bode well on a computer screen.

I don't think that red is all that bad (obviously!) It can have other connotations. Personally, I feel that red is a very warm, friendly colour It really depends on how you use it. Colours can have many meanings. I'll try to look around for some articles on the meaning of colour.

Interesting point about red & yellow - I'd never heard that before but it does explain why a lot of e-commerce sites are done in red & yellow. I was aware of the bit about red/yellow/orange (particularly orange) supposedly making people hungry. Blue does the opposite - that's why you'll sometimes come across dieting tips recommending that you eat off of a blue plate (and why you won't see a lot of restaurants using blue...). By all means I do not think that these are the only feelings these colours can convey.

The most important thing I find when choosing a colour scheme is to choose something appropriate; something that represents what your site is about. In this case I would say that a green/brown scheme would be most appropriate. However, green and brown can be difficult to work with, so be careful when selecting the shades you plan to use. I would reccomend that you put everything on a white base and only use colour for logo & navigation elements etc.

Here's a couple:

Basic chart: http://webdesign.about.com/library/weekly/aa070400b.htm
More extensive listings: [url]http://www.carhops.com/lover's_leap/meaning/red.htm[/url] {can't figure out what this site is actually supposed to be about!)
Some articles from Pantone: http://www.pantone.com/products/products.asp?idArea=16

I think, however, that most of these colour meaning ideas should be used as more of a guideline than a law. Everything depends on the circumstances

Sitenote: I did a search for "meaning of colour" and had a hard time figuring out why I wasn't getting too many results

Thanks all for the great response. It was so great that now I have no choice but to make my site better

I like the idea of green/brown/white. I'll try it anyway. Thanks Megan for the links.

Another thing to keep in mind with colours is that they will not appear the same on every computer. People set their monitor brightness etc differently and I believe there is even a difference b/w mac and pc.

Regarding the text size, I'm pretty sure I haven't set any particular size for it, so it should be displaying at the default size of the viewer's browser. And when you say change it to 10pt instead of 12 pt, my software measures it in the html code of 1 to 7 if that makes sense. What number equals 10 pt or 12 pt ?

Blue

Learn how to use Cascading Style Sheets - there's a good thread in the Graphics & Design forum about switching from HTML to CSS. CSS will help you consistently style your fonts across the site, and other things as well. It will also make it easier to make styling changes in the future - update one file and everything chagnes. If you want to get the most consistent font sizing across browsers and platforms define your fonts in pixels, not points. You'll have to fiddle around with the settings to see what looks best - it can vary depending on the font (ie. arial is bigger than verdana & helvetica)

I already use CSS so it will be easy to change (and that's why I'm not too stressed about making the recommended changes). I just hadn't paid any attention really to text size. I'll sus it out and experiment. Is there one font you would recommend ? And what screen resolution is the norm these days ? Probably 800x600 and 1024x768 I guess.

Blue

I would say use Veranda. That is what most people use and recommend around here. And 800 X 600 but make it look good should someone look at ya at a larger res.

cool thanks

Thanks to everyone for the scathing but necessary criticism back in early March. I have made some improvements with more to come. I haven't worked on the logo yet but the general format and appearance is coming together.

To remind you of how it used to look go to organicsupersite.com/index_old.html

and the current version is at organicsupersite.com

Let me know what you think.

Thanks,

Blue

looks a lot better, not to keen on the yellow heading boxs, maybe choose another color from your banner/logo (when done). I think you should loose the scrolling news though, people (or maybe just me) find them really annoying, and never give them the time of day.

your site menu doesnt work in NS4.7, just lists all the options without the drop box.
the click here to email ... doesnt display, make sure you have closed your form tag, also the please bookmark this page is black text on dark grey line, very hard to read.

keep up the good work

The drop down menu doesn't work because you haven't got the form tags around it. IE will still make it work but NS doesn't like it! I also think that it should be in a coloured box like the two to the left of it but change the colour from the pale yellow.

I think it looks pretty good. But IMO, I think you should have some text links at the top, below your top bar as well as the drop down menu.

Just under your menu there is a link called "Frequently Asked Questions about organics". The font looks a tad smaller to me but I might me seeing things. I noticed that you have a font tag for this link and not the others.

Not sure if I like the yellow background that you have for the headers, TOOLS FOR BUSINESS and TOOLS FOR BUSINESS
AND CONSUMERS.

You have done well organizing all of that info. Nice job!

I don't have time to go back and revisit everything said earlier so forgive me if I repeat.

Overall, the site says to me: "I have no graphics software". As a result, the page headings don't grab me, the navigation is obscure, and the graphics look "clipartish" and borrowed.

The 10px font is a little hard on the eyes given the volume of content - perhaps try 12px?

Navigation: Gets kind of lost there at the bottom. Perhaps another alternative at the top of pages? Your targets in the navigation are inconsistent, sometimes the main frame, sometimes _top, and in at least one case (site map), it appears that the page loaded in the tiny navigation frame itself.

Colours: too many colours/shades going on. The result is a lack of theme for the site.

Sorry if this all seems harsh again but I think it still needs a pile of work.

Thanks for the updated advice. I have begun to make some of the recommended adjustments.

I didn't know about the drop menu/form thing ..... hopefully fixed now. Let me know if it works.

Point taken about the yellow boxes. It was a temporary fix but I'll have to get to work on the graphics. It's my weak point but I'll work on it.

I like news boxes. What is the vote, are scrolling news boxes bad or good ??

Blue

the heading boxs look a lot better blue than the yellow.
the drop down menu now works in NS4.7
but the click to email friend isnt showing up, you have no tag and the please bookmark is to hard to read, make it white or yellow text.

Ok more adjustments made now. What would I do without all of ya. I think it looks way better now.

Re: the comment about the graphics looking clipartish - it's because they are. Any suggestions for good clipart or other graphics sites. My graphics is not my strongest point !!

Re: font size - 10 px is what I was advised by the good folk here at TWF but Taff suggests 12 point. Any opinions ? What does everyone else use ?

Blue

I normally use 12 as 10 really is very small when having to read through lots of text.

Looking better. Your logo is showing a thin white line above and below though.

I still think the green headings seem out of place.

Font size: for the record, I recommended 12px not 12pt. I use both 12px and 10px in a site. 12px I use for the main body text - large paragraphs,etc. 10px I use for page footers, footnotes, the occasional sub-nav, etc.

Graphics: Well, without a decent graphics app and some graphic design ability, you are pretty limited. There are tons of clipart sites out there but they all look... well, like clipart.

Megan gave me a great tip once. If you do have a graphics app, go searching for dingbat fonts. There are a ton of free ones out there hopefully with appropriate images that you can then manipulate to suit your needs.

Good luck!

here is the site - http://www.dingbatpages.com

I've fixed the font size and the white line in the logo. I agree about the green headings I just haven't got around to it yet. Interesting idea the dingbats thing. I always wondered what the heck is the deal with dingbats - a font but not really a font. Anyway I'll give it a try. I have a graphics app but I'm quite average with it. I'll have to get better.

Thanks again.

I am glad taff caught the white lines in your logo thingy. I was going to mention that earlier today and got side tracked. You said that you fixed it but I am still seeing a very faint line on the top and the one on the bottom. If you need a screen shot, I will be glad to post one for you. Or heck, if you are fixing to make a new logo(top banner), I wouldn't worry about it.

Can't wait to see what you come up with. You can do all sorts of creative things with dingbats. Stretch em, squash em, put them together and make something different. keep in mind too that you can do the same thing with just a regular font. For example, take a really swirly "S", stretch it out really big and color it so that it fades into your background and you have a neat looking swirly effect for your background of your logo. *hope that made sense*:)

Here is a link for you. Logos for the Designed Challenged Maybe you can get an idea or two.

Here is an example of what you can do with just fonts. Although these may be a bit much for what you want...you will get the idea of what can be done.
Using type for design
And another

*i am not affiliated with either of the above links...posted them for example*

Some good links there DM, thanks