HTML5 tutorial - HTML is neither like print or math

It's not like print.
Tangent GalvanometerIn print both text and images are embedded into paper as colored dots. On the web images and text are handled differently.
Images are sent as discrete files over the net to be displayed as illuminated color pixels on your monitor. Text is displayed as text.
The image to the right is a file named "tangent-galvanometer.gif". This page, an HTML file named "what-its-not.htm", requested that tangent-galvanometer.gif be sent from my server to your computer. Next it was positioned on the screen and this text wrapped around it.
Why not simply define the color of each and every pixel and have the page uploaded as one big image? There are two reasons:
  1. Webpages would be too big – they would take too long to download.
  2. The spiders, such as Googlebot, would not be able to read them. The words "Tangent Galvanometer" in the picture on the right is embedded in the image and therefore invisible to the spiders.
On the other hand this line of text is visible to the spiders* and has been entered into the search engine databases.
Those of you coming to web design from having worked in print will find web design quite different – not impossibly so, but it is different.
It's not like math.
HTML 5 is no new Geometry. There is an order and logic to math that computer science aspires to but can not match.
In the last couple of decades some smart people made – and continue to make – HTML from scratch. On the whole they have done a good job. HTML 5 is certainly better than HTML 2, 3 or 4, but it is flawed and those flaws tend to raise their ugly heads at the most exasperating moments. Be prepared.
There will be times when you ask: "What idiot thought this up?". That idiot is probably alive and well – and making millions in Silicon Valley. However you can take some small comfort in the fact that your irritation might well be warranted.
Do not expect the elegant perfection of Euclid's Geometry and you will not be disappointed.

So let's get to some code.

Spider or Web crawler

A Web crawler is a computer program that browses the World Wide Web in a methodical, automated manner.


The search bot software used by Google, which collects documents from the web to build a searchable index for the Google search engine.
wikipedia · google

* This link should take you to It will open in a new window.