This site will look much better in a browser that supports web standards, but it is accessible to any browser or Internet device.

John McSweeney - picture detail

John McSweeney

May 10, 2008, 12:27 am

Website Design

Introduction to Hypertext Markup Language

 

The Web is littered with resources devoted to the subject of Hypertext Markup Language and with time I will probably add a few more pages. Although it is possible to create a site with a WYSIWYG authoring tool like Dreamweaver and know nothing about HTML, anyone contemplating building a website should learn something about the subject. DW removes a lot of the drudge from web development, but at some stage an ability to open up and read the source markup will pay dividends.

I created my first website using just four pieces of software. Windows Notepad for writing HTML, Photoshop for creating images, Internet Explorer to view my pages and a small FTP program to upload my files to a server. It was slow, laborious and prone to error, but writing HTML by hand is, I believe, the best way to learn the syntax of the language.

I used to think that HTML concerned itself solely with the display of web pages, which was mistaken. However, anyone who has attempted to control the layout of a page with HTML quickly discovers that this is all but impossible. Designers have created and adopted all kinds of clever tricks to get a piece of text or an image to sit precisely where they want on a page. HTML was not created to control the look of a page, it was designed to mark up the structure of a page.

These two aspects, structure and display, highlight a fundamental difference in approach to web development. When Tim Berners-Lee developed the notion of making documents available over networked computers, he and a colleague created both a markup language and a browser to view those documents.

Standard Generalized Markup Language (SGML) was already well established as a means of creating complex documents in such fields as aviation and genetics, but its complexity made it unsuitable for the transmission of documents over networks. By using aspects of the SGML syntax, a simpler markup, HTML, was developed to tag certain elements within a document eg. body, title, heading, paragraph, list etc. The browser was programmed to parse the HTML file and display the document accordingly. Legend has it that young Tim was none too pleased when the developers of the Mosaic browser, soon to become Netscape, invented the image tag. This was the first shot across the bows in the war between the HTML purists and the young hotshots that would lead the Web into its present state. That state, it is safe to say, is a bit of a mess.

Soon the two factions, who by now included the likes of Microsoft, realised that some accommodation was required. So, like competing railroad companies who finally settle on the same gauge track, all the parties, in the guise of the W3C, have attempted to write standards for the Web and, more importantly, actually try to implement some of them. There is no doubt that HTML with all its attendant baggage has been hugely successful, but there lies the crux of the problem. For whatever the purists may wish to think, the commercial arm of the Web industry is faced with a legacy problem. If Microsoft was to develop a browser that could only read HTML as defined within the strict definition of XHTML, more of this later, nearly every page on the Web would be rendered obsolete. Microsoft of course will do no such thing. There is going to be a lot of rubbish hanging around in cyberspace for many a year whilst Web developers slowly grow to realise that structuring their pages within tightly controlled confines is in fact going to pay huge dividends. So it's going to be a very slow process and naturally there is no guarantee that any of this will happen.

Designers are being persuaded, ever so gently, that the job of page layout can be left to CSS stylesheets. The job of XHTML will be to structure documents. This site has been constructed with one eye firmly on this goal and the other looking occasionally in a backwards direction. The next few pages will explain a few HTML basics

Next page » Basic HTML

Previous page « Gifs and JPEGS