Mastering HTML5 Basics
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 surely 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 :
editLet's start simple.
1 - Open Notepad(Windows), Enter Some Text Inside and Save it is index.html.
2 - Now, open this file index.html in your default (may not be) browser.
3 - You'll see that all the content that you typed in Notepad and saved, is displaying exactly like on Web Browser.
Things to REMEMBER about HTML:
edit- In HTML , in most cases data is written in tags.A opening tag and a closing tag.For Example , <h1>This is Heading Element</h1>.
- However , there are some elements which does not require closing tags.For Example, <img>,<meta>,<br>etc.
- There are three most important tags of an HTML Page , that are <html>,<head> and <body> tags.
- You must declare <!DOCTYPE html> , before writing any HTML code.This tells the browser that you are using HTML of Version 5.
A Simple HTML Structured Page:
editHere is a simple webpage written in HTML :
Don't be mess up if you find it trouble , we'll discuss each in detail soon. Infact , these are the things , you probably need to remember in mind.
<!-- 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>
Ok! Write these lines in Notepad and save this file as index.html.
Open index.html file in your web browser and you will see that nothing happens on the page except that Title of the Page appears on the top of the browser. This is because , this is just the standard structure of any HTML5 Page. We had not add any content in it yet and therefore , it looks empty.
Standard HTML Tools
editHere are some most important HTML Tools , you need to know about.
Headings:
editThere 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 body tag of HTML document and display it in browser.
Paragraphs:
editIn HTML , paragraphs are represented with <p> and </p> tags.
<p>Paragraphs are written in these tage</p>
Links:
editTo insert a link onto any page , we use anchor tags <a></a>.But instead of writing some text inside these tags , we use a special text like this,
<a href="www.salmaniqbalmasood.com">Text To Display For Link</a>