Have you always been interested in learning HTML but didn't know where or how to start? Well, this guide is for you.
In it, we will look at:
- An introduction to HTML
- A Brief History of HTML
- Why Learn HTML?
- Prerequisites for learning HTML
- A simple HTML page
- How to get started with HTML
Introduction to HTML
HTML is an abbreviation for HyperText Markup Language.
This acronym is composed of two main parts: HyperText and Markup Language.
What does “HyperText” mean?
HyperText refers to the hyperlinks or simply links that an HTML page may contain. A HyperText can contain a link to a website, web content, or a web page.
What is a “Markup language”?
A markup language is a computer language that consists of easily understood keywords, names, or tags that help format the overall view of a page and the data it contains. In other words, it refers to the way tags are used to define the page layout and elements within the page.
Since we now know what HyperText and Markup Language mean, we can also understand what these terms mean when put together.
What is HTML?
HTML or HyperText Markup Language is a markup language used to describe the structure of a web page. It uses a special syntax or notation to organize and give information about the page to the browser.
HTML consists of a series of elements that tell the browser how to display the content. These elements label pieces of content such as "this is a heading", "this is a paragraph", "this is a link", and so on. They usually have opening and closing tags that surround and give meaning to each piece of content.
There are different tag options you can use to wrap text to show whether the text is a heading, a paragraph, or a list. Tags look like <h1> (opening tag) and </h1> (closing tag).
Let's see some other examples:
<h1> This is for the top level heading; and in most cases it is a page title</h1>
<p>A paragraph. This is where the information we would like to communicate to the viewer goes. This can be as long or short as we would like. Note: A paragraph always starts on a new line, and browsers automatically add a single blank space (or line) before and after a paragraph.</p>
<ol>
<li>Here goes the first item</li>
<li>Here goes the second item</li>
<li>Here goes the third item</li>
</ol> A Brief History of HTML
The first version of HTML was written in 1993; since then, many different versions of HTML have been released, allowing developers to create interactive web pages with animated images, sound, and gimmicks of all kinds.
The most widely used version throughout the 2000's was HTML 4.01, which became an official standard in December 1999.
Another version, XHTML, was a rewrite of HTML as an XML language.
In 2014, HTML5 was released, and it took over from previous versions of HTML. This version includes new elements and capabilities added to the language. These new features allow you to create more powerful and complex websites and web apps, while keeping the code easier to read.
Why Learn HTML?
HTML is the foundation of all web pages. Without HTML, you would not be able to organize text or add images or videos to your web pages. HTML is the root of everything you need to know to create great-looking web pages!
As the name suggests, hypertext refers to cross-referencing (or linking) between different related sections or webpages on the world-wide-web.
HyperText mark-up language is a standard mark-up language that allows developers to structure, link, and present webpages on the world-wide-web. So it is important to know the structure and layout of the website that you would like to build.
Prerequisites for Learning HTML
HTML is a relatively easy language and does not require any formal education. So basically, there are no prerequisites for learning it.
HTML is text-based computer coding, and anyone can learn and run it, as long as they understand letters and basic symbols. So, all you need is basic computer knowledge and the ability to work with files.
Of course, any knowledge of other programming languages will enhance your abilities with HTML and web development, but this is not a prerequisite for learning HMTL.
What a Simple HTML Page Looks Like
<!DOCTYPE html>
<html>
<head>
<title> Patrick Cyubahiro </title>
</head>
<body>
<h1>This is my First Heading</h1>
<p>This is my first paragraph.</p>
</body>
</html>Alright let's see what's going on here:
The <!DOCTYPE html> declaration indicates that this document is an HTML5 document.
The <html> element is the root element of an HTML page.
The <head> element contains meta information about the HTML page.
The <title> element specifies a title for the HTML page (which is shown in the browser's title bar or in the page's tab).
The <body> element defines the document's body and is a container for all the visible contents, such as headings, paragraphs, images, hyperlinks, tables, lists, etc.
The <h1> element defines a large heading.
The <p> element defines a paragraph. Note: In HTML, an opening tag begins a section of page content, and a closing tag ends it.
For example, to markup a section of text as a paragraph, you would open the paragraph with an opening paragraph tag, which is "<p>", and close it with a closing paragraph tag, which is "</p>".
In closing tags, the element is always preceded by a forward slash ("/").
How to Get Started with HTML
There are many different online resources that can help you learn HTML. I recommend the following ones:
- freeCodecamp: an interactive and free learning platform that aims to make learning web development possible for anyone. This platform has well-structured content, good exercises to help you grasp the concept, and a supportive community that can help you in case of any difficulties during the course.
- W3Schools: a learning platform that covers all the aspects of web development. It explains HTML tags in a very understandable and in-depth way, which also makes it easier to learn how to use them well.
Conclusion
Learning some of the basics of HTML may not take much time for some people. But getting really good at HTML, like any skill, definitely takes time. You might be able to grasp the basic HTML tags in a few hours, but make sure to take the time to learn how to properly work with them.
My name is Patrick Cyubahiro, I am a software & web developer, UI/UX designer, technical writer, and Community Builder.
I hope you enjoyed reading this article; and if it was helpful to you, feel free to let me know on Twitter: @Pat_Cyubahiro or via email: ampatrickcyubahiro[at]gmail.com
Thanks for reading and happy learning!