WELCOME
TO OUR TLE
CLASS!
TLE 8 - ICT
Webpage Design Using HTML/CSS
WEBPAGE
DESIGN USING
HTML/CSS
INTRODUCTION
• How often do you browse the internet?
• How did the pandemic and the internet
changed the way you live today?
• How did the internet help you in the
new normal education?
• Have you ever wondered how these
websites are created?
INTRODUCTION
TO HTML
Specific Learning Objectives:
At the end of the discussion, you should be able to:
Define what HTML Explain what a Familiarize with Determine the
is; simple HTML the basics of purpose of Web
document is; HTML elements browsers.
and HTML
structure;
WHAT IS
HTML?
WHAT IS HTML?
• Tim Berners-Lee (1990).
• Hypertext Markup Language.
• It is the standard markup language.
• Create electronic documents (pages) that
are displayed on the World Wide Web.
• It ensures the proper formatting of text and
images for your internet browser.
• Without HTML a browser would not know
how to display text as elements or load
images or other elements.
• Each page contains a series of connections
to other pages called hyperlinks.
• HTML is the structure, Cascading Style
Sheets (CSS) is the appearance.
WHAT IS AN HTML
DOCUMENT?
HTML Document
• Text document saved with the
extension “.html” or “.htm”.
• It contains texts and some tags
written between “< >” which
gives the instructions needed to
configure the webpage.
HTML Document
<!DOCTYPE html>
It is a declaration
that defines that
this document is
an HTML5
Document.
HTML Document
<html>
It is an opening tag
which lets the
browser know that it
is reading HTML code.
HTML Document
<head>
It contains
information about
the page, such as
its title, meta tags,
and where to
locate the CSS file.
HTML Document
<title>
It specifies a title for the
HTML page (which is shown
in the browser's title bar or
in the page's tab).
HTML Document
<body>
It is a container for all
the visible contents,
such as headings,
paragraphs, images,
hyperlinks, tables, lists,
etc.
HTML Document
<p>
This element
defines a
paragraph.
HTML Document
<h1>
This element defines a large
heading.