To start developing HTML we first need an HTML editor. I will be using Dreamweaver for
this tutorial, but any regular text editor will do. Either way, we first start off by
creating an empty web document, which is a plain text file with an html file extension.
The HTML part of every website starts and ends with the tag. This element tells
the browser that the document contains HTML. Inside the element we find two sections,
and , which in turn can contain header and body tags. The header gives information
about the document - most importantly we have the page element - and the body is
the displayed content of the page. These four elements - , , , and
- are required on every webpage.
With our document template now complete we can take look at the file with a browser.
In Firefox for example, we can see that the page title has appeared on the title bar,
and the content of the body is shown on the page. Although the browser has rendered the
markup tags to display the page we can still look at the original source markup using the
“View Source” function on the browser. To be able to show the rendered page along
with the source code I will for the most part use Dreamweaver’s built in browser (F5 to
refresh). Another powerful feature of Dreamweaver are code hints (Ctrl+Space), which gives us
suggestions when typing tags, attributes, and values. With this as a base we can now
go on and explore the various elements of HTML.