On the internet, every last byte counts. Web developers tend to spoil themselves with high bandwidth connections, obscuring but never negating a central fact: the less information you send, the faster a page will appear.
A Language Supremely Tolerant Of Compaction
There are a few development practices you can employ that will help achieve the best final minified result, steps that even HTML optimization tools won’t take: an HTML5 document can take a surprising amount of shortcuts. In practice, the smallest valid HTML document would be:
<!doctype html> <html lang=en> <title>Title</title> <meta charset=utf-8> <p>Content
One potential downside to employing these shortcuts is that some IDEs, such as DreamWeaver, won’t apply correct syntax highlighting to minified code. Some developers also find that these shortcuts reduce readability, although I find that it’s mostly a case of retraining your eye.
Once your code is complete, it can be made even smaller. At the very least, carriage returns can be removed, together with comments, extra spaces, and redundant closing tags:
<!doctype html><html lang=en><title>Title</title><meta charset=utf-8><p>Content
(More information on making minification techniques part of your HTML5 development workflow).
However, doing this by hand is a waste of time: it’s much more efficient to use a scriptable drag-and-drop app, such as Smaller, or free online tools such as TextFixer and HTMLCompressor.
The Black Hole Of Minification
Enjoy this piece? I invite you to follow me at twitter.com/dudleystorey to learn more.