Brief introduction to HTML
HTML stands for HyperText Markup Language. It is used to design web pages using the markup language. HTML is the combination of Hypertext and Markup language. Hypertext defines the link between the web pages and markup language defines the text document within the tag that define the structure of web pages.
Why is HTML so important?
HTML is used to create the structure of web pages that are displayed on the World Wide Web (www). It contains Tags and Attributes that are used to design the web pages. Also, we can link multiple pages using Hyperlinks.
HTML elements tell the browser how to display the content and also provides a means to create structured documents by denoting structural semantics for text such as headings, paragraphs, lists, links, quotes and other items.
HTML semantics
In programming, Semantics refers to the meaning of a piece of code, or "what purpose or role does that HTML element have" (rather than "what does it look like?".)
A semantic element clearly describes its meaning to both the browser and the developer.
In HTML, for example, the <h1> element is a semantic element, which gives the text it wraps around the role (or meaning) of "a top level heading on your page." <h1>This is a top level heading</h1>. Examples of semantic elements in HTML: <form>, <table>, and <article>. Clearly defines its content.
HTML tags
HTML tags are simple instructions that tell a web browser how to format text. There are different kind of tags in HTML. Tags with opening and closing tags are called container tags, and tags with only one opening tag and no closing tag are called empty tags.
Container tags
<html> It is used to define the root element of HTML document.
<head> It is used to define the head portion of the HTML document that contains information related to the document.
<title> Specifies a title for the HTML page.
<body> It is used to enclose all the visible content of a webpage.
<form> Defines a form.
<h1> Defines a large heading. Heading 1.
<h2> A smaller heading. Heading 2.
<h3> Heading 3.
<h4> Heading 4.
<h5>Heading 5.
<h6> Heading 6.
<p> Defines a paragraph.
<a> Lets you create links to other content.
<div> It is a generic container that you can use to add more structure to your page content.
<span> It’s used to add structure to your content.
<em> Gives the contained text emphasis (usually as italics).
<strong> Makes the contained text bold.
<ol> Ordered (numbered) list.
<ul>Unordered (bulleted) list.
<li> List item, must be nested inside a list element.
Empty tags:
<area> Defines an area in an image.
<base> Defines the base URL for all the relative URLs in the document.
<br> It is used to create a line break.
<col> Defines a column in a table.
<embed> It is used to embed external content on the webpage.
<hr> Creates a horizontal line.
<img> It is used to define an image.
<input> It is used to create an input field.
<link> It is mostly used to add external stylesheets to the HTML document.
<meta> It is used to give metadata to the webpage.
<param> Defines parameter to the object.
<source> It is used to give multiple media of resources for audio, video, and pictures.
<track> It is used in media files to provide times text tracks.
<wbr> It provides a word break position in a paragraph for the browsers.
These ones are obsolete in HTML5:
<command>
<keygen>
<menuitem>
Website examples
You can see numerous website examples on Internet. For instance here are shown some of them that are very important for Front End developers:
Bibliography:
HTML Introduction
What is HTML ?
Introduction to HTML
HTML
Self closing tags in HTML
Top comments (0)