New Posts
Home / Web Designing / HTML / Basic HTML Page Structure.

Basic HTML Page Structure.

Basic HTML Page Structure.

Once you know the Basic HTML Page Structure of HTML document then you can use and write and edit your own HTML file. In this Lesson, we are going to strip in the HTML Page Structure and down to it most basic parts.

HTML Page Structure

The example of HTML Page. We areexploring individualy.

<!DOCTYPE HTML>

<head>

<title> html Page Structure </title>

</head>

<body>

<h1>Page content</h1>

<p> In This Paragraph, you will learn about Basic HTML document. <p>

</body>

</html>

1- DOCTYPE declarations for HTML.

The history of doctype! the declaration is long and very one. I give you the link.

 link of doctype

<! doctype html>

  • The DOCTYPE tells the browser or user agent, which version of HTML you are using.
  • Before the <html> tag. The <! DOCTYPE> declaration must be used in your HTML document.

 Tip: The <! DOCTYPE> declaration is NOT case sensitive.

 2- <HTML>

The <html> tag tells the browser that this is an HTML document.

The <html> tag represents the root of an HTML document.

The <html> tag is the container for all other HTML elements (except for the <! DOCTYPE> tag).

3-  The document <head>.

Directly after the opening HTML tag, you find document head.

The head element where you place information about the document, references, thinks like external scripts and styles and additional instructions to the browser about how the document should be rendered.

The <head> element is used to contain all the head elements.

The <head> element is used with a title for the document, and can include scripts, styles, meta information, and more.

<! doctype html>

<html>

<head>

<title>Basic HTML document</title>

</head>

</html>

Directly after opening html tag, you can find a document head Directly after the opening html tag you find document head.

The head element where you place information about the document, references, thinks like external scripts and styles and additional instructions to the browser about how the document should be rendered.

Before we get the adding head in our document we first remember have to have HTML tag that opening and closing tag.

4- The document <body> tag.

The HTML <body> tag is used to define the main content of the HTML document. the <body> element is the main element of HTML, which is used to hold all the contents of an HTML document, such as text, hyperlinks, images, tables, lists, etc.

The Body where is all of your pages visible contents is going to go.  The body tag is not nested in the head tag.

Under the closing of </head> put body tag.<body>.

A simple HTML document, with the minimum of required tags.

Definition and Usage.

The <body> tag defines the document’s body.

The <body> element contains all the contents of an HTML document, such as text, hyperlinks, images, tables, lists, etc.

Exploring Basic HTML syntax.

  Element.

 HTML element

Opening Tag. Closing Tag.                

Note:

The basic distinction between tags and elements is very important to understand a tag is made up of left—and right—angle bracket and letters and numbers between those brackets, whereas elements, are the opening and closing tags plus anything between the two tags.

HTML Tip: Use Lowercase Tags.

HTML tags are not case sensitive: <P> means the same as <p>.

We use default browser rendering all page contents are controlled by CSS.

Now Time of Start!

Before starting this course you must have followings.

  • Text Editor.
  • Getting The Browsers.

Use several different web browsers.
Work on Mozilla, Chrome, Opera, Netscape and test every page on all browsers.

You can work with any text editor whom you familiar with but here I would like to give you the example of Notepad. 

  • Open a Notepad
  • Type following code
  • Save it with extension htm or html use one of  them. Like (example.htm) or (example.html).

<! DOCTYPE HTML>

<head>

<title>Basic HTML document</title>

</head>

<body>

<h1>Page content</h1>

<p>The main page content appears inside the <b>body</b> tag.  HTML contains several elements that which allows you to proper structure and format your content, which we’ll cover later.</p>

</body>

</html>

Open HTML File.

Double click on the file then the file will be opened in Web-Browser.

Noted: If the file is not opening in any Web Browser then notice that you have not saved filed correctly with the extention .htm or .html.

About imran

My Name Mohammad Ramzan Bhutto. Live in District Jacobabad, Sindh, Pakistan. I have started blogging on Information Technology, my selected areas are Online Business, Digital Marketing, Make Money Online.

Check Also

External Style Sheet

How to Use External Style Sheet. 

How to Use External Style Sheet. An External style sheet is simply texting files with …