If you are going to start learning HTML, one of the first things you should understand are the specific terms that are used. Two of the terms you will see most often are “tag” and “element” and they almost mean the same thing.
HTML Tags
HTML is a markup language, which means that it is written with codes that can be read by a person, without needing to be compiled. In essence, the text on a web page is “marked up” with these codes to tell the browser how to display the text.
And these markup tags are the HTML tags themselves.
When you write HTML, you are writing HTML tags. These are made up of:
- A less-than sign
< - A word or character
- Optional space followed by:
- Any number of optional HTML attributes in the form of a
name="value"pair - And finally a greater-than sign
>
For example:
<p>
<html>
<small>
Are all HTML tags without attributes. <p> defines a paragraph. <html> defines the page as HTML. <small> defines small print, such as in a legal document.
And:
<a href="URL">
<img src="URL">
<div id="ID">
Are all HTML tags with attributes. <a href="URL"> is a link to another document. <img src="URL"> points to an image to display on the page. <div id="ID"> defines a division of the content of the page.
An HTML tag is the building block of HTML. In order to learn HTML, you learn the different tags, what they are for, how they can be used, and when it's appropriate to use them. In fact, one way to learn HTML is to simply memorize all the HTML tags.
Most HTML tags have an opening tag and a closing tag. These tags surround the text that will display on the web page. For example, the paragraph tag has an opening tag: <p> and a closing tag: </p>. To write a paragraph of text, you write the text to display on the page and then surround it with these tags:
<p>
This is a paragraph that will display on the web page. It is surrounded by opening and closing paragraph tags.
</p>
Some HTML tags do not have a closing tag. These are called “singleton” or “void” tags. Singleton tags are easy to use because you only have to include one in your web page. For example, to add a line break to your page you would use the BR tag:
<br>
Getting Technical—HTML Elements
In common usage, the terms “HTML element” and “HTML tag” can be used interchangeably. A tag is an element is a tag.
But according to the W3C HTML specification, an element is the basic building block of HTML and is typically made up of two tags: an opening tag and a closing tag. For example, the paragraph element <p></p> is made up of the opening tag <p> and the closing tag </p>. The element is the collection of both the starting tag and the ending tag.
Void elements have only one tag as part of the element, but in XHTML, you would also include a trailing slash in the beginning tag to show that it is a void element. For example, in XHTML to add a line break you would use the BR element with a closing slash:
<br />
For the purposes of this website, the terms “tag” and “element” are used to mean the same thing—an HTML item that will define something on your web page.
