Getting it up (2) - learning about HTML

Last time (Getting it up (1) – simple ways to start a web presence) we talked about easy ways to get a basic website online. If you want to go beyond basic, you need to learn a bit about html. Writing html documents is in no sense rocket science. But it's a bit like setting off fireworks: nothing to it, but things can go disatrously wrong for no obvious reason.

The best introductory book I've found - by miles- is this one:

If you're a teacher, you'll find their way of presenting information somewhere between thought-provoking and inspiring. I did, anyway.

Here's the link to the book at amazon.de: Head First HTML with CSS and XHTML.

And here's the link to amazon.co.uk, where it's a lot cheaper at the moment cos the pound is not very well: Why do I need to learn about html? And what's CSS?

When you call up a web page, the server at the website sends text to your browser, formatted as html. HTML is text with a few added comments inside pointy brackets. The comments are called "tags" and they look like "<h1>", "<p>", "<i>" etc., to tell the browser to format a bit of text as a main heading, a paragraph, or in italics. The killer tag is the "<a>" one, which marks a bit of text as a hyperlink to another page. Think about how it's changed your life, and agree with me that it's one of the towering achievements of the human intellect, right up there with moveable type and cricket. And it's British. (And hence currently under American control.)

So it's just text with tags, like this:

In that case, why is it so tricky?

The problem is: when you write, say, a Word document, you know pretty much how it's going to look for anyone who puts it on their screen or prints it out. But an internet server doesn't send a formatted html document: it sends the text with tags saying "this next bit is a heading /paragraph / list / table etc." or "put a border round this picture". Then the software (browser) on the computer of the person who called up your webpage puts it on the screen in the way that the software decides will look nicest. So an html page looks different on a PC, a MAC, a big desktop screen, a "beamer" projector, a laptop, a little netbook computer, a Blackberry, a mobile phone, your next television, Internet Explorer, Firefox, Safari, Opera ... Then people can resize their windows, resize the text in a window, and generally muck up your pages even if they look all right when they first arrive on their screens. And when you've written tidy pages that look nice on all current systems and browsers, somebody issues a new browser that scrambles them.

Things are sorting themselves out a bit. The current approach is to keep html for the structure of the text (headings, paragraphs, lists etc.) and put all the style things (fonts, colours, backgrounds, boxes etc.) is a separate file using a separate system: a "style sheet", which is the "SS" in "CSS" (the "C" is for "cascading", but isn't as cool as it sounds). This system sort of works. Mostly. Ish.

So the thing is, you'll never make web pages of any complexity if you don't understand at least a bit about what's going on. The book above is great for explaining this.

Next: the trouble with browsers, and the programs you can use ( and can't) to help you write html that works. Mostly.