JavaScript Best Practices.

As a developer, I’ve always made it common practice to ensure a website is at least functional without JavaScript. I could go on a rant on why I believe this is important and a good programming approach, but much of that reasoning would be fairly obvious and/or mostly opinion-based. Many developers have differing viewpoints on this subject, but one thing we can almost all agree on is that a site’s content should be accessible on the screen before any client-side scripts have run.

Progressive Enhancement.

Since Google and other search engines index your site as-is, JavaScript-generated content can’t be relied on for SEO. The concept referred to as progressive enhancement does a great job in explaining this: by definition, progressive enhancement is a strategy for web design that emphasizes accessibility, semantic HTML markup, and external stylesheet and scripting technologies. Progressive enhancement uses web technologies in a layered fashion that allows everyone to access the basic content and functionality of a web page, using any browser or Internet connection, while also providing an enhanced version of the page to those with more advanced browser software or greater bandwidth.

That Being Said.

JavaScript certainly has its place in modern web development; it can add that extra “umph” to make your company or brand stand out, and when used properly, it can tremendously enhance the overall user experience. If you decide to (and perhaps you should) use JavaScript to enhance your website, there are a few guidelines that I like to consider in doing so:

  • Before relying on JavaScript, be sure your website has well-structured, bot-readable HTML to present all relevant content (i.e. forms should submit, links should contain valid hrefs, content should be accessible, etc).
  • Style your site with CSS before introducing client-side scripts.
  • Introduce JavaScript as the final layer. JavaScript and AJAX are great for enhancing the overall user experience.
  • Ask yourself:  “Is this possible without JavaScript?
  • Last, but far from least important, JavaScript should never be used to protect or access private or sensitive data. (“If it’s easy to write, it’s easy to crack.”)

In Conclusion.

Websites that completely rely on JavaScript can be some of the most impressive and engaging spots on the web. Web applications don’t need to be SEO-friendly, or they are geared toward modern JavaScript-enabled. In these cases, progressive enhancement is not nearly as important. Nonetheless, it’s important to understand the potential consequences and downsides of each approach. To quote Nick Pettit in his blog post, “The web is not for anyone, it’s for everyone.”

Guest Written by Benjamin Wagner