Coding Newbie

frontend, development, web-4342425.jpg

What is HTML? Fully Understand HTML Basics

In this post we will walk through the basics of HTML, what is HTML, and how does it work. HTML is the essential part of web development, and as such, you should be familiar with HTML basics and its properties.

What does HTML stands for?

HTML is an acronym for Hyper Text Markup Language. It is the language used for building the content of web pages. We use it to create elements of the website, and define its structure.

Is HTML a programming language?

As the name suggests, HTML is a markup language. Markup language is not a programming language, because it is not possible to add dynamic functionality.

In order to consider something a programming language, it has to pass a so-called Turing’s test. If a language passes this test, it is considered a “Turing complete”, and is marked as a programming language.

HTML is not such a language, because it cannot pass a program for a machine to use it. As a markup language, we use HTML to declare markings, which signals the structure of the web document to web servers.

How does HTML works?

HTML documents are files with .html extension, which represents an HTML page. Each such page consists of HTML elements. We use these elements to structure web pages, with the tags.

What are html tags?

Tags are markings that signal the web servers where a specific element starts, what its content is, and where it ends.

So, main parts of HTML elements are:

  • Opening tag, which represents the beginning of an element.
  • Closing tag, which is the end of an element.
  • Between these tags, we put the element’s content.

In addition to tag, elements have also attributes. Attributes contain additional information and specifications. It is important to have in mind that each attribute has its name, and a value.

What is the general structure of an HTML document?

The entire HTML document consists of head, and body.

Head element is a section for storing important information about our document, as well as to add connections with external files, like CSS files, JavaScript, page title, Google Fonts, etc. This kind of information is also known as meta information.

Body part is a part responsible for structuring the document and adding the content, because everything we add to a body is seen by the users.

<!DOCTYPE html>
<html>
<head>
<!-- META INFORMATION GOES HERE -->
</head>
<body>
<!-- WEBSITE CONTENT GOES HERE -->
</body>
</html>

The first line of every HTML document is !DOCTYPE html tag, and this tag informs the browser that our document uses HTML5, which is the newest version of this language.

What are some important HTML elements?

There is a large number of HTML elements, some of them are new, some of them are now obsolete. However, few of them are essential to know, and important to learn from the start.

Heading tags

These tags are used for marking the headline parts of our web page. They differ in size, so <h1> text has the largest font size, while <h6> is the smallest.

Paragraph

The <p> tag is the most used tag, as most of the website content is text, and we use it for defining paragraphs across the page.

Links

Links are an extremely important part, as the links are the ones that connect different web pages. They are labeled with <a> tag, which represents the abbreviation from the word anchor. The <a> tag has embedded href attribute, and we use it to add a web address where the specified link will lead to. When it comes to the content between opening and closing tag, here we add the text that is actually visible by the users.

Lists

There are two types of list tags, one for ordered list (ol), the other for unordered list (ul). Between list tags, we have a li tag for each item.

Images

Image tag is an example of an element that does not have a closing tag. As the link tag, the image tag (img) also has embedded attributes. It has src attribute (source), which is the address of an image, and alt attribute. The alt attribute use is to describe an image for the user, if for some reason the image is not loaded.

Div Elements

Div elements are the essence of structuring a web document, because we use them to separate different parts of our web page. We can say that divs are the building blocks of the website. We can nest other elements inside a div.

Conclusion

HTML is the markup language of the internet. Every HTML page has a set of elements that make up the web page or application’s content structure. It is considered a beginner-friendly language, and a language one should learn when starting with web development.

As HTML primary purpose it to structure the web document, in order to create a complete website HTML is used in combination with CSS (for styling) and JavaScript (for functionality).

If you wish to learn more about CSS, the language of style, you can read it in the post “What Is CSS And Why Is CSS So Important?”.

If you are interested to learn what JavaScript is, you read about it in a post “What Is JavaScript? Complete Beginners Guide”.

Leave a Comment

Your email address will not be published.

%d bloggers like this: