Friday 18 June 2010

Web Design For Dummies

[simpleaffiliate source="chitika" results="0"][/simpleaffiliate]
web design for dummies

So, How Much Should Web Design Cost?

On a daily basis I get asked many various questions, but obviously the most frequent question is "how much will a website cost me?". This in general is a difficult question to answer, as most projects vary from client to client. If you search "web design UK" in Google you'll no doubt see sponsored links for companies offering "Amazing Web Design From £199", and "Modern, Professional Websites from £69.00, Ready in 48 Hours."




For the majority of small businesses/start up companies and individuals, these will no doubt be very tempting offers; the problem is most people do not understand how much work is required/involved in professional/decent web design and development.




To give you an idea of the development process in I've compiled this short breakdown of everything required from the initial meeting through to putting your complete website live.




The Initial Stage





  • Receive brief for new website; either via email or phone.

  • If required, schedule a meeting where I can learn about a clients business; its objectives, ethos and brand plus its customers. This meeting is normally free by the way.

  • Send over a detailed quote/proposal to the client outlining the key areas for their approval.

  • Agree on a price for the project, receive deposit and sign contracts.


The Design Stage





  1. By now, I have normally received/collected all the relevant information from the client, such as Logo's, any brochures the client may have, and any other supporting material.

  2. Using this material, I sketch out plausible layouts/wireframes which fit in with the clients content and current brand (if they have one).

  3. These layouts/wireframes are then mocked up in Photoshop/Illustrator.

  4. These initial mockups are only used as a usable guide to laying out the content in a useable manner.

  5. I next start on the actual design stage. This involves mocking up the website which gives us the 'general look' of the website. Normally this will take into consideration the clients current branding.

  6. Most clients only require 1-2 design's to choose from.

  7. I upload these initial mockups to my own development server, and send the client a username and password to access them. Here the client is able to view these flat mockup designs in their own browser and leave any comments they may have. This is much better than sending the client jpg images through email, as some clients don't know that these images should be view at 100%, and don't get a full feel of what they would look like in the browser window. I've had feed back before using the old metere the client has commented... "looks a bit small?".

  8. If the client is happy with these initial designs, and chosen their preffered, the next stage is to design each of the other sections of the website. Again, as with above, these are uploaded to the development server for approval.

  9. If the client is happy with these designs, we have them signed off.


Coding Stage




Once we have relevant pages designed, and signed off by the client, the next stage is taking these website designs and converting them into useable templates.





  1. At this point we take these Photoshop documents and start slicing them up into DDA compliant XHTML templates.

  2. As with most projects, there is normally only a small amount of content that can be inserted into the website, so we use what's called 'Lorem Ipsum'. This is simply dummy text used as the industry text ever since the 1500s. I've had comments before asking why I'm using Latin... Mmmmm?

  3. Once complete, these template pages are again uploaded to my development server which can be accessed through a simple URL, such as dev.yourwebsite.co.uk. From here we can check the website in various browser and iron out any bugs (which inevitably there is) found in the different browsers. We also check all javascript functions, images & button rollovers, various text sizes etc.

  4. At this point, the templates should be pixel perfect when compared to the original Photoshop designs. The only difference will be font sizes, which are different depending upon which browser we are viewing the website in, and also individual browser settings.

  5. I then test, test, and test again...


Development Stage




This is the crucial stage, and very important that the previous stages have all been signed off. If half way through this next the client complains, or asks for a change, at least we have something to fall back on. i.e. this wasn't agreed, and you signed them off. But not only does this cover myself, but also the client, as the client will be able to pick up on anything that has been missed.




We should now be at the point where the client has viewed these working HTML templates, and has signed them off (As mentioned above, it's important to have each stage signed of by the client). We now start developing these templates into a fully working website.





  1. At this stage, depending upon whether the client requires a CMS/eCommerce, or static brochure website, I move onto the actual development stage.

  2. Code the site using XHTML/CSS and any scripting language used (normally ASP).

  3. If a database is required, I start developing this along with the Content Management System / eCommerce system.

  4. The client by now should have completed, or at least started compiling all relevant content for the website.

  5. If the client is having a eCommerce website developed, I normally heplp the client with setting up their merchant account and credit card processor (Normally SagePay).

  6. Depending upon whether the client, or myself is inserting the content, this is the next stage. This is a great part of the development, as the client can really see the website coming together. If the client is inserting the content, I normally arrange a meeting or telephone call to go throught the websites content management system in detail.

  7. If we are developing an eCommerce website, we now plug the website into the clients payment processor. This is a very important area, and must be right. There are no margins for error as this is where the client can loose sales. We test various credit cards, various browsers, various product and shipping options. We also test invalid cards, wrong address matches etc to make sure that all of the error codes are returned from the payment processor back to the clients website notifying us that the payment was unsuccessful.

  8. I then test, test, and test again...


Nearly There




By now we should be at point we either have a finished website, or very nearly, just requiring the last remaining products/content and images to be inserted.





  1. With most of the content/products inserted into the website, I go through the website to make sure all targeted keywords are inserted correctly, and that any content added matches these keywords/phrases for each section. I also check all anchor text so that it also matches targeted keywords.

  2. Set up Google Analytics. (Reporting tool for Google)

  3. Once all the content has been added, I then (after final checks and sign off) upload the webite to the clients web server.


Final Stage





  1. At this point I insert what is called verification code for Google, Yahoo and Bing (this is used to verifiy the website with these search engines).

  2. Create an XML site map and upload to the relevant search engines.

  3. If the website has been a redesign, the client should hopefully have a customer base email list. If they do, I normally (if agreed in the quotation/contract) send out notification emails to all of these customers informing them that the client has a new website.

  4. Is that the end of the relationship? No; Most web designers should offer some form of maintenance, this doesn't come free and should have been outlined in the quotation/proposal.


As you can see, there is lot more goes into the design and development of a professional website than most people think. Add to this the equipment used/software and not accounting for various other requirements such as font selection, copywriting, Search Engine Optimisation, Flash, specialist JavaScript implementation and other extras. Taking of equipment, most professional web developers will have ten's of thousands of pounds worth of equipment and software. To be able to develop upto date websites etc, you need up to date equipment and this doesn't come cheap; for instance I use a 12 Core Mac Pro (retailing at around £6K) add to that, 3 x 24" Apple Cinema Displays (retailing at £500 each!), then add software, both windows and Mac, plus laptops you can easily accumulate £15-£20k.




A high quality, professionally designed and developed website should contain all of the above, and if you think it sounds to cheap, then it most certainly is! As the saying goes, "You pay for what you get".




As a professional freelance web designer /developer with over 10 years of experience, I tend to think I'm actually not that bad at what I do (being careful not to blow my own trumpet), but I hear on a regular basis of lots of people who 'think' they can design too, plus there is always someone's son/daughter/friend who can build a website for the price of a mars bar! Just remember, it takes years of experience and practice to be able to design and develop high quality/bespoke/workable/useable design.




So, the next time you hear about, or see an advert for 'cheap web design', ask yourself the question "why is it so cheap". There is generally a reason why it's so cheap, and I have seen many horror stories over the years; although it's not my place to divulge theses; but normally there is a reason why they have such cut down prices, and is it really a good investment for your company having a 'cheap website'.. what will it do to your brand image?




Would you deliver a cheap/substandard product(s) to your customers? I thought not, so why deliver a cheap/substandard website to your customers when it is in fact one of the first ports of call for your business, and whether you like it or not, first impressions do count!


About the Author

UntiedShoes: Graphic Design | Advertising | Online | Brand Development | Contract
UntiedShoes - is a leading Freelance Newcastle Web Design and Internet Marketing Company.



Web Design for Dummies Books.flv









[simpleaffiliate source="amazon" results="10"]web design for dummies[/simpleaffiliate]
[simpleaffiliate source="cj" results="10"]web design for dummies[/simpleaffiliate]
[simpleaffiliate source="clickbank" results="10"]web design for dummies[/simpleaffiliate]

No comments:

Post a Comment