HTML BRIEF HISTORY AND STRUCTURE

 

In this article, you will learn the following: what is HTML?, who created HTML?, how many versions of HTML?, use of HTML, and the significant improvement of HTML.

First things first, before we talk about who created HTML, allow me to explain the meaning of HTML.

What is HTML?

HTML is the short form of HyperText Markup Language, and it is not a programming language as many people think. It is a typical language for web page development.

Its features give the ability to create and structure web page by structuring sections, paragraphs and more using its elements.

Continue reading. I will explain what is HTML elements and their attributes later.

The following are the most common uses of HTML:

Web development: using HTML structured elements, web developers can use HTML to code how web pages appear on the web browser.

Internet navigation: using HTML ability to embed links, it is always easy to navigate and share links between related web pages.

Web documentation: we format and organize documents similarly to application programs such as Microsoft Word we can do similarly with HTML.

Now, let us take one step back and discuss who created this HyperText Markup Language – (HTML)

 

Who created HTML?

Sir Tim Berners-Lee is the person behind the scene. He is the one who created the first version of HTML in 1993. From that on, there are many versions of HTML with some more added and deprecated features.

Here, there is some confusion I would like to clarify. You might hear that; Sir Tim Berners-Lee created the first version of HTML in 1991 and not 1993. First HTML version created in 1993 because that is the year it was officially released with the only intention to share web information that can be accessible through web browsers everywhere.

During that time few developers involved in creation and designing of websites. So the first version of HTML was not popular and not growing as expected.

Then someone had experience with online documentation tools and formal systems known as Dan Connolly thought about adding more features and usability of the language. As a result he came out with a new draft of the language in April 1994.

Muldrow contributed by revamping and rewritten the initial draft of Dan Connolly by July 1994 Karen.

Therefore, Dan Connolly and Karen Olson Muldrow collaborated to rewrite the HTML specification in the same year.

The road to perfection was a little tense. After a little while, the HTML working group took their term to edit the document as a whole, and the updates made by the following guys;

  • Eric Schieler,
  • Mike Knezovich,
  • Eric W. Sink at Spyglass Inc.

At the end of the road to perfection, Roy Fielding did the final part to reconstruct the draft into its current form.

Long way right?” 

 

How many versions of HTML?

 In the previous section of this article, we only discussed about the first draft of HTML and all the editing and upgrades, now let us list down all different versions of HTML, the timeline and its features.

1991 – Tim Berners-Lee created HTML 1.0 (was not released).

1993: First release of HTML for developers. As we discussed earlier, during that time there were not many developers involved in creating websites. So, the language was not growing. This version had just few basic tags, you can just imagine even tables and fonts were not among the available tags.

Nov 24, 1995 – HTML 2.0 was published with a lot new features plus old features of HTML 1.0 were inherited. Here, is where HTML started to gain its popularity and became the standard markup language for building websites. Even though, this version was not most widely used compared to later versions.

January 14, 1997 - In this year the HTML 3.2 was published as W2C recommendation. In their press release, they said that in responding to the current request for an update of the specification of the Hypertext Markup Language (HTML), they endorsed the HTML 3.2 specification as their recommendation, meaning as a W3C Recommendation.

The main indications of the recommendation is the stability of the specification, so that it can be utilized in its full potential in the web.

 The best part about this recommendation is that all members of W3C reviewed the specification. Also, this version provided a good support for form elements, and CSS.

1999 - Another W3C Recommendation published on December 14, 1999 which is HTML 4.01. Do you remember when I told you that in the HTML 2.0 which was published on Nov 24, 1995 made HTML to start gain its popularity, however, it was not most widely used compared to Later versions?

Now, this version of HTML 4.01 which was published on December 14, 1999 was the most successful version compared to all previous versions of HTML.

HTML 4.01, included a lot of new features including multimedia, and scripting. After publishing this successful version of HTML, W3C thought of publishing an extended version of HTML, so their focus was busy building the XHTML, and that is why it took sometime to release newer version of HTML.

2014 – On 28th, of October 2014, HTML 5 was released as another W3C recommendation. This new release came out with a lot more new features such as<header><footer><main><video>, etc.

This version also support mathML which describing mathematical notation and capturing both structure and content which makes mathematics to be processed on the web for text

Another added feature is SVG (Scalable Vector Graphics) which defines the graphics those are vector-based for web. The good thing about this feature is that all elements and attributes related to SVG can be animated.

As I am writing this article the HTML 5 is the latest version.

As we have gone through all versions of HTML, lets turn around and see how was HTML used before these significant improvement to the road of perfection.

 

How was HTML used?

The original intention of the uses of HTML is the distribution of simple structured contents while the main beneficiaries being authors who were scientists with 7- or 8-bit character sets of HTML files.

In fact, HTML was based on SGML (Standard Generalized Mark-up Language) with aim of arranging and marking up text to be into arranged structural units such as paragraphs, headings, list items and so on.

As we have discussed in this article, we have seen that now, W3C has done a big job in contributing to the language as now it is full utilized in web developments with a lot of extended features.

I remember, I told you to continue reading and I will explain later about HTML elements. Now, lets talk a lit bit about HTML structure which will include the definition of HTML elements.




HTML structure

HTML is structured in a form of elements and tags. All web pages you see, is a series of HTML elements which includes HTML tags and attributes.

What is the difference between HTML elements and HTML tags?

HTML element is a property of HTML document that is used to tell the browser how the content inside the HTML document is structured with all formatting instruction and semantic meaning.

This means the content inside the header of the HTML document will have a specific element to tell browser that “this is a header”, or if it is a paragraph inside the HTML document the HTML element will enclose the text inside the HTML element which semantically will tell browser “this is a paragraph”.

Basically, the content stays between the opening HTML element and closing HTML element.

See an example of paragraph element below:

<p>This is paragraph element</p>

As you can see paragraph element has opening and closing element (opening and closing tags). Now, to make it clear, tags has only opening and closing bracket < >.

So, element is the combination of opening and closing tags. So, if the element has only one tag (with opening and closing bracket) that is known as tag and not an element.

Back to our example above, the paragraph element has an opening tag and closing tag, that is element.

See another example below:

<img>

The example above shows the image tag. It only have an opening < and closing > bracket. That is known as “img” tag, or image.

Browser read the HTML document from top to bottom. Element and tags positions are arranged by their names.

See an example below:

<head> </head> element defines the header of the HTML web document.

<title></title> element defines the tittle of the HTML web document.

<img> tag defines the inserted image wihin HTML web document.

<body> </body> elements defines the content within the body of HTML web document.

Within opening tag of an element or single tag, we can define any value according to the attribute we declared.

See two examples of attributes below:

 <img src="https://picture.com/photo/2023/html.jpg" alt="html alt attribute"/>

 <p class="className" id="idName">This is an Element</p>

In our example above we have used <img> tag and we have used src attribute to define the image source as the value of an attribute, and we have also used alt attribute to define the alternative text which is related with our inserted image.

In the second example, we have used <p> element and we defined class attributes with its value and id attribute with its value too.

Value is always related to the attribute that is the reason we use equal operator. It is not mandatory to use two attributes as shown in our examples above. You ca use just one, two or three, that will always depend on your needs and arrangements.

Below is an example of a structure of HTML web document:

 <!doctype html>

<html lang="en">

<head>

<title></title>

<style></style>

<script></script>

</head>

<body>

<!-- Main Contents will be displayed Here -->

</body>

</html>

 

A brief explanation of the structure of HTML web document is here:

Every modern HTML web document has <!doctype html> element as a first line of code to instruct the web browser about the version of HTML the page has written in.

Another HTML element is a starting and closing <HTML> tag placed after <!doctype> element to mark the start and end of a web page.

The <head> element specifies the header of a web page. The <head> element contains a start and a close tag to mark the starting and end of the web page header.

Also inside the <head> element, there are other elements such as <title> element specify the web page title; <style> element used to define the style used in a web page; as well as the <script> element with functionality to define scripts such as javascript used in the web page. On the other hand, there are no problems if you don't know the style element and script elements. I will explain everything you need about style and script elements in the coming articles.

The <body> element comprises all the main web page contents. The <body> contains other HTML elements like <div> element, <p> element <table> element and <form> element, and many more. In the coming articles, I will explain with examples of frequently used HTML elements and how you can use them to build a web page.

Conclusion

This article explained a brief history and structure of HTML web pages. The coming article will explain more about HTML elements using practical examples. Therefore we will start building a basic web page using HTML tags. I encourage you to read all the articles step by step to develop a nice-looking web page together.

Thanks for reading.



Post a Comment

0 Comments