HTML Development 101 – A Tutorial Series

0

Welcome to the HTML tutorial series!  In this tutorial series we will be looking at Web Page development using the HTML4 language while covering some of the new HTML5 standard.  This will give you the basics of HTML programming from installing the required software, the basics coding and style associated with the HTML language, creating forms and frames, and to finally gathering all the knowledge into a completed web page.

We are going to begin with a brief history of HTML and how it has changed over the years.

The World Wide Web began at CERN, the European Laboratory for Particle Physics in Geneva, Switzerland. CERN is the meeting place for physicists from all over the world to participate in contemplation about atomic phenomena.  In 1989, Tim Berners-Lee was working in a computing  section of CERN when he came up with the concept for HyperText Markup Language.

Particle research involves collaboration between institutions situated all over the world, so Tim had the idea of enabling researchers in remote sites to organize and pool information together.  Instead of just storing the many research documents in one area, he also suggested the ability to link the text within the documents.  This would mean while reading a research paper, you could also display part of another paper that holds relevant text or diagrams.

Global hypertext links seemed feasible but it was a matter of finding the correct approach to implementing them.  Using an existing hypertext package was impractical because any hypertext tool to be used worldwide would have to take into account that many types of computers existed, many desktop publishing methods were in vogue, and Commercial hypertext packages were computer-specific and could not easily take text from other sources.

Tim demonstrated an attractive way of publishing text by developing his own software and his own simple protocol for retrieving other document text via hypertext links.  Tim’s own protocol, HTTP, stands for HyperText Transfer Protocol.  Tim’s hypertext was demonstrated on a NeXT workstation that provided the tools he needed to develop the first prototype.

HTML was strongly based on SGML, Standard Generalized Mark-up Language, an internationally agreed upon method for marking up text into structural units but SGML does not include the idea of using the anchor element with the HREF attribute, which was purely Tim’s invention.

In 1992, following electronic discussions with Tim over the WWW-talk mailing list, Dave Raggett from Hewlett-Packard’s Labs in Bristol, England visited Tim at CERN to further consider how HTML could be shaped into something more appropriate for mass consumption.  After returning to England, Dave resolutely composed a richer version of the original HTML and called it HTML+.

In April 1994, Dan Connolly created a new draft for HTML, he named HTML 2.0, which was soon rewritten in July by Karen Muldrow and presented at an IETF meeting in Toronto. This draft was to acquire common HTML practices for web browsers by June 1994.

A HTML Working Group was created to help move the process in the proper direction and the proposal stuck. The proposal was further refined into an Internet Draft.  In September 1995 the proposed became a standard. Most web browsers fully supported HTML 2.0 by the time it was ratified.

Tim’s HTML+ never actually became a reality but did evolve into HTML 3.0 which was backwards compatible with HTML 2.0.  The differences between HTML 3.0 and HTML 2.0 included additional capabilities such as tables, text flow around objects, and displaying complex math elements.  Many of the capabilities from HTML 3.0 are still commonly supported by most of the popular browsers.

In May 1996 at the World Wide Web conference the board announced HTML 3.2 with the code name of “Wilbur”.  HTML 3.2 was created with the goal to capture the common HTML capabilities in current browsers at the time of its creation.  It was a combination of features from HTML 2.0, HTML 3.0, and select elements and attributes that had been developed and implemented by browser vendors.

Before HTML 3.2 could be completed, the next version of HTML was already around the corner. In July 1996 an experimental Data Type Definition for HTML appeared quietly on the W3C web site code-named “Cougar”.  This DTD contained all the capabilities of HTML 3.2 and some additional ones. Many of the  capabilities that were in discussions by W3C were included in this DTD, such as Style Sheets, Scripting, Object element, and extensions to forms and tables.

In July, 1997 the W3C released the first public draft of HTML 4.0 that was essentially a more mature and official form of the Cougar. Along with the original features found in Cougar, many needed improvements such as recognition the syntax for frames that is in common use. HTML 4.0 was the first version to use Unicode as the base character set, allowing millions more characters to be displayed.

In 2008, the first draft of HTML 5.0 was published.  HTML 5.0 added the ability for web developers to change the effective URL to represent a change in application state without navigating away from a window context.

Now that we know the background of HTML, let’s make sure we have the required software to develop HTML ourselves.

First, we require a basic text editing program.  It can be anything from basic Notepad, Textpad, or even Visual Studio.  Textpad will be used as the text editor for the demos represented in this tutorial.

Next, we require a web browser that can support HTML5.  There are multiple browsers that accomplish this including: IE9, Firefox 3.5 and up, Google Chrome, and Safari 4.  Firefox will be used for the demo’s represented in this tutorial but feel free to choose your preferred browser.  Warning: Some styling/elements may be handled differently between browsers.

With the new understanding of HTML and it’s rich history, the differences between each version of HTML, and the required software installed to be able to program our own web page, we are ready for the next tutorial in the series. In the next part of the series we will learn about the basic elements of HTML and how to use them properly to design our first web page.

Information gathered from:
HTML Overview.  http://blooberry.com/indexdot/history/html.htm
Author: Brian Wilson

Share.

About Author

%d bloggers like this: