What Is HTML: A Detailed Explanation of the Programming Language

https://www.geeksforgeeks.org/html-introduction/

Table of content

1. Introduction
2. What is HTML?
3. HTML Versions
4. HTML Tags
5. HTML Elements
6. HTML Attributes
7. HTML Basic Structure
8. Features
9. Advantages
10. Disadvantages
11. Conclusion

INTRODUCTION

HTML is known as the programming language that deals with the structuring of websites. But is this the only function performed by HTML in website development? Definitely not. So while this factor is true about HTML, the language is much more than a foundational creation language. In this article, I'll share a detailed explanation of HTML. So, dive in to gain more knowledge about the programming language.

What is HTML?

HTML is a standard markup language that is used for creating and structuring web pages and web applications. HTML is an acronym for HyperText Markup Language. To further understand HTML, let's look at the meaning of the words that make it up.

Hypertext refers to the text that contains links to other documents or resources on a web page.

Markup language refers to the system of defining the text documents within the tag, which defines the structure of the web page. The language uses tags to provide instructions to web browsers on how to display the content, whether it should be formatted as headings, paragraphs, lists, links, images, and more. In essence, markup is a way to define the elements and structure of a web page.

HTML Versions

HTML has a rich history that dates back to the early days of the World Wide Web. The markup language was conceived by Tim Berners-Lee, a British computer scientist at CERN (the European Organization for Nuclear Research), in 1989. The first proposal for HTML was published in 1990. It was initially a simple markup language designed to facilitate the sharing of scientific documents among researchers. Since then, the HTML language has evolved. Now, let's look at the evolution of HTML.

• HTML 1.0: In 1993, the first official HTML specification, known as HTML 1.0, was published. It comprises basic elements for text formatting, lists, links, and images.
• HTML 2.0: This next version of HTML was released in 1995, and it saw wider adoption as the internet began to grow. HTML 2.0 introduced support for extra features such as form-based file upload and form elements such as text boxes, option buttons, etc.
• HTML 3.2: Introduced by the W3C in early 1997, HTML 3.2 provides tables for layout and improved support for forms and scripts. It also introduced added features like mathematical equations, making it possible to support web pages with complex mathematical equations.
• HTML 4.01: This version was released in December 1999, and it was a significant step in the evolution of HTML. HTML 4.01 brought more features for web developers, including style sheets (CSS), scripting support, and better forms.
• HTML 5: HTML5 is the newest version of HyperText Markup Language, and it marked a major milestone in the history of HTML. The first version of it was released in January 2008. It introduced numerous new elements, including multimedia support (audio and video) and native form validation. HTML5 also emphasizes semantics, making it easier to structure web content. Examples of such semantic tags are <article> <footer> and <header>. It is developed by two major organizations, the W3C (World Wide Web Consortium) and the WHATWG (Web Hypertext Application Technology Working Group). HTML 5 was standardized in 2014 and is still under development.

HTML tags.

The fundamental function of HTML is to structure the web page and the content on it, and with this, every developer will want the texts, images, etc. to appear in a certain way. The HTML tags are in charge of this functionality. Different tags are available for different purposes, such as creating headings, subheadings, paragraphs, bolded text, italicized text, etc.

These are examples of tags for:

• paragraph <p></p>
• heading that ranges from <h1> to <h6>
• list which comes in different variations; <ol> for ordered list, <ul> for unordered list, and <li> to enclose each list item, etc.

HTML Elements

Elements are made up of tags and the content they enclose. An element consists of an opening tag, content, and a closing tag. However, there are some elements that don't have a closing tag but rather include a source or link to the content you want to embed on the webpage. These are called empty elements.

For example:

• <p>This is a paragraph element with opening and closing tag</p>
• <a href="https://example.com/Click me!</a> A hyperlink.
• <img src="hikmah'sportfolio.jpg" Alt="Image of a book" /> This is an example of an empty element.

HTML Attributes

Attributes provide additional information about an element. They are always specified within the opening tag of an element and range from styles to classes to IDs. They consist of a name and a value, which provide extra information or settings about an element, thereby helping you to style it or enhance its behavior in CSS and JavaScript, respectively.

For example:

• <p class="paragraph-one">This is an element with a class attribute</p>
• <h4 id="city-name" This is an element with an id attribute </h4>

You might be wondering if there is no difference between a class and an id but there is. Only one element can have an id, which makes it stress-free to select in CSS or JavaScript. But several elements can have the same class, causing problems when it comes to usage in CSS and JavaScript.

HTML Basic Structure

1. The <!DOCTYPE html>element indicates that the code is using HTML5. Meanwhile, before the introduction of HTML5, you had to state the version of HTML you were using with the <!DOCTYPE> declaration. For example, HTML 3.2 or 4.01. But with HTML5, there’s no need for that anymore, as the browser will automatically detect that you’re using HTML 5.
2. The <html></html> element is the root element of an HTML page. It contains every other element in the code.
3. <head></head> element is one of the core elements that make up a webpage. It contains the meta description, page title, and stylesheet, among others. Web crawlers get important information about a website by checking this element.
4. The <meta /> element provides important information about the page, including character encoding, usually UTF-8, authorship, keywords, responsiveness, and descriptions. Search engines use this metadata to understand and index the content of the page, which can affect search engine rankings.
5. The <title></title> element defines the title of the web page, which appears in the browser's title bar or tab. It's also used as the default name when a user bookmarks the page.
6. The <body></body>element defines the main content area of a web page. It encompasses the actual webpage content.

Features of HTML

• It is a markup language.
• It is the foundation of every web page.
• Its learning and implementation are easy.
• With it, images, videos, and audio can be embedded into a webpage.

Advantages of HTML

• It is compatible with backend languages such as PHP and Node.js.
• It is used to create websites.
• Its functionality can be enhanced with CSS and JavaScript.
• It is open-source and completely free to use.
• It is widely used, with plenty of resources on it available.

Disadvantages of HTML

• It lacks dynamic functionalities, making it suitable for only creating static websites.
• It may render differently in various web browsers.
• The security feature is vulnerable to malicious attacks.

Conclusion

HTML is the foremost language when it comes to website development. It's a simple markup language used for building websites. But it lacks aesthetics and functionality, which is where CSS and JavaScript come in, respectively. Since the year it was introduced, HTML has undergone several development phases and is currently in phase 5, i.e., HTML5. It comprises tags, elements, attributes, and semantics, which all make the language more efficient than it was years ago.

An interesting read? Give it a clap and comment your thoughts.