Clean Code

Published: June 30th, 2010 by Tom D.



Mom always told me to clean behind my ears. But clean code? She wasn’t too familiar with that.

At Atomic, clean code is a way of life. It’s the foundation of all our development work. It’s how we make sites that run well now – and are easy to update and maintain over time.

A hundred and one variables separate clean code from messy code: being compliant with W3C conventions; using standard naming conventions; using a single CSS stylesheet; using title tags, in a clear hierarchy, to define page content; and eliminating extraneous code, just to name a few.

But in short, clean code uses streamlined, standardized protocols; is easy to read and understand (by humans and computers); and conveys complex information elegantly.

Here’s an example of clean versus messy code:

Web Proposal

There are a number of benefits to writing code like this:

  • Promotes good search. Code that is properly organized and tagged is easier for search engines to crawl and understand. That means you get better results in SEO.
  • Helps with cross-browser compatibility. Using clean code helps your site display correctly no matter what browser your audience uses. See the difference in the pages below? That’s the result of careless coding. One browser is able to “figure out” what the confusing code means; the other browser can’t.

Web Proposal

  • Simplifies maintenance and troubleshooting. Most people want to update their websites over time – maybe add functionality or fix a security weakness. To do that, your code needs to be read and revised, often by someone other than the original developer. The easier your code is to read, the easier it is for the developer to find the code they need, understand it, and update it.
  • Saves money. The difference between updating a messy site and a clean site can be the difference between 2 and 10 hours. Most developers charge an hourly rate for update and maintenance work, so the cost savings from having a cleanly written site can be huge.

You can right-click nearly any website and select “View Source” to see how the website was built. Wondering if your site code is clean or cluttered? Give us a call anytime. We’ll be happy to take a look.

Leave a Reply

You must be logged in to post a comment.

Atomic Interactive