DEV Community

blaycoder
blaycoder

Posted on

Why HTML is a must for every website

HTML is an abbreviation of HYPERTEXT MARKUP LANGUAGE. HTML is a language that makes a website well-structured. We can say HTML is a skeletal part of a website. HTML allows you to view the contents on your web page.
HTML is not a programming language.
It's just a way of communicating to the browser what should be on a website.

With the help of elements like

<head>,<title>,<main>, <header>, <p>, <footer>, <ul>, <body>
, and many more, you can format and organize a webpage.
HTML create an interface that allows you to add text, images, buttons, text field, video, audio and many more. Now, you can see why HTML is a must for every website.

HTML semantics helps give meaning to a webpage. Users have better experience on your website when you make use of semantic elements because of its accessibility. More info on semantics [(https://developer.mozilla.org/en-US/docs/Glossary/Semantics)]

HTML can also be referred to as the building block of a website. or the foundation of a website. Without the foundation, you can't build a house. Without HTML,you can't have a structured website.

Examples of websites that make use of HTML are google.com, geeksforgeeks.com, waiting.zuriboard.com, freecodecamp.com etc

There are 15 HTML empty tags which are:

<p> - It gives paragraph to a text

<br/> - Line break, it creates a new line whenever it's used.

<img/> - Insert an image into a webpage

<area> - It is used to map a portion of an image to make it clickable by the end-user. It is used to direct the user to different links after the user clicks on the mapped portions of the image. It is used as a child tag of the <map> tag.

<base> - For all relative URLs in a document, the base URL is specified to use with the <base> element. Only one <base> element can be used in a document.

<col> -     
The <col> tag in HTML is used to set the column properties for each column within a <colgroup> tag. This tag is used to set the style property to each column.

<embed> - The <embed> tag in HTML is used for embedding external applications which are generally multimedia content like audio or video into an HTML document. It is used as a container for embedding plug-ins such as flash animations.

<hr> - A thematic break between paragraph-level components is represented by the <hr> element. It looks like a line

<input> - This empty element is used to create interactive controls for web-based applications and forms, for accepting the information from the user such as an address, name, phone number, etc, depending on a variety of types of input data and control widgets are available.

<link> - The HTML element <link> is used to establish a connection between the current content and an external resource.

<meta> - The <meta> HTML element represents metadata i.e., information of a information.

<param> - The <param> tag in HTML is used to define a parameter for plug-ins which is associated with <object> element.

<source> - The <source> element is an empty element that provides various media resources for the <image>, <audio>, or <video> elements.  It provides the same media material in several file formats to ensure compatibility with a wide variety of browsers, as image and media file formats are supported by the browsers differently.

<wbr> - The <wbr> tag in HTML stands for word break opportunity and is used to define the position within the text which is treated as a line break by the browser. It is mostly used when the used word is too long and there are chances that the browser may break lines at the wrong place for fitting the text.

<track> -   
The <track> tag specifies text tracks for media components audio and video. This part is employed to specify subtitles, caption files, or different files containing text, that ought to be visible once the media is taking part in. The <track> element is an empty HTML element that is used as a child of the audio and video media components. It allows you to define timed text tracks (or time-based data), for example, to handle subtitles automatically. 

<keygen> - It is used to specify a key-pair generator in a HTML form. A private and public key will be generated. The private will be saved in the browser local key storage while a public key will be sent to the server.
Note: The tag is no more recommended.
Enter fullscreen mode Exit fullscreen mode

Below are 25 container tags

<h1> to <h6></h1>to</h6> - This is meant for headings. H1 is the main heading, H2 is secondary, etc.

<p></p> -   It create a new paragraph

<div></div> - A container for a block of content

<span></span> - A container for inline content, such as content inside a paragraph

<em></em> - Gives the contained text emphasis (usually as italics).

<strong></strong> - It gives a bold text

<title></title> - It gives a document a title.

<head></head> - It contains important information about the document which are machine-readable.

<a></a> - This create a link that can connect to a another webpage

<section></section> - defines the section of documents such as chapters, headers, footers or any other sections. 

<ul></ul> - creates an unordered list

<ol></ol> - creates an ordered list

<li></li> - creates bullet list

<footer></footer> - This is a semantic tag that defines the footer of a document.

<aside></aside> - the tag defines some content aside from the content it is placed in.

<code></code> - The <code> tag is used to define a piece of computer code.

<textarea></textarea> - it allows multi-line text input. It commonly used in a form.

<th></th> - The <th> tag defines a header cell in an HTML table.

<progress></progress> - The <progress> tag represents the completion progress of a task.

<blockquote></blockquote> - The <blockquote> tag specifies a section that is quoted from another source.

<button></button> - The <button> tag defines a clickable button. It is commonly used after filling a form in a website. 

<legend></legend> - The <legend> tag defines a caption for the <fieldset> element.

<main></main> - The <main> tag defines the main content of a document. 

<option></option> - The <option> tag defines an option in a select list.

<script></script> - The <script> tag is used to embed a client-side script (JavaScript).

<svg></svg> - The <svg> tag defines a container for SVG graphics.
SVG has several methods for drawing paths, boxes, circles, text, and graphic images. 
Enter fullscreen mode Exit fullscreen mode

RESOURCES
https://calltutors.com/blog/importance-of-html
https://developer.mozilla.org
https://matthewjamestaylor.com/empty-tags
https://www.washington.edu/accesscomputing/webd2/student/unit2/common_tags.html
https://www.geeksforgeeks.org/what-are-empty-elements-in-html/
www.w3schools.com

Discussion (1)

Collapse
andrewbaisden profile image
Andrew Baisden

Without HTMl there is no website 😅