HTML Tags

What are HTML tags?

Previously in our introduction, we explained that HTML serves the same function as a person's skeletal structure: establishing a foundation to build upon.

HTML is what supports the structure of a website's content.

HTML tags are the basic units used to conveniently draw these structures.

A person's bones may grow and develop naturally, but a website requires you to create its structure from scratch.

In other words, it is essential to optimize your workflow by drawing the repetitive structures of a website in an efficient manner.

If you observe human bones, you'll be able to discover that they have consistent patterns. The bones that compose your ribs share great similarities when examined closely; so do the bones in your pelvis, as well as the ones in your arms and legs.

The content in websites often share close similarities too.

You will frequently see headings, links, and paragraphs on websites.

Sometimes you'll see images and videos as well.

HTML tags were made to efficiently draw these repetitive patterns.

Headings are written inside the tags {'<'}h1{'>'}, {'<'}/h1{'>'} to create bold, large text that stands out the way a title should.

Links are made using the tags {'<'}a{'>'}, {'<'}/a{'>'}. You're probably familiar with blue, underlined hyperlinks; this is how they are made.

As you can see, HTML tags are core elements used to easily reproduce repetitive patterns and display website content in a balanced and harmonious way.

The Actual Use of HTML Tags

As explained before, each HTML tag has a specific style associated with it. However, it's rare to see these default styles being used, because not everyone wishes to use the default options.

Thus, to create a website with a personalized style, you need to identify the default HTML styles supported by browsers, and either remove or combine them to achieve your intended style.

In fact, HTML tags aren't limited to style choices - some tags like div or span fulfill the role of separating or differentiating content.

We'll explore HTML tag types in depth in the next tutorial.

The Expansion of HTML Tags

The way of creating websites has become vastly different and certainly more diverse since the dawn of HTML tags.

If websites were only needed to display simple news articles or blog posts, basic HTML tags would have sufficed for website creation.

And yet that was not the case. Websites became more and more complicated as time passed, and the simplicity of basic HTML tags left a lot to be desired. People also started to seek a more efficient way of using varying patterns. This resulted in the creation of what is known as a component - custom HTML tags made using Javascript code.

Components are basically an expansion of HTML tags, because they allow people to store and efficiently use a desired pattern or style of content in a customized tag.

We'll be examining components more thoroughly in our next React course.