Learn the Basics of HTML Tags
In the previous tutorial, we learned that HTML is a markup language that is used to define the structure of a webpage.
To properly define this structure, it makes use of a wide range of syntax called "tags." The primary structure of an HTML document includes tags, which surround the entire content and apply meaning to it.
HTML Document Structure
A typical HTML document will have the following structure
<!DOCTYPE html>
<html>
<head>
Tags that defines the header info
</head>
<body>
Tags that define the contents of the site
</body>
</html>
Use lowercase when writing html tags.
- Sikademy Tips
Tags are usually enclosed within opening and closing angle braces. In most cases, they are in the format:
<tagname></tagname>
However, some tags can be in the format
<tagname />
and
<tagname >
Let's begin by analyzing the code sample from the previous lesson.
<!DOCTYPE html>
<html>
<head>
Tags that defines the header info
</head>
<body>
<h1>Welcome To the World Wide Web</h1>
<p>Cheers! From Sikademy.</p>
</body>
</html>
HTML Document Type Declaration
<!DOCTYPE html>The <!DOCTYPE html> tag called the document type declaration is a tag is used by the majority of web browsers to detect the version of the HTML been used on a webpage and render the results accordingly.
The version of HTML used in this tutorial is 5.
Nevertheless, many other document declaration types can be used in an HTML document depending on what version of HTML is being used. It’s very crucial to include this in an html document, otherwise, some browsers will assume a version for you and render an unexpected result.
HTML Document Tag
It's in the format
<html> </html>.<html> is the tag that kicks off your html format, and instructs the browser that everything between it and the </html> tag is an HTML document
Head Tag
This is denoted by <head></head>, this is where you define some important properties of your html document that gives meaning to the webpage.
It includes features such as links to stylesheets, favicons, page title, meta information, and a lot more.
Body Tag
The body tag that begins with <body> and ends with </body> is the part of the document where the main content of the webpage is defined. This is the visible part of any webpage or HTML document you see, including this one.
Understanding opening and closing tags in HTML5
As we said earlier, some tags can be formatted like:
<tagname> </tagname> <tagname />or <tagname >Tags in the format <tagname></tagname> begins with "<tagname>" as the "opening tag" and ends with "</tagname>" as the "closing tag." Some examples are the body and html tags seen above.
Tags that appear as <tagname /> or <tagname> are called "empty tags" because they have no end tag and usually have < ... /> or < ... > as the "opening as well as closing tag" respectively. Although some developers use both interchangeably, it is a best practice to use one or the other and stick with it. Older browsers supporting "XHTML" make use of <tagname /> and produce unexpected results when the tag is written in the format <tagname>.