ARTICLES
BY JOHN TAN
If you design or develop websites, you’ll find yourself working with HTML, CSS, and JavaScript.
Every language has a range of best practices and guidelines to follow, which is great if you want to standardize your end-product. However, there are a lot of other things to consider besides being standards-compliant.
While validation isn’t a complete testament to code quality, it does help to make sure that your code follows recommended standards and can show you errors in your markup, CSS, and JavaScript.
Though many users still don’t use browsers that have CSS3/HTML5 support, if implemented with progressive enhancement in mind, taking advantage of these future W3C recommended standards gives your products added value and improves the craftsmanship of your web designs.
Using the right tag for the job is essential, and search engines love semantic code. Use < p > for paragraphs, < ul > for listed items that have no ranking, < ol > for items that have a sequential relationship, < a > for hyperlinks and < button > for clickable UI components that perform an action/user task.
Whether in the form of using the Sitemaps XML protocol or including a favicon, these optional files can enhance your website. See five files that can improve your website.
If your website is content-heavy and is updated frequently (e.g. a blog or news site), having an RSS feed will be a necessary site feature for keeping your users up-to-date with fresh content. If you don’t use a CMS with this feature built-in, check out SimplePie, a PHP class for building your own RSS feed.
Graceful degradation (also known as fault-tolerance) — the notion that a system (in this case, a website) will still function under sub-optimal situations — is essential for flexible and web accessible site builds. Learn how to pragmatically apply graceful degradation when using CSS3.
While search engine optimization should not dictate your design decisions, it wouldn’t hurt to consider how your website could be more visible in search engine results. Read some SEO tips to remember when building your site and ways to improve the SEO of your web designs.
Designing a print CSS file is worth the time investment as many users still do print out web pages.
Using "dead code" such as the tag that was deprecated in W3C HTML 4 specifications as well as non-standard code such as the
IE6 isn’t going to go away completely, and if your project requires you to support IE and to use browser-specific code, use conditional comments to serve IE-specific stylesheets instead of using hacks.
This does two things: It gives you the ability to get your code to validate under W3C standards, and when you decide to stop using browser-specific code, you only need to remove the conditional comments in your site template.
Leveraging JavaScript techniques for fixing IE6 and projects such as HTML5 Boilerplate to solve deprecated-browser rendering issues could be another option, but you’ll be stuck in scenarios where the user uses an old browser with JavaScript disabled — a scenario that is not as uncommon as you might think.
This is important not only because it’s best practice, but also leads to more manageable and maintainable code.
The navigation menu is the most important part of your website. Getting it right is an integral part of an effective site information architecture.
Code bloats easily, so strip away any non-essential and repeated bits of code for more maintainable and leaner (and thus, higher performance) website builds. For HTML/CSS optimizing purposes, check out HTML Tidy and CSSTidy.
Put care and attention into your code. Lay it out so that it’s easy to read, update and manage.
These days, open source Ajax/web development frameworks such as jQuery and MooTools can speed up code-authoring and ensure fewer headaches due to cross-browser issues. If you suspect these frameworks might help, why not investigate and learn about them?
Credits: Six Revision
These articles might be interesting for you as well: