Before we get to the good strategies, here are three things NOT to do.
To add information that needs to be indexed by search engines.
To fix things you are too lazy to fix in the source.
Primarily to make a site “cool”
Choosing a Good Framework (or Not)
A Framework May Make Maintenance Easier
Its pretty short-sighted to assume you will be the only one maintaining or editing your code down the road. Your business may grow, your clients may move to another developer, etc. Its due to the idea of group editing that I suggest the use of a solid Framework. If you use a framework, and use it correctly (Doing it the “right way”), other people picking up your code should have an easier time finding out what is going on.
Know When To Avoid Using a Framework
Fixing Element Jumps
Use Special CSS Classes
Start Editing Earlier
Use Firebug and console.log
In a tiny script, dropping in alert(’Here!’) might work OK. However, when doing anything larger, you will want to utilize the Firebug console for testing and debugging. Use it to output values and objects, and even DOM objects. It will often provide quick insight and let you solve problems faster.
Don’t forget to remove console.log Statements
If you use Firebug, be sure to remove console.log statements, or provide another way to avoid missing method errors. This one has caught me so many times: It works on my computer, but not on the client’s computer. We are both using Firefox. To add to the confusion, the site functions fine in Safari too. What is wrong !!? Ah! It’s the remaining console.log statements I used for debugging! Safari will often just skip the statements without complaining much, so BE SURE to search for “console.log” and remove the statements before deploying (or showing a comp to the client).