HTML HEAD

The html head elements collectively describes properties of the document such as the title, provide meta information, instruct the browser where to find style sheets, and point to or include scripts that allow to extend HTML documents in highly active and interactive ways.

HTML elements that can be used inside the (html head) <head> element includes: <title>, <base>, <link>, <style>, <meta>, <script> and <noscript> element.

The HTML title Element

The <title> element defines the title of the document.

The title element is required in all HTML/XHTML documents to produce a valid document. Only one title element is permitted in a document and it must be placed within the head element. The title element contains plain text and entities; it may not contain other markup.

The title of the document may be used for different purposes. For example:

  • To display a title in the browser title bar and in the task bar.
  • To provide a title for the page when it is added to favorites or bookmarked.
  • To displays a title for the page in search-engine results.
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Hello World Document</title>
</head>
<body>
    <p>Hello World!</p>
</body>
</html>

[su_label type=”info”]RESULT[/su_label]

The HTML base Element

The HTML <base> element is used to define a base URL, for all relative links contained in the document, e.g. you can set the base URL once at the top of your page, and then all subsequent relative links will use that URL as a starting point.

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Defining a base url</title>
    <base href="https://www.afriportalnetwork.com/">
</head>
<body>
    <p><a href="https://www.htmloverride.com/html-head/">Html head</a></p>
</body>
</html>

[su_label type=”info”]RESULT[/su_label]

Creating Your First HTML Document

Step 1: Creating the HTML file

Open up your computer’s plain text editor and create a new file.

Step 2: Type some HTML code

Start with an empty window and type the following code:

<!DOCTYPE html>
<html>
	<head>
    		<title>A simple html document</title>
	</head>
	<body>
      		<p>Hello World!<p>
	</body>
</html>

[su_label type=”info”]RESULT[/su_label]

Step 3: Saving the file

Now save the file on your desktop as “myfirstpage.html “.

To open the file in a browser. Navigate to your file then double click on it. It will open in your default Web browser. If it does not, open your browser and drag the file to it.

Explanation of code

  • The first line <!DOCTYPE html> is the document type declaration. It instructs the web browser that this document is an HTML5 document. It is case-insensitive.
  • The <head> element is a container for the tags that provides information about the document, for example, <title> tag defines the title of the document.
  • The <body> element contains the document’s actual content (paragraphs, links, images, tables, and so on) that is rendered in the web browser and displayed to the user.

HTML Tags and Elements

HTML is written in the form of HTML elements consisting of markup tags. These markup tags are the fundamental characteristic of HTML. Every markup tag is composed of a keyword, surrounded by angle brackets, such as <html><head><body><title><p>, and so on.

HTML tags normally come in pairs like <html> and </html>. The first tag in a pair is often called the opening tag (or start tag), and the second tag is called the closing tag (or end tag).

An opening tag and a closing tag are identical, except a slash (/) after the opening angle bracket of the closing tag, to tell the browser that the command has been completed.

In between the start and end tags you can place appropriate contents. For example, a paragraph, which is represented by the p element, would be written as:

<p>This is a paragraph</p>
<!-- PARAGRAPH WITH NESTED ELEMENT -->
<p>
   This is <b>another</b> paragraph
</p>

[su_label type=”info”]RESULT[/su_label]