2. HTML5
• Hyper Text Makeup Language(HTML) is a
computer language used to create web
pages.This presentation will show you how to
get started with basic HTML5 documents.
3. Understanding HTML5 Document
Structure
Doctype declaration
The Doctype declaration at the beginning of your
page specifies that the document is written in
HTML5.In HTML5,the Doctype declaration is
required.
4. HTML tags
• The <html> and </html> tags appear at the
beginning and the end of an HTML
document.When a browser sees these tag s, it
knows that anything within the two tags
defined a web page.
5. Document head
• You use head of an HTML document to add
expressive information to your web page.The
document head tags,<head> and
</head>,immediately follow the opening
<html> tag.The document head contains
information that does not appear in the
browser window,including the
information,metadata,and references to script
s and style sheet .
6. Metadata
• It means 'data about data'.On a web
page,metadata can include author
information,the type of editor used to create
the page,a description of the content ,relevant
keywords,and copyright information.You place
metadata inside the document head.
Metadata is optional in an HTML5 document.
7. Document title
• The <title> and </title>tags define a page title
and appear inside the document head.
8. Body tag
• The visible content that make your web
page,including
paragraphs,lists,tables,images,canvases and
videos,resides in the body of your HTML
document.The body of document is identified
by <body> and </body> tags.The body of a
document comes after the head of document.
9. Creating and saving web page
• You can use text editor to create web
page.Start the text editor to create web
page.In this presentation we will start with
Text editor.To open text editor,perform these
steps:
1.Click on Show Applications button.
Activities window will appear.
2.Type Text Editor in search bar.
3.Click on Text Editor icon.
10. Start and Save an HTML document
1.Open text editor,and type the text that you
want to appear on the web page
2.Click on Option button.
3.Click on Save As to save the web page.
The save as dialog box appear
4.type a name for the web page.Make sure you
add the .html or .htm extension to the web page
name.
A web page name can have letters and
11. Start and Save an HTML document
• Navigate the folder where you want to save
the page.
6.Click on All Files arrow to see list of the ways
by which you can save the web page.
7.Click on All Text files.
8.Click on Save.
Text Editor saves the page.
12. Basic HTML tags
• You sets of HTML tags to define the basic
structure of your page.HTML tags control the
layout and formatting of elements in
HTML.These tags are the building blocks of
HTML.Some basic HTML tags <HTML>,
<HEAD>,
<TITLE>, and <BODY> that you must add to
every web page you create are discussed
below.
13. Adding Document Declaration Or
Doctype Declaration
• The Doctype declaration at the beginning of
your page specifies that the document is
written in HTML5.In HTML5,the Doctype
declaration is required.In the past versions of
HTML,the Doctype declared the particular
version of HTML that the browser can expect
to see in your document.
1.Type <!DOCTYPE html> before the entire text
on the web page.This declares the document as
HTML5 .
14. HTML Tags
• The first set of tags after the <!DOCTYPE html>
tag,<HTML> and</HTML>,indicated the start
and end of an HTML document.
1.Type <HTML> just below the <!DOCTYPE
html>.
2.Type </HTML> at the end of the entire text on
the web page.
These tags declare the document as HTML.
15. Head tags
• The next set of tags,<HEAD> and</HEAD>,
contains the web page title and other
descriptive information about a web page.
1.Type <HEAD> directly below the <HTML> tag.
2.Press the Enter key twice.
3.Type </HEAD>.
These tags define where the title and the other
descriptive information will appear.
16. Title tags
• The <TITLE> and </TITLE> tags indicate the
title of the web page.The Title bar or Tab of
the web browser window usually displays the
title.
1.Type <TITLE> directly below the <HEAD> tag.
2.Type the title for the web page,using only
letters and numbers.
3.Type </TITLE>.
Title text describes the contents of the page and
appears in the Title bar or Tab of the web
17. Metadata Tag
• To can add metadata to your page to include
extra descriptive information that does not
appear in the browser window.Metadata can
include a page description,author,copyright
information,keywords,and more.What you
insert in metadata tags can help search
engines categorize your page.You define
metadata in document header using the
<META> tag.
18. Process to add metadata tags
• Click between the <HEAD> and </HEAD>
tags,and press Enter key to start a new line.
In this example,the metadata appears below
the <TITLE> tags.
2.Type <META NAME="author" followed by a
space.
3.Type CONTENT= "My Name">,replacing My
Name with your name.
19. Body tags
• The final set of tags ,<BODY> and
</BODY>,contains the main content of the web
page.It is a container element,which includes
text,graphics and other elements.
1.Type <BODY> directly below </HEAD> tag.This
tag marks the beginning of actual content of your
web page.
2.Type </BODY> directly above the </HTML>
tag.This tag closes the body portion of page.Save
the file once again to save the changes.