Choosing and Using HTML

This course teaches HTML as its primary markup language because it is widely-used and easy to learn. Using HTML does not mean you cannot implement XHTML standards, like those we provide throughout the course.

These include:

  • Mandatory Structure - Elements like the !DOCTYPE declaration and <head> and <body> elements are required.
  • Properly Nested Tags - Tag order is maintained when nesting elements within other elements.
  • Closed Elements - Elements must always be closed, i.e. <p>...</p>. This includes empty elements, i.e. <br />.
  • Lowercase Elements and Attributes - All elements and their attributes must be lowercase, i.e., <body> not <BODY>.

Don’t worry if this doesn’t make much (or any) sense right now. Just know that we are teaching HTML with the intent that your sites work at the highest-performance possible without having to learn XHTML to its fullest.

HTML

The most widely-used markup language is HTML or HyperText Markup Language. Files ending in an .html file extension are HTML files, so a page.html is a text file written in HTML.

HTML is the standard markup language for creating web pages and web applications. Web browsers use HTML to interpret and compose text, images, and other material into visual or audible web pages.

HTML was first proposed in 1990 by Tim Berners-Lee, then a contract physicist at CERN.

Tim Berners-Lee

Berners-Lee (1955 - )

Elements and Tags

HTML elements are small blocks whose beginnings and endings are set by tags.

Elements

An HTML document is composed of a tree of HTML elements. An element is an individual component of an HTML document. Elements denote to the processor structure and semantic meaning of the document. Elements may also be nested or encapsulated within other elements.

HTML 
<p>This is a paragraph element.</p>
<p>This is another paragraph element.</p>

Compare this to Markdown:

Markdown 
This is a paragraph.

This is another paragraph.

Tags

Tags identify elements in a document. A tag is code that is syntactically unique from the text content of the document. In HTML, all tags include a less-than (<) and greater-than (>) sign, with the tag typed between the two.

General formula for an HTML element:

<tagname>...content...</tagname>

Most elements include an “opening” and “closing” tag that the processor uses to identify that element’s beginning and end. Closing tags are identical to opening tags, except that they contain a forward-slash (/) between the less-than (>) sign and the tag text.

HTML 
<p>This is a paragraph element.</p>
<p>This element is created with an opening "<p>" tag and a closing "</p>" tag. We call this "wrapping."</p>

Compare this to Markdown:

Markdown 
This is a paragraph.

In markdown, paragraphs require no extra markup to signify it as such. An empty line between text blocks represents a new paragraph.

html elements markdown paragraph tags