HTML
Syllabus
HTML – AN INTRODUCTION -
HTML TAGS – HTML ELEMENTS
– TAG ATTRIBUTES
HTML
q HTML stands for Hypertext Markup Language
q What is Hypertext ?
qWhat is Markup ?
qIt is a language used to create static webpages
What is Hypertext ?
q Hypertext - set of non-linear documents
q By clicking on the hotspots the user is transported to
the related document.
q The text is called hypertext and the address (link) to
the document is called hyperlink
Types of Markup Languages
What is markup in HTML ?
q In HTML, markup refers to a selection of text
with a pair of tags for a specific presentation style
q Example: <b>John Doe</b> would be rendered in
bold: John Doe, where b stands for bold
HTML in older browsers ?
What is a Webpage and website?
Parts of a Webpage
What is markup ?
q In HTML, markup refers to a selection of text
with a pair of tags for a specific presentation style
q Example: <b>John Doe</b> would be rendered in
bold: John Doe, where b stands for bold
HTML - Code Structure
Mainly for Title in title bar
Mainly for white canvas
area in the webpage
HTML - Code Structure
First HTML Code
<!DOCTYPE html>
q All HTML documents must start with
a <!DOCTYPE> declaration.
q The declaration is not an HTML tag
q It is an “information” to the browser about the
document type to expect
!DOCTYPE - not case sensitive
Structure Of a webpage
<html>
q Root element of
HTML code
q Opening tag -
<html>
q Closing tag
</html>
q Within these tags
entire webpage is
written
<head>
q Describes the
document
q Hold meta data
q Opening tag -
<head>
q Closing tag
</head>
<head>
<title>
q Describes the title of the document.
qOpening: <title> Closing: </title>
q Displays the title of the document in the title bar of
browser.
<body>
q Describes the
content viewable
inside the page
by users of
webpage
qOpening:
<body>
qClosing:
</body>
Web Browsers
q The purpose of a web browser (Chrome, Edge, Firefox, Safari) is
to read HTML documents and display them correctly.
q A browser does not display the HTML tags, but uses them to
determine how to display the document:
HTML Elements
q An element consists of three basic parts: an
opening tag, the element's content, and finally, a
closing tag.
q <p> - opening paragraph tag
q Element Content - paragraph content
q </p> - closing tag
Every webpage contains four basic elements -
html, head, title, and body elements.
HTML Elements
HTML Attribute
q Attribute provides additional information for a tag apart from
the text content to be marked.
q Comes in attribute name and value pairs
q Example attribute1=“value”
HTML Attributes
Try it out !
Try it out
Important Terms
qwww : World Wide Web
q Set of interconnected web pages
qURL : Uniform Resource Locator
qLocates each webpage uniquely. Address for webpages
qWeb Page : A single page on the Internet.
qWebsite : A collection of web pages.
qDomain Name: The registered address of the website. For
example, [Link], Flipkart. com, etc.
Domain Name
qDomain Name: The registered address of the website. For
example, [Link], Flipkart. com, etc.
Domain Name
q [Link] — Used for hosting a separate blog
section.
[Link] — Used for e-commerce or online stores.
[Link] — Often used for webmail access.
[Link] — Dedicated to help centers or
customer service hubs.
[Link] — Common for mobile-specific versions of a
site.
[Link] — Used to target specific languages (e.g.,
English) or regions.
Exercises
1) Try creating webpage on your own, which
provides your name, address, hobbies
(observation work)
2) Try creating a webpage with head content
alone (observation work)
3) Try creating a webpage with body content
alone
Thank You !!!
33