Today's Coding Standards

The internet today is still surprisingly young and it’s growing at a massive rate. There are some fantastic websites on the internet but a large proportion of them still don’t pay attention to the standards sites should be living up to.

There are a few reasons why you should try to code to the highest possible standard. The cleaner, tidier and more valid your code, the more search engine friendly and accessible your website will be.

So what are the best ways to make sure your website is up to scratch? First of all, as touched upon above, make sure your code validates. The easiest way to do this is visit http://validator.w3.org and see how many errors or warnings you get. Some errors may be small, such as having images without an alternate (alt) tag. These are some of the errors you can easily get rid of and will make your website more accessible for someone who, for example, is hard-of-sight and may be navigating your website using a screen reader, which can’t process images. Having an alt tag on your image means the screen reader can process this and tell the person what the image is about.

Another point to bear in mind is the speed of your website. If your code is buggy and full of errors, it’s going to have an effect on the speed of your web browser and may take longer to process the code. Even if your code is valid, semantically it might not be correct – for example, you may start wrapping lots of elements in div tags and end up with a case of far too many divs that you don’t actually need. Even if the difference is minute, by removing unnecessary code it’s still an improvement.

The key points to remember are that you should write code that is as clean as possible. Plan the website build from the very beginning and see what you can use, re-use and make sure you know how your website will be structured from the start. This way, you can be sure you know what element is needed where and what you need to do to code it in a lean and efficient way.  Also, keep checking to make sure your website is valid (through the validity checker) and soon you’ll be in the habit of picking up on what may cause a problem and naturally start coding to avoid the error itself.

Rachel Shillcock
  • Written by on 20th December 2011 at 17:21
  • “Rachel Shillcock is a front-end developer at Fluid Creativity.”
  • Google+
  • Steve

    You lost me when you mentioned using the validator, you annoyed me when you referred to alt tags.
    I produce sites in HTML5, will the validator check that??
    Also it’s alt attribute not tag, please learn your trade.

    • claironeill

      Give us a link so we can check your credentials!

    • http://twitter.com/thebrainroom Tom

      I think it’s perfectly clear Rachel knows her trade well or else she wouldn’t be working at Fluid or being featured in .net mag etc.

      You’re right/wrong, validator will warn you about HTML5 doctype but it will still validate the important parts of the document.

      • Sam

        Well the thing is, it’s pretty clear she is a newbie in the industry. I believe she is just someone who gives their opinion in .net mag, They list her as a freelance designer not a frontend developer, maybe that’s because they think she doesn’t know frontend development well enough to be classed as that.

        • Guest

          Steve/Sam,

          The fact you’ve chosen to post anonymously says a lot. If you do intend to comment on blog articles, belittling others, at least provide some of your own work for us to judge *you* on.

          You appear to be completely missing the point of this article.

          What I believe Rachel is trying to explain, is that as developers we should at all times strive for code quality and consistency. The W3C validator is a basic way of testing this, even for newbies.

          The validator *can* now validate HTML5 tags and attributes, not to mention the countless third party validators geared towards HTML5 based sites.

          I’ve worked in the industry for a number of years and I still (at times) mistakenly refer to the alt attribute as a tag, simply out of habit. The same goes for many others I know.

          Dragging personal insults into conversation does nothing to help this industry and I believe we could do with less people like you trying to prove superiority (anonymously) via a blog comment.

          We should be encouraging young, enthusiastic (especially female) designers/developers to join this industry and contribute, not belittling them for their choice of wording.

          You should be ashamed.

        • Rachel

          Hi Steve/Sam,

          I’m more than happy to accept comments from anyone on this or any article, but in the future I’d prefer it if you would keep them to an above-board, non-patronising and non-insulting level.

          However, if you have any links of your own work that you think would be beneficial or useful to our readers then please feel free to send them in to us and we will happily link to them for you.

          Many thanks,
          Rachel

    • http://twitter.com/TomStill Tom Still

      Thats being a little harsh – I’m sure everyone fully understood what was meant by alt tag (even if it is really an attribute). Simple slip in the wording – doesn’t detract from the rest of the article.

  • http://twitter.com/thebrainroom Tom

    Nice piece Rach.

    Thinking carefully about the structure of your document really is the key. Like you say using semantic elements really cuts down the amount of tags used. However I don’t think there is any harm in using extra divs in certain situations.

    • Guest

      This is blasphemy Thomas! What would Redswish say?!

  • Steve

    You lost me when you mentioned using the validator, you annoyed me when you referred to alt tags.
    I produce sites in HTML5, will the validator check that??
    Also it's alt attribute not tag, please learn your trade.

    • claironeill

      Give us a link so we can check your credentials!

    • http://twitter.com/thebrainroom Tom

      I think it's perfectly clear Rachel knows her trade well or else she wouldn't be working at Fluid or being featured in .net mag etc.

      You're right/wrong, validator will warn you about HTML5 doctype but it will still validate the important parts of the document.

      • Sam

        Well the thing is, it's pretty clear she is a newbie in the industry. I believe she is just someone who gives their opinion in .net mag, They list her as a freelance designer not a frontend developer, maybe that's because they think she doesn't know frontend development well enough to be classed as that.

        • craftedpixelz

          Steve/Sam,

          The fact you've chosen to post anonymously says a lot. If you do intend to comment on blog articles, belittling others, at least provide some of your own work for us to judge *you* on.

          You appear to be completely missing the point of this post.

          What I believe Rachel is trying to explain, is that we as developers should at all times strive for code quality and consistency. The W3C validator is a basic way of testing this, even for newbies.

          The validator *can* now validate HTML5 tags and attributes, not to mention countless third party validators geared towards HTML5 based sites.

          I've worked in the industry for a number of years and I still (at times) mistakenly refer to the alt attribute as a tag, simply out of habit.

          Dragging personal insults into conversation does nothing to help this industry and I believe we could do with less people like you trying to prove superiority (anonymously) via a blog comment.

          We should be encouraging young, enthusiastic (especially female) designers/developers to join this industry and contribute, not belittling them for their choice of wording. You should be ashamed.

        • Rachel

          Hi Steve/Sam,

          I'm more than happy to accept comments from anyone on this or any article, but in the future I'd prefer it if you would keep them to an above-board, non-patronising and non-insulting level.

          However, if you have any links of your own work that you think would be beneficial or useful to our readers then please feel free to send them in to us and we will happily link to them for you.

          Many thanks,
          Rachel

    • http://twitter.com/TomStill Tom Still

      Thats being a little harsh – I'm sure everyone fully understood what was meant by alt tag (even if it is really an attribute). Simple slip in the wording – doesn't detract from the rest of the article.

  • http://twitter.com/thebrainroom Tom

    Nice piece Rach.

    Thinking carefully about the structure of your document really is the key. Like you say using semantic elements really cuts down the amount of tags used. However I don't think there is any harm in using extra divs in certain situations.

    • craftedpixelz

      This is blasphemy Thomas! What would Redswish say?!

  • Steve

    OK, I may have been a little harsh, the alt tag/attribute thing is a little pet peeve of mine and instantly gets my back up.
    However, the general content of the post is a little wishy washy, Rachel mentions semantics, then only talks about div’s which are semantically neutral, so while they do not add to the overall semantic value of the document, neither do they detract from it.
    I’m all for people blogging about their job, and trying to add value to the industry, but 5 vague paragraphs make an authoritative blog post not.

    • Sam

      Well I think what she meant by the divs is that it’ll take the browser longer to process the page due to separate divs. While this may be true, it’s like worrying about the speed difference between single and double quotes. There are much larger issues in performance which aren’t even used by this company as far as I can see never mind discussed in this post.

      As pretty much everyone I’ve shown this post as said (after a few of them laughing) was that while your comment was harsh but true. I’m sure one day Rachel will become a bright talent in the future, she isn’t quite yet.

      If I was fluid I would either delete this post or the comments. It won’t be doing your sales team any good for potential clients to look at the blog and see random developers pointing out that this blog post is weak. You’ve got one thing about HTML, one with project planning and nothing else. For a post titled as it is, it should be much longer and wider ranging.

  • Steve

    OK, I may have been a little harsh, the alt tag/attribute thing is a little pet peeve of mine and instantly gets my back up.
    However, the general content of the post is a little wishy washy, Rachel mentions semantics, then only talks about div's which are semantically neutral, so while they do not add to the overall semantic value of the document, neither do they detract from it.
    I'm all for people blogging about their job, and trying to add value to the industry, but 5 vague paragraphs make an authoritative blog post not.

    • Sam

      Well I think what she meant by the divs is that it'll take the browser longer to process the page due to separate divs. While this may be true, it's like worrying about the speed difference between single and double quotes. There are much larger issues in performance which aren't even used by this company as far as I can see never mind discussed in this post.

      As pretty much everyone I've shown this post as said (after a few of them laughing) was that while your comment was harsh but true. I'm sure one day Rachel will become a bright talent in the future, she isn't quite yet.

      If I was fluid I would either delete this post or the comments. It won't be doing your sales team any good for potential clients to look at the blog and see random developers pointing out that this blog post is weak. You've got one thing about HTML, one with project planning and nothing else. For a post titled as it is, it should be much longer and wider ranging.