Introduction to Html

• With HTML you can create your own Web site.
• HTML stands for Hyper Text Markup Language.
• HTML is not a programming language, it is a Markup
Language.
• A markup language is a set of markup tags.
• HTML uses markup tags to describe web pages.
• HTML is not case sensitive language.
• HTML documents contain HTML tags and plain text.
PiyushIT

 HTML Was developed in 1992
 HTML 2.0 is introduced in 1994
 HTML 3.0 was developed in 1995
 HTML 3.2 was completed by 1997
 HTML 4 was developed in the year 1998
 HTML5 was first started by Mozilla, Apple, and Opera
under a group called the WHATWG(Web Hypertext
Application Technology Working Group). In 2006 W3C
(World Wide Web Consortium) showed an interest in
HTML5 and in 2007 they created a working group to
work in HTML5 project. HTML5 is still under
development.
PiyushIT

• Write html code in notepad.
• Save the file with (.Html)/(.Htm) extension.
• View the page in any web browser viz. INTERNET
EXPLORER, NETSCAPE ,Google Chrome etc.
• The purpose of a web browser (like internet
explorer or Firefox) is to read html documents and
display them as web pages.
PiyushIT

 An HTML file must have an .htm or .html file
extension
 HTML files can be created with text editors:
 NotePad, NotePad ++ etc
 Or HTML editors:
 Microsoft FrontPage
 Macromedia Dreamweaver
 Netscape Composer
 Expression Web
PiyushIT

Header
Navigation
Aside
Footer
Section
Article
Footer
Article
Footer
Article
Footer
Figure
Image, Video, Quote, Table,
etc…
Legend
PiyushIT

Header
Body
< / HTML>
< HTML >
PiyushIT

• <HTML> - Describe HTML web page that is
to be viewed by a web browser.
• <HEAD> - This defines the header section
of the page.
• <TITLE> - This shows a caption in the title
bar of the page.
• <BODY> - This tag show contents of the
web page will be displayed.
PiyushIT

<html>
<head>
<title> The title of your html page </title>
</head>
<body>
<! - - your web page content and markup - ->
</body>
</html>
PiyushIT

<html>
<head>
<title>My First HTML Page</title>
</head>
<body>
<p>This is some text...</p>
</body>
</html>
Opening
tag
Closing
tag
PiyushIT

<html>
<head>
</head>
<body>
</body>
</html>
HTML
header
PiyushIT

<html>
<head>
</head>
<body>
</body>
</html>
HTML
body
PiyushIT

 Hyperlink Tags
 Image Tags
 Text formatting tags
<a href="url">Link text</a>
<img src="logo.gif" alt="logo" />
<strong>Bold</strong> and <em>italic</em> text
PiyushIT

<video src="movie.ogg" controls="controls"></video>
<audio src=" song.ogg " controls="controls"></audio>
PiyushIT

<!DOCTYPE HTML>
<html>
<head>
<title>Simple Tags Demo</title>
</head>
<body>
<a href="http://www.tricksbypk.blogspot.com/"
title=
“My Blog">Visit link.</a>
<br />
<img src="logo.gif" alt="logo" />
<br />
<strong>Bold</strong> and <em>italic</em> text.
</body>
</html>
PiyushIT

Heading Element:->
• There are six heading elements
(<H1>,<H2>,<H3>,<H4>, <H5>,<H6>).
• All the six heading elements are container
tag and requires a closing tag.
• <h1> will print the largest heading
• <h6> will print the smallest heading
PiyushIT

<html>
<head><title>heading</title></head>
<body>
<h1> GLOBAL INFO CHANNEL</h1>
</body>
</html>
PiyushIT

• HTML documents are divided into paragraphs.
• Paragraphs are defined with the <p> tag i.e.
<p>This is a paragraph</p>
<p>This is another paragraph</p>
PiyushIT

• if you want a line break or a new line without starting a new
paragraph Use the <br> tag.
• Defines a horizontal line use <hr>tag.
• <br> <hr> element are empty HTML element i.e. Global
Information Channel<hr>
Global Information <br> Channel
PiyushIT

 HTML 5 is the next version of Hyper
Text Markup Language(HTML4)
 It is developing by World Wide Web
consortium W3C.
 Defined error handling
PiyushIT

 Video and audio tags
 Header and Footer
 Drag and drop
 Canvas
 Offline Storage
 Geo-Location
PiyushIT

<header> </header>
<foooter></footer>
PiyushIT

Experimental First-Person
Shooter Game 3D Graphics
PiyushIT

HTML4 HTML5
Elements like nav, header
were not present.
It brought new element for
web structure like nav ,
header etc
It was lack of rules of
parsing so it is difficult to
handle error.
Strictly parsing rules
introduced in html5 so
handle the error.
No multimedia supported
without third party
It inbuilt multimedia
element in html5 like Audio
, video , canvas
It was not available It contains attributes like
control menu, spell check
etc.PiyushIT

 YouTube uses HTML5, www.youtube.com/html5
 Only some of the browser only supports HTML5
features currently
 Google Chrome, Mozilla Firefox , opera etc
PiyushIT

Introduction to Html

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Similar to Introduction to Html

Similar to Introduction to Html (20)

Recently uploaded

Recently uploaded (20)

Introduction to Html

Editor's Notes