Coffee

elmolesto

Hi guys.
We have just uploaded a website (for the company I work for) www.coffeebeans.ie
I am aware of a lot of flaws and would really appreciate any suggestion you might have.
So where should I start?

Laslo

Web standards, web standards, web standards.

Kudos

The company you work for (link to it is on the site) has a nice big W3C XHTML 1.0 Valid image, which is lovely. You are half way there, next you need to understand semantic mark-up and discard your table-based layouts. Then maybe you will deserve to be paid for your work. The coffeebeans design actually lends itself to semantic mark-up and would be very easy to code.

Also, putting a -page suffix on every page name is redundant.

As for how it looks, it's fine.

Ph3n0m

Laslo wrote:

Web standards, web standards, web standards.

why? it passes validation

http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.coffeebeans.ie%2F

Laslo

Ph3n0m wrote:

why?

Are you seriously asking me why?

Ph3n0m wrote:

it passes validation

To be fair, that doesn't really mean anything.

Ph3n0m

Of course I am asking you why

It passes validation, therefore according to w3c own standards, it is coded properly - cant really argue with that

Kudos

Ph3n0m wrote:

why? it passes validation

http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.coffeebeans.ie%2F

Because there's more to standards than passing the validator, accessibility for example.

Ph3n0m

well if you are to argue semantics - accessibility, usability, etc - that would be the higher end of "standards"

according to most, and the wiki (which I know is not gospel)
Web standards, in the broader sense, consist of the following:

* Recommendations published by the World Wide Web Consortium (W3C)
* Internet standard (STD) documents published by the Internet Engineering Task Force (IETF)
* Request for Comments (RFC) documents published by the Internet Engineering Task Force
* Standards published by the International Organization for Standardization (ISO)
* Standards published by Ecma International (formerly ECMA)
* The Unicode Standard and various Unicode Technical Reports (UTRs) published by the Unicode Consortium
* Number registries maintained by the Internet Assigned Numbers Authority (IANA)

However I would also advise moving away from tables, etc and more into div/css

Adam

I'm with Ph3n0m here, I don't see what your problem is Laslo?

Sure, tables vs. divs blah blah blah, plenty of other places for that discussion, and lets face it, it doesn't make a lot of difference to the end product, and it's a more advanced contruction technique which few that aren't in the business have the time or need to learn.

I guess most of my annoyance is your lack of helpful guidance Laslo. Considering the site passes validation, it's likely that the OP knows about the existance of web standards, so you haven't provided much really, have you?

Kudos

'Professionals' should be aiming at the higher end of standards. Web design schools teach semantics for a reason.

Ph3n0m

Kudos wrote:

'Professionals' should be aiming at the higher end of standards. Web design schools teach semantics for a reason.

It seems to me that the company the OP works for sells coffee - not making websites

Speaking as a "professional" I would use table/div/css to build a site (depending on what is required, etc)- but thats just me, a few years ago I used tables/css to make websites.

Kudos

Ph3n0m wrote:

It seems to me that the company the OP works for sells coffee - not making websites

I would be mildly surprised if that were the case. Regardless, he asked for criticism, and that is what he got.

Ph3n0m

Kudos wrote:

I would be mildly surprised if that were the case. Regardless, he asked for criticism, and that is what he got.

indeed he did - we all suggested the move away from tables

Liam Byrne

Kudos wrote:

I would be mildly surprised if that were the case. Regardless, he asked for criticism, and that is what he got.

Erm, no - he asked for suggestions. This might include some constructive criticism or a few pointers, but he didn't actually ask for criticism.

To be fair, though, Kudos did say it looked fine, so while the post re standards was a little glib, it wasn't like it was overly-harsh criticism.

Depending on requirements, there are, IMHO, 6 main criteria for a website

1) Present the content in a professional-looking, easy-to-use, clear manner
For this site, that's a PASS - it looks well, is easy to use and pretty clear; there's potential to improve the layout a bit or add some graphical elements to separate out the navigation, etc, but it's a lot better than most in-house websites that I've seen

2) Make the site respond reasonably well to search engines
ALMOST A PASS, but the keywords are incorrectly coded; keywords should be just that - keywords separated by commas. This site has them as a sentence (i.e. as if it were a DESCRIPTION meta tag).

3) Pass the W3C validator
Use valid markup, CSS and DIVs to ensure cross-browser compatibility and help a site respond even better to search engines. PASSES THE W3C, which is good, and while I haven't checked it fully cross-browser, the tables should make it more cross-browser friendly. Note to developer, though - DIVs would be much better for layout.

The presence of the "MSSmartTagsPreventParsing" tag would make me worry that there's no chance of it being a proper, open-standards (i.e. proprietary MS site) but the absence of any crappy MS inline pseudo-CSS seems to belie that worry.

4) Updateability
The site should be easy to update, if this is relevant to the business. This can be achieved through a CMS or through a templated setup. If it's templated, steps should be taken to ensure that adding pages doesn't unbalance the navigation

5) Full accessibility
Ensure that, where relevant to the business, a site is fully accessible to disabled web users - screen readers for visually-impaired, colour-blind, access keys, labels for fields, alt tags etc.

6) The "Fancy stuff"
Animations, etc should be added only after the relevant criteria above are met; e.g. don't use Flash if the content needs to be indexable by Google; don't use static elements if you'll need to update regularly, etc

All of the above depend on your time and budget, but my opinion is that the order above indicates the importance of each. Some are interdependent and help each other out, but otherwise there is no point in having one of the latter ones unless the earlier ones are done.

For this site, the most important ones - i.e. 1 to 3 - are, for the most part, done, ; I'd suggest a few minor improvements and then (and only then) considering the cost/benefit analysis of the remaining ones.

In an ideal world with unlimited budgets and time, 1 to 5 would be a given, with only item 6 being the gratuitious, non-essential add-on.

But the point remains that this isn't a bad site at all; with a few tweaks and refinements, it would have gotten all of the key issues right.

So basically, it's a pass from me, with potential for an honours grade if a few items are worked on; bit of a way to go to get an A, but if it is indeed an in-house production by a non-web expert, not bad at all!

Laslo

Mirror wrote:

Sure, tables vs. divs blah blah blah, plenty of other places for that discussion, and lets face it, it doesn't make a lot of difference to the end product

Right, so you're saying that accessibility, semantics, maintainability, future-proofing and general (albeit loosely defined) best practice doesn't make a difference to the end product? Well I can tell you, if you're a Web professional then it does.

Mirror wrote:

and it's a more advanced contruction technique which few that aren't in the business have the time or need to learn.

I don't care. There's a right way and a wrong way to things. The OP asked for advice and I simply pointed him/her in the right direction.

Mirror wrote:

I guess most of my annoyance is your lack of helpful guidance Laslo.

Annoyance? Right. Firstly, the OP said they were already aware of flaws and asked for any suggestions. I think pointing them in the direction of Web standards was extremely helpful.

Mirror wrote:

Considering the site passes validation, it's likely that the OP knows about the existance of web standards, so you haven't provided much really, have you?

I generally don't run sites through the W3C validator, I check the markup manually. As someone who's been coding HTML almost since its inception, I'm pretty good at doing this. It's quite obvious that the OP doesn't really know about the existence of Web standards as such. Having said this, HTML 4.01 is still a standard. However, as has already been said, stop using tables, mark your site up with meaning and semantics, etc. etc.

I've been helpful by making a general suggestion. If you disagree, feel free to help the OP yourself when you've finished sucking up to the moderator.

elmolesto

Thank you guys for all your comments. I will make a few changes during the week and I will be looking forward to further comments and criticisms.

Seth Brundle

I think the site is quite good.
I don't like the "Welcome to coffeebeans.ie and .eu.!" - make it .ie or .eu but not both. Where is your target market? If Ireland, then go with .ie.

Whats the S icon for? - it doesn't look like part of the site

The link to buy coffee beans online above the 'map' on the home page brings the user to another version of the homepage.

I don't know whether you stock it but I see no mention of fair trade and other politically correct crap.

Have you registered the trademark beside the links to sitestogo?

Rollo Tamasi

I would put a border on each one of your images, either CSS based dashes or modify the jpegs so that they blend into the background better. They stand out a bit too much at the moment.

Very nice and easy to read/navigate site. Maybe a logo, and to a lesser extent a favicon, is the only thing missing?

axer

The site seems fine. One thing I would change however is the colour of the links. Make them brighter than the normal text instead of darker. They should stick out as links not disappear.

Bob the Builder

As for web standards, validation, etc. Make sure it is Basics compliant(which it is), and make sure that those who are less able to view the site(ie. Semi-Blind people) will be able to view the site using a magnifier. The website is simple, to the point, and the theme fits.

Forget about all those accessibility articles, etc. You'll find that if you try and take a little bit out of all them, your website will become ugly and non-standards compliant.

Well done, good job.

axer wrote:

The site seems fine. One thing I would change however is the colour of the links. Make them brighter than the normal text instead of darker. They should stick out as links not disappear.

I was just going to say that...

Now that I think of it, because if you look to Google, SEO has already been Passed by Google itself as top place(over O'Briens): http://www.google.ie/search?hl=en&safe=off&q=coffee+beans&btnG=Search&meta=cr%3DcountryIE

Also, if this thread gets into google, and people see it as well as the actual site we're ment to be rating, every visitor to the site will appreciate it.

Aren't we ment to be rating a site here rather than pussy fighting, if someone sees a logical point to make about accessibility, why don't they make another thread about it. I'm sorry, but I think Kbannon/Kudos/Axer and especially Liam Byrne have made the only valid points here without fighting.

~NevF