Categories
  Encyclosphere.org ENCYCLOREADER
  supported by EncyclosphereKSF

Mastering HTML5 Basics

From Wikiversity - Reading time: 3 min

HTML stands for Hyper Text Markup Language. It is the fundamental language for creating web documents (content pages). HTML is very easy to learn. I hope that besides learning, you'll enjoy it!

HTML5 is the next major revision of the HTML standard, superseding HTML 4.01, XHTML 

1.0, and XHTML 1.1. HTML5 is a standard for structuring and presenting content on the World Wide Web.

HTML5  is  a  cooperation  between  the  World  Wide  Web  Consortium  (W3C)  and  the  Web  Hypertext Application Technology Working Group (WHATWG).

Loading a simple HTML page in a web browser :

[edit | edit source]

Let's start simple.

1 - Open a text editor and enter some text. Save it as index.html.

2 - Now, open this file index.html in your preferred browser.

3 - You'll see that all the content that you typed in the text editor is displaying in the Web Browser.

Things to REMEMBER about HTML:

[edit | edit source]

In most cases, data is written in tags, which require an opening tag and a closing tag. For example: <h1>This is Heading Element</h1>.

  • However , there are some elements which do not require closing tags like: <img>,<meta>,<br>, etc.
  • The three most important HTML tags are the <html>,<head>, and <body> tags.
  • You must declare <!DOCTYPE html> , before writing any HTML code.This tells the browser that you are using HTML 5.

A Simple HTML Structured Page:

[edit | edit source]

Here is a simple webpage written in HTML :

Don't worry if you don't understand some parts, as they will be discussed later.

<!-- This Line Tells the Browser that we are using HTML5 To structure our webpage -->
<!DOCTYPE html>
<!-- The Actual HTML Code starts from Here -->
<html>

<!--This is the head section of HTML Page. It contains information that is usually not displayed on webpage like title of page , styles CSS Applied etc.-->
<head>
    <!--This Line sets the title of our webpage-->
    <title>Welcome To Salman Iqbal Masood (SIM) Inc.</title>
</head>
<body>
    <!--This is body of HTML document. What you write here , will be displayed in the Web Browser-->
    
    
</body>
</html>

Write these lines in a text editor and save this file as index.html.

Open the index.html file in your web browser. You will see that nothing happens on the page except that Title of the Page appears on the top of the browser, as the title of the tab. This is because this is just the standard structure of an HTML document, and we have not added any other content yet.

Standard HTML Tools

[edit | edit source]

Here are some of the most important HTML tools you need to know about:

Headings:

[edit | edit source]

There are six type of headings available in HTML. These includes :

<h1> Heading Level One </h1>
<h2> Heading Level Two </h2>
<h3> Heading Level Three </h3>
<h4> Heading Level Four </h4>
<h5> Heading Level Five </h5>
<h6> Heading Level Six </h6>

Type these headings one by one in the body tag of the HTML document, and display it in your browser.

Paragraphs:

[edit | edit source]

In HTML , paragraphs are represented with <p> and </p> tags.

<p>Paragraphs are written in these tage</p>

Links:

[edit | edit source]

To insert a link onto any page , we use anchor tags <a></a>.But instead of writing text inside these tags, we write a link within the opening tag, and put the text that the link will show in between the tags.

<a href="www.salmaniqbalmasood.com">Text To Display For Link</a>

Licensed under CC BY-SA 3.0 | Source: https://en.wikiversity.org/wiki/Mastering_HTML5_Basics
9 views | Status: cached on February 27 2025 18:57:26
↧ Download this article as ZWI file
Encyclosphere.org EncycloReader is supported by the EncyclosphereKSF