Simple introduction to HTML

HTML is a markup language for expressing the structure of documents published on the World Wide Web. The display arrangements were originally under the control of the browsers’ implicit built-in style sheet. Subsequent versions of HTML started incorporating display instructions into the markup languages but these have now been taken back out of HTML and more appropriately put into Cascading Style Sheets (CSS). What started off as a very simple, efficient markup language has now become a rich, multimedia publishing language.

However, the fundamentals of HTML are still very simple and can be understood by anyone after an hour or two. It is also this simplicity which has led to the incorrectly marked-up HTML documents that are found on many websites.

Below is a simple HTML page. The document structure shows a collection of markup tags each contained within angle brackets (< >). Anything inside these brackets is an instruction to the browser that reads and interprets them, but does not display them on screen.

HTML markup tags are usually combined in pairs, for example that indicate the start and end of an HTML element, the document title element in the case of this example. Note, however, that some elements do not enclose text and do not have a closing counterpart tag.

An HTML page should always contain correctly nested html, head, title and body elements. The start and end of each element is indicated in the markup by the opening and closing tags. The example below shows the structure that should be used in all pages. The opening html tag is the first to appear and is consequently the last to be closed. Everything included within this element is recognised as HTML.

In this example, the head element serves only to contain the title element. The content of the title element will be displayed in the Web browser’s window title bar.

The opening tag is next. Whatever is contained within the body element will appear in the user’s web browser window. If any of these fundamental elements are placed in the wrong order, or not used at all, an author cannot guarantee that the page will render correctly.

In this example, the word ‘hello’ has been emboldened by using the strong markup element. This is another example of an element that has opening and closing tags. The element is closed by repeating the opening tag name prefaced with a forward slash, ie Hello.