Where might you have seen our work?

Small places create combinations, but crosses that occur cannot provide many combinations. So be careful in making justifications, especially SEO.

HTML: Definition and The Examples

Last updated: Aug 01, 2022

Hypertext Markup Language or abbreviated as HTML is a standard markup language to create a web page. HTML was originally developed at CERN (Conseil Européen pour la Recherche Nucléaire; European Organization for Nuclear Research) by Tim Berners-Lee around 1990.

In a simple simulation, a browser receives an HTML document from the web server or local storage, then it will run a document rendering to the multimedia web

HTML will portray the web page structure in a semantic way and account for the early “sign” for the document interface.

It is important for a beginner to know that the HTML element is a block for the HTML page builder. What is an HTML page builder?

With the construction of an HTML block, images, text, and other HTML objects can be inserted into a page. These elements also supply a facility to create documents or structured text such as post, paragraph, list, link, cite, or other tags.

Sample of HTML code

<!DOCTYPE html>
<html>

-- Header --
<head>
<title>This is a title</title>
</head>

-- Body --
<body>
<p>Hello world!</p>
</body>
</html>

cmlabs

HTML Version

HTML 2 - November 24, 1995
HTML 3 - Januari 14, 1997
HTML 4 - Desember 18, 1997
HTML 5 - Oktober 28, 2014

Note: each version of the HTML above has more sub-versions, such as 4.0 and 4.1. We only provide a summary of the significant versions.

HTML Components

In general, HTML components are divided into three points namely tags, elements, and attributes.

Tags

The HTML tag is a sign that becomes the prefix and suffix in HTML commands. Each tag has a different use. Writing tags begin and end with brackets <..> and there is a tag name in it. In HTML, tags are used in pairs including the opening <..> tag and the closing </..> tag.

Until now there are about 250 HTML tags, some HTML tags that you need to know are:

Tag Tag's Function
<html> </html>to initiate the creation of an HTML page containing content and elements
<head> </head>to create a head section containing titles, resources, and meta tags
<title> </title>to make the website title displayed at the top of the browser window
<body> </body>to write the body
<p> </p>to create a paragraph in an HTML page
<h1> to <h6>to create heading tags
<!-- -->to create comments

Table 1: Examples of some HTML tags and their functions.

Element

Elements are the components that make up an HTML page. An HTML element can consist of an opening tag, a body tag, and a closing tag. Sometimes it also has attributes. For example, an element may consist of an opening <p> tag indicating the paragraph element, an attribute such as align="center", a body or text tag of "Hello World", and a closing </p> tag to end the paragraph element.

An element can also contain other HTML elements or commonly called nested elements. Consider the following example of writing nested HTML elements:

<html>
<body>
<p align="center">Hello world!</p>
</body>
</html>

cmlabs

Attribute

Attributes are additional information contained in HTML elements. Attributes function to clarify the command tag in the element. A tag can have more than one attribute, although not all attributes can be used in the same tag. Look at the following HTML code.

<img src="bunga-mawar.jpg” alt="10 tangkai bunga mawar berwarna merah"></img>

cmlabs

From the example above, it can be seen that the <img> tag has two attributes, namely src, and alt. This shows a command so that the browser displays an image from the rose-flower.jpg file with the alt text containing "10 red roses".

HTML Tags for Website Optimization

Some HTML tags that you can use to optimize your website include:

Title Tags

Title tags are the title text that will be displayed at the top of the browser window. Make sure the title tags contain keywords that are relevant to the content of the page. Note the writing of the following title tags.

<head>
<title>HTML Tags untuk Optimasi Website</title>
</head>

cmlabs

Meta Tags

One of the most important meta tags is the meta description which contains a brief description of the information presented on a web page. The meta description must be attractive and contain keywords. The recommended length is around 400 – 750 pixels only.

An example of writing meta tags in HTML is as follows.

<head>
  <meta charset="UTF-8">
  <meta name="description" content="HTML adalah markup standar untuk membuat halaman web.
  Dalam artikel ini kami akan membahas pengertian, komponen, serta HTML tags untuk
  optimasi web.">
  <meta name="keywords" content="HTML, SEO, Website">
  <meta name="author" content="John Doe">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>

cmlabs

Heading Tags (H1, H2, H3, etc.)

Heading tags show the structure of the content that making it easier for readers and search engines to understand the information in the content. HTML tags have 6 categories of heading tags ranging from H1 to mark the most important things, to H6 for the least important things. Consider the following code example heading tags.

<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>

cmlabs

Image and Alt tags

To attach images to a page, you can use images and alt tags. It makes it easier for search engines to understand the multimedia on your page. That way, your content can be indexed well by search engines so that the performance of the website will get better.

<img src="kucing.jpg” alt="gambar seekor kucing yang sedang mengejar bola"></img>

cmlabs

Hyperlink

Hyperlink or anchor text is usually used to add text that contains a link to a particular page. To optimize the website, make sure the words you use in the anchor text are relevant to the intended web page. Example of a hyperlink:

<a href="https://cmlabs.co/id-id/seo-guidelines/seo-on-page">Panduan SEO On-Page</a>

cmlabs

No Follow Link

No follow is a tag in HTML used to prevent Google from following pages that are linked in an anchor text. This attribute can avoid Google penalties when linking low-quality links. Consider writing the link rel="no follow" attribute below:

<a href="https://cmlabs.co/id-id/seo-guidelines/seo-on-page" rel="nofollow">Panduan SEO On-Page</a>

cmlabs
cmlabs

cmlabs

Note: We have attached some of the most common questions asked by users below, along with their answers. To use the cmlabs Keyword Ranking Tracker application, you don't need to request for a quote from marketing. Please click login to the application.

WDYT, you like my article?

Latest Update

Zero Click

Last updated: Nov 25, 2022

Content Delivery Network (CDN)

Last updated: Nov 24, 2022

Website Taxonomy

Last updated: Nov 22, 2022

Need help?

Tell us your SEO needs, our marketing team will help you find the best solution

Marketing Teams

Laras

Marketing

Ask Me
Marketing Teams

Vanessa

Marketing

Ask Me

As an alternative, you can schedule a conference call with our team

Schedule a Meeting?