September 23, 2008

Getting What you pay for: A (sort of) case study.

So the other day, the local paper came through my door and, being bored, I gave it a quick glance. On the front page, amidst a story of a brave tom cat being involved in some sort of gun based ordeal, I noticed a large full colour advert for a local web design company offering “professional” websites for small-medium businesses for as little as £200! I instantly jumped online and looked at the company’s site, websiteportfolio.co.uk and saw pretty much straight away why the prices were so low.

My initial thoughts were “Well, you get what you pay for I suppose..” but the more I dug around their site, the more I realised that you, in fact, were not getting what you pay for at all. In fact, based on their own site, a site which should be showcasing what a design company is capable of, £200 was a bit of a rip off. Let’s face it, even from a cheap product you have some basic expectations. You don’t want the cheap laptop to catch fire, you don’t want the cheap sweets to poison your kids. In spite of being cheap the product has to work to a certain degree. If you bought a cheap conservatory you wouldn’t be expecting the best heat reflecting glass or the most stylish door handles but you would expect the structure to be solid and not collapse five minutes after giving the builder his cheque. It’s this analogy that best describes my problem with this web design company. They certainly say all the right things and, who knows, they are probably very nice guys to do business with but I’m interested in what you get for your money… or what you don’t.

“WebDesignHelper.co.uk was set up in 2001 to provide professional websites for small to medium sized businesses who need professional web design solutions at sensible prices.”

- Excerpt from the WebDesignHelper site at websiteportfolio.co.uk

You could waste a lot of money by going for a super-cheap optionIn web design, as with most businesses, time is money. You charge the most money for the bits that take up the most time. That’s why sites that are graphics heavy or employ a fully customised shopping cart are more expensive, that stuff is time consuming. That’s why if I were to build a budget website for someone, that’s the stuff that they wouldn’t get, or they’d get only a small amount of. You see, standards based modern code doesn’t take that long to write. They’re called standards for a reason… they are standard. Also, as semantic markup is a lot more modular than the tables based garbage of old so can be thrown together really quickly. Not only that, this faster method of coding is actually way better for SEO, accessibility and browser interoperability so there is, flat out, no excuse for a budget site to be coded like it’s 1997. Looking at the source of the homepage for websiteportfolio.co.uk There are several glaring, fundamental issues for which there are no excuse in modern web design, even in a budget site:

  • There is no doctype defined. This basically means that browsers have to take their best guess as to what it is they’re actually reading. The Doctype should always be the first line of code on a web page (view the source of this very page…see?). Lack of a doctype will mean the site cannot pass validation and may well not display correctly across all browsers.
  • The site makes zero use of CSS and as such is reliant on deprecated tags such as font. This is a very big deal for browser interoperability.
  • None of the links offer any kind of hover state feedback such as a colour change or underline when rolled over with the mouse. This makes the site hard to operate for inexperienced users and/or users with learning disabilities. It is a fundamental accessibility requirement and extremely simple to implement with some basic CSS.
  • It uses a number of non-breaking spaces to create empty space, adding unnecessary code where some simple, lightweight CSS could manage such problems site-wide with zero additional markup in the page itself.
  • The whole layout of the site is achieved by manipulating HTML tables. As well as this being massively time consuming this is very much frowned upon in modern web design as it means pages are far larger than they need to be leading to longer loading times as well as having severe accessibility implications for screen readers which will not always be able to read the content as it appears to a human eye. It’s also pretty bad for SEO as it goes against the principals of semantic markup.
  • A large proportion of the copy is actually an image (for example; the “introduction” text). This is a serious one. Not only can screen readers not read this in a lot of cases, but search engines can’t index it at all meaning any content that might help your site rank better in google is completely wasted. In addition, older browsers can’t scale the image properly leading to more accessibility issues for the visually impaired. Worse still, this block of “text” has no alt attribute defined so if you can’t see the image, you’re shit out of luck.

These problems can be almost exclusively attributed to one cause; the designer can’t be bothered or doesn’t know how to write code to modern web standards. No matter what the client is paying, sites should be coded to the same set of standards (unless the client explicitly requests otherwise). Think about it like buying a car. You can buy the base model or you can pay extra for nice extras like A/C and a trick stereo but the chassis on both of those cars is the same, made from the same quality materials. How gutted would you be if you bought the cheap one and found out the chassis was made of cheese? Obviously I say that in jest but my point is, you don’t expect the underlying frame of any product to be of a lower quality, regardless of how much you pay.

All this said, I have to mention that it’s not fair to judge a web design company by it’s own site alone. The most powerful advertising tool they have is their portfolio and to get the best idea of what they are selling to their customers you have to thumb through some of their work. I did this and, I have to say not to my surprise, I found that most of the sites suffered these same fundamental problems. Some were slightly better and some were worse but none were what i would expect to see from even a budget site, especially not from a company claiming to offer “Professional web design solutions”

Sadly, this kind of web design company is very common and the vast majority of clients don’t know enough to be able to tell the difference.  While this is still the case, and it will continue to be the case, it is easy to offer a site that might look okay at a glance but is in actual fact falls down when it comes to fundamental and important standards, in essence not being worth the money that was paid for it.

Enjoy this post? Tell your friends!

  • Twitter
  • Facebook
  • Digg
  • Ping.fm
  • del.icio.us
  • StumbleUpon
  • MySpace
  • Google Bookmarks
  • Live
  • LinkedIn

Related Posts.

    No similar posts. This shit is unique, yo!

Dean Simpson
September 23, 2008 - 11:10 pm


As well as bad design, there is bad security.

http://www.essayexpress.co.uk/cart.php?paymentid=1&mode=checkout

Allows a customer to send unencrypted credit card details.
And most likely a customer who is buying someone else essay to pass of as there own, is not going to notice this.

I don’t know if the shabbiness of the sites is down to the time contrainsts of producing a e-commerce web site for £460 or the lack of skills of thoose producing this stuff.

Hello 1999 http://www.silkiestar-ragdoll-cats.co.uk/index.html

Dan
September 24, 2008 - 9:31 am


Bad security is more related to what I was getting at here. Design is subjective so as long as the client is happy then it doesn’t matter so much. Sure I think some of the sites in this portfolio look awful, in particular the cat one you pointed out, but I’m not the client.

A site being coded badly is not subjective, however. It’s either done well or done badly… in this case it’s the latter.

kat neville
September 24, 2008 - 11:12 am


I totally agree with you. It is a horrendously-designed site, both code and accessibility-wise. A lot of the css/html coders I speak with follow standards compliant css, or make an effort to do so. But we are DEFINITELY in the minority.

In January of this year, our css/html guy got a new (and better job). We began interviewing people to replace him, and in the big city of design and web called London, for a mid-weight position we got:
1. One guy who didn’t close his html tag
2. Many, MANY people that used tables not only for the company they were formally working for, but also for their personal site.
3. One person that was convinced negative padding was possible and used it often
4. A few that didn’t know what a doc type was.

With a few exceptions, they failed to know the difference between display: none; and visibility: hidden; and one guy used tables to have images that sat next to text.

Someone else told me that they still teach kids table-based design in college, or using the ‘design mode’ of dreamweaver.

It is infuriating, and no one at a mid-level was ANY good that we interviewed. That’s why work decided their designer (me) would just have to do it. And honestly, even then at that point, I was MUCH better than 90% of applicants.

Sigh.

Dan
September 24, 2008 - 11:45 am


I think a major contributor to the fact that these bad coders are around in such abundance is, as you pointed out, college and university education.

Because of how long it takes to compile a syllabus and roll it out to the class rooms and lecture halls, most of the stuff they teach is already out of date. Of course, they don’t tell students that so when they graduate and enter the big wide world they’re under the impression that the stuff they learned in college is the right way to do things. I’ve experienced this first hand. The HTML they tried to teach me at college was horrendous; frames, font tags and no mention of doctypes… bleugh!

Jack Franklin
September 27, 2008 - 10:11 am


Kat – I’ll do the job! Hahaha!I reckon I could beat any of those people.

Adam
September 30, 2008 - 5:41 pm


Holy Lord!
http://www.essayexpress.co.uk/home.php

Is so bad its unreal! Christ, I make e-commerce sites for about £500 with no products added, by the looks of that e-commerce store though; well its either oscommerce or some other shit.

“if(navigator.userAgent.indexOf(“MSMSGS”) >= 0)
localBrowser = “WMessenger”;
else if(navigator.userAgent.indexOf(“e2dk”) >= 0)
localBrowser = “Edonkey”;
else if(navigator.userAgent.indexOf(“Gnutella”) + navigator.userAgent.indexOf(“Gnucleus”) >= 0)
localBrowser = “Gnutella”;
else if(navigator.userAgent.indexOf(“KazaaClient”) >= 0)
localBrowser = “Kazaa”"

Whats this all about? Whats the point in this? What the hell!

Cannot belive its all the twitter clan posting :p

kat neville
October 1, 2008 - 12:41 pm


Ha ha sorry, you’re too late! I’m now a certified css WIZARD (grade 2)!

Adam
October 1, 2008 - 12:44 pm


lol wut? as in the MS Office Wizard? :p

Dan
October 1, 2008 - 1:35 pm


Haha, image of an actual wizard in a purple cloak and pointy hat with his hands in the air, wiggling his fingers chanting “Dot navlink, space, open curly bracket float colon left semicolon, display colon block semicolon, close curly bracket!!!”

kat neville
October 1, 2008 - 1:54 pm


hahahahaha that *is* the magic spell! I’m currently shouting, “dot profile, space, open curly bracket position colon absolute semicolon, top colon zero semicolon, left colon zero semicolon, close curly bracket!” It’s the only way to get my minions to behave. hehe

AND I have a wand.

Jack Franklin
October 1, 2008 - 5:58 pm


There are some rip-off companies out there. I did a critique for someone on WebForumz who paid 6k for a site – it was done wtih tables for layout, didn’t validate, the works. I could have done a better site for £100!!!

Dan
October 2, 2008 - 10:52 am


I’m actually cooking up a follow-up piece to this about how anal one should be about standards, particularly WAI and W3C validation.

You see, Adam @ MinuteDesigns and I are locked in this perpetual argument about how Validation isn’t the absolute be all and end all of a project and I thought it would be a good post if I put my viewpoint out there.

Amy Mahon
October 2, 2008 - 12:58 pm


Great post — I totally agree! It’s frustrating when you get thrown into bidding wars against companies like these because you just want to shake the client and have them magically understand all the points that you listed although it’s never quite that easy, and more often than not they go with the cheaper website.

Adam
October 2, 2008 - 3:31 pm


I would just like to summarise my opinions and points up here;

Anyone can make a beautiful well designed website, the true skill in making such a website is coding it valid, and accessible, the code is part of the beauty, if the code is ugly, the site will display ugly on a variety of browsers unused by the designer, 99% of bugs I have come across with someones website that is due to the fact that its NOT HTML Valid and once its made valid the majority if not all of these problems and bugs are removed. I was the Hitler of the WebForumz for this, when someone posted “This does not display right” – Come back when its HTML Valid.

There are rules and regulations in the vast majority of Industries, which companies are forced to abide by, in the web industry there are none, only guidelines. This is why there are so many cowboys in the trade putting strain on the “Real” Designers and Coders who are working hard to make the web a better place. It’s about time people started to think and act upon the web standards and make them common place, I annoys me to hear phrases like “Ill make the site first then I will make it HTML Valid after” – WHY? Can you not code CLEANLY enough to have it valid in the first place?

Web Accessibility for me is like the wheelchair ramp for a shop, if people cannot get in your shop they will not buy, if people view your website and its a mess or cannot navigate it easily then they will leave, and you would have just lost out.

It’s true you cannot always be 100% perfect across every single browser on the planet, and its true that the Web and its Applications and uses change daily for the better/worse. Keeping up with the new technologies is what I would class as vital as a designer and coder, and its our responsibility. We are not accountants where 1+1 is 2, We are designers where our normal way of thinking or doing is changed, expanded upon, where we constantly learn new techniques and strive to better ourselves in such a complex and competitive industry.

-Adam :)

Jack Franklin
October 2, 2008 - 9:49 pm


I think there is a limit to how anal you need to be – yes I think that I partially agree with Adam that you do need to have valid code. But (tell me if this is wrong), I seem to remember a while back that Google Adsense code was buggering over the validation on my site – surely designers can not see the need to make valid code when one of the biggest web companies in the world are producing invalid code for them?

Adam
October 15, 2008 - 12:52 pm


@Jack

Google Adsense code is Valid, to whatever DocType they made it for, its mainly Javascript errors which are easily fixed. I’ve had adsense, analytics, all sorts from google added.

Google even admit themselves that “Clean Code” is better for SEO, although you may translate that to whatever you like, I would class clean code as HTML Valid, others would just say not. Either way, dirty code can cause loops within browsers, browsing problems with different languages and charsets. Remember Content >> CODE.

The more code you have on a website the Code2Content ratio changes, which effects SEO, thus HTML Strict would be the best DocType to adhere to.

Adam
October 15, 2008 - 12:53 pm


Oh by Javascript I meant in reference to content = text/javascript (I wont post it correctly incase dan has HTML active in posts!

Dan
October 15, 2008 - 1:12 pm


I would interpret “clean code” as code that isn’t table based and isn’t loaded with style attributes.

Another factor that falls under my definition of clean code is markup that is in a logical order and uses logical, semantic tags. Not only does this make your code easier to work with in a text editor, the logical order has benefits for SEO and acessibility (It eliminates the “need” for tab index attributes, again bolstering the clenliness of the code.)

I think the standard I most strongly advocate is this idea of Semantic markup. Whenever I teach someone HTML I stress the importance of using the right tags for the job and not just paragraph tags all the time. I also stress the benefits of the div tag as it is semantically neutrual and can be given semantic meaning through CSS classes and IDs.

Adam
October 15, 2008 - 1:18 pm


(It eliminates the “need” for tab index attributes, again bolstering the clenliness of the code.)

Incorrect, Tab index is defined then by the browser not the page, thus would fail on WCAG WAI Standards, although tab index’s are seldom used as they are pretty worthless.

BTW Paragraph tags can be given an ID or Style you know? same with a or so, in reality its the same? ie if you want your break at 50px rather than the usual crap you could have

Dan
October 15, 2008 - 1:28 pm


And the browser determines the tab order to be the order of elements in the markup does it not?

I know you can add a class or ID attribute to anything but the tag p still means Paragraph no matter what class or ID you give it. The tag div has no inherent meaning which is why they are perfect for structure and layout. Of course in 2022 when HTML 5 is in full swing (lol) the div tag will lose it’s importance as we will have tags like

and which are more correct in a semantic sense. For now though, divs rule.

I also forgot to mention h1 – h6 tags. The correct use of headings is another factor in my definition of clean code, although “organised code” would be the better term. I know I don’t use them quite correctly on this site *slaps wirsts* but I fully intend to do so when I launch my redesign.

steelhouseindy - WebForumz.com
May 14, 2009 - 4:36 pm


[...] I’ve seen in a long, long time. As a matter of fact it breaks many of the rules I go over in this blog post. As for it being a "successful" website… I don’t think it really can be. It lacks [...]

Share the love...

Rocking my socks

Doomtree POS - Never Better Bike for Three! - More heart than brains Alexisonfire - Old Crows Young Cardinals

Recent Reads

The Invincible Iron Man #21 Siege: The Cabal War Machine: Iron Heart