HTML Basics


  1. What is HTML?
  2. Different HTML Versions
  3. HTML principles
  4. Basic Structure
  5. Closing your tags
  6. UPPERCASE or lowercase?

What is HTML?

HTML stands for Hyper Text Markup Language.


What HTML really means?


Different HTML Versions

HTML 1.0

The original version of HTML. Very limited features limiting what could be done in web pages design.

HTML 2.0

Included all the features of HTML 1.0 plus several new design features. It was the standard in web page design until January, 1997.

HTML 3.0

The HTML 3.0 draft included many new and useful enhancements to HTML. However, most browsers only implemented a few elements from this draft. HTML 3.0 is now an expired draft.

HTML 3.2

The more browser-specific tags were introduced, the more became obvious that a new standard was needed. For this reason, the Word Wide Web Consortium (W3C), founded in 1994 to develop common standards for the evolution of the World Wide Web, drafted the WILBUR standard, which later became known as HTML 3.2. It captures the recommended practice as of early 1996 and became the official standard in January, 1997. Most, if not all, popular browsers in use today fully support HTML 3.2.

HTML 4.0

In the early days, HTML 4.0 was code-named COUGAR. This version introduces new functionality, most of which comes from the expired HTML 3.0 draft. This version became a recommendation in December, 1997, a standard as of April, 1998, and becomes the HTML 4.01 Specification in December, 1999.


XHTML 1.0

XHTML stands for EXtensible Hyper Text Markup Language.

While HTML is a subset of Standard Generalized Markup Language (SGML), a very flexible markup language framework. XHTML is an application of XML, a more restrictive subset of SGML. XHTML 1.0 is considered the version of HTML after HTML 4.

XHTML 1.0 was published as a recommendation in January, 2000.

XHTML 1.0 is the result of the hard working World Wide Web Consortium (the W3C) to bring some sort of standard to provide rich high quality web pages through these varied devices, like cell/mobile phones, plus a host of hand-held wireless devices and communicators. These devices will not necessary have the computing power of a desktop or notebook computer and so will not be able to accommodate poor or sloppy coding practices. XHTML is designed to address these technologies. XHTML also begins to address the need for those with disabilities (such as the blind and visually impaired) to access the internet. Thus web pages written in XHTML will allow them to be viewed on a wide range of browsers and internet platforms.

It is not bringing a lot of new tags. In the current XHTML 1.0 Recommendation document, revised to August 2002, the W3C commented that, "The XHTML family is the next step in the evolution of the Internet. By migrating to XHTML today, content developers can enter the XML world with all of its attendant benefits, while still remaining confident in their content's backward and future compatibility."

XHTML 1.1

XHTML 1.1 - Module-based XHTML was published in May 2001. It defines a new XHTML document type that is based upon the module framework and modules defined in Modularization of XHTML. The purpose of this document type is to serve as the basis for future extended XHTML 'family' document types, and to provide a consistent, forward-looking document type cleanly separated from the deprecated, legacy functionality of HTML 4.


HTML 5

In 2004, the Web Hyper text Application Technology Working Group (WHATWG) formed, independently of the W3C, to work on advancing ordinary HTML not based on XHTML. Most major browser vendors were unwilling to implement the features in new W3C XHTML drafts, and felt that they didn't serve the needs of modern web development. The WHATWG eventually began working on a standard that supported both XML and non-XML serializations, HTML 5, in parallel to W3C standards such as XHTML 2.

In 2007, the W3C's HTML working group voted to officially recognize HTML 5 and work on it as the next-generation HTML standard.

In 2009, the W3C allowed the XHTML 2 Working Group's charter to expire, acknowledging that HTML 5 would be the sole next-generation HTML standard, including both XML and non-XML serializations.


Which version should you use?

You may start your studies using the HTML 4.01 Specification in Transitional mode, it will let you try most of the HTML World.

And as soon as possible, you should give HTML 5 Specification a try.


HTML principles

Hyper Text Markup Language, is a markup language used to create web pages.

The web developer uses "HTML tags" to format different parts of the document.

HTML tags are used to specify headings, paragraphs, lists, tables, images and much more.

HTML tags are identified by the symbols: < and >

To make your web pages compatible with any of the HTML / XHTML specification, you need to add a document type declaration (DTD) before the HTML element.

HTML 4.01 Transitional

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
      "http://www.w3.org/TR/html4/loose.dtd">
      <html lang="en">
      

XHTML 1.0 Strict

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
      <html lang="en">
      

You can get the W3C Recommended list of Doc type declarations.

In the header there are information that will not be show on the screen such as the document title, which fits
between the tags <title> and </title>

The body contains information that will be presented (text, images, songs, etc.) on the screen.


Basic Structure

So, the basic structure for an HTML 4.01 Transitional document will be:

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
      "http://www.w3.org/TR/html4/loose.dtd">
      <html lang="en">
      
      <html>
      
        <head>
          <title>Page Title</title>
        </head>
      
        <body>
      
          <p>Hi Folks!</p>
          <p>From this point on will be the <strong>information</strong>
          to be presented and related tags.</p>
          <p>These tags will be used by the browser to identify the 
          <em>type of the information</em> or the style defined by the designer.</p>
        </body>
      
      </html>
      

The tags used on the document's body will establish if the text would be presented bold, italics, centered, etc.

If the information is not text, they will indicate the kind of information: a link, an image a song.


Closing your tags

All of these tags works in pairs with opening and closing syntax.

There are a few exceptions to this rule (none on XHTML).

Closing tag contains a forward slash (/) after the <.

This tells the browser that this tag closes the previous opening counterpart.


UPPERCASE or lowercase?

Although most browsers will display your page regardless of the case, you should always code in lowercase.

This helps keep your code XHTML compliant.

Therefore... Good: <head>
Bad: <HEAD>