20 Quick Tips To Better Web Design

Web Design Tips

20 quick tips and practices to better Web Design.

  1. The W3C validator is helpful at ensuring code is valid. Use it.
  2. Try to integrate and or use the latest versions of code/language where possible. This will help future proof your website and minimise the need to change depreciated code at a later date. See stuff on HTML5 and CSS3.
  3. Avoid the use of ‘click here‘ as the text on a link.
  4. Use comment tags throughout code.  We humans are forgetful at the best of times, so having helpful ‘reminders’ can save hours when it comes to future edits. Also, comment tags can be used to hide code that we don’t want displayed.
  5. Keep your code semantically written. For example, when writing a list, always use the correct tags for the type of list created – unordered, ordered or definitive list NOT <div> tags <p> tags etc…
  6. Avoid the use of inline styles as maintenance can become difficult, but more importantly, presentation is no longer separate from the content.  Use the CSS.
  7. Use conditional stylesheets to compensate for inconsistencies in older versions of IE.
  8. Use the title attribute on links and images to add more context.
  9. Remember the acronym TRBL which denotes the order in which the sides of an element are defined in CSS – Top, Right, Bottom, Left.
  10. Use a reset stylesheet to zero out those cross brower incompatibilities. Eric Meyers reset is a popular choice with front-end developers.
  11. Use code snippets where possible. They can save time and limit ‘code error’ frustrations.
  12. Elements that occur once on a page should use an ID attribute.
  13. Elements that occur more than once on a page should use a class attribute.
  14. Use CSS image sprites to minimise server load.
  15. Add a sitemap to aid SEO.
  16. Use the correct type of image format for each picture/graphic for maximum visual impact and for the smallest possible file size. See my previous post.
  17. Friendly URLS should be used for SEO and human readability.
  18. Use whitespace as a perfect design aid.
  19. The primary logo should be linkable back to the homepage.
  20. Add your own favicon for that added personal touch.

Well that’s it folks. What are your top tips and practices? Would be interesting to know and share with the world.

Leave a Reply

Your email address will not be published. Required fields are marked *