SlideShare una empresa de Scribd logo
Lesson 8:
Basic Web Page
Creation
What does Web Page
mean?
Web Page
A Web page is a document for the
World Wide Web that can be
accessed and displayed on a
monitor or smartphone using any
web browser.
Web Page
Web pages are made up of Hypertext
Markup Language (HTML) and can be
created and modified by using basic
application like Notepad and
professional HTML editors.
 HTML is Easy to Learn and Use
 HTML is Free
 Online Website Builder - Easy Use of
Drag-And-Drop Interface
WYSIWYG
 What You See Is What You Get
 Whatever you will type, insert, draw,
place, rearrange, or whatever you do on
a web page is what the audience will
see
HTML
 HTML stands for Hyper Text Markup
Language
 HTML describes the structure of a web page
 HTML consists of a series of elements
 HTML elements tell the browser how to
display the content
HTML
HTML elements are represented by TAGS
 HTML TAGS label pieces of content such as
“heading”, “paragraph”, “table” and so on...
 Browsers do not display the HTML tags, but
use them to render the content of the page
Requirements in creating a web
page using the html
1. Editor – using the Notepad (source code)
in text and extension name - .html or .htm.
2. Browser – responsible for reading HTML
instructions and displaying the web page
output. (ex. Internet Explorer, Mozilla
Firefox, Google Chrome)
Creating a Website Using
Notepad
Web pages can be created and modified using
professional HTML editors. However, in learning
HTML, it is better to use a simple text editor like
Notepad.
Follow the steps to create your first web page
with Notepad.
HTML document is divided into two main sections
the head and the body. Each section contains
specific information. The head section contains
information about the documents like title, search
engine or keywords but is not visible to the
reader. The body section contains the information
or content that you want to appear on the web
page.
EmpTech Lesson 8-Basic Web Page Creation.pptx
EmpTech Lesson 8-Basic Web Page Creation.pptx

Más contenido relacionado

La actualidad más candente

EMPOWERMENT TECHNOLOGIES QUARTER 2 LESSON 8
EMPOWERMENT TECHNOLOGIES QUARTER 2 LESSON 8EMPOWERMENT TECHNOLOGIES QUARTER 2 LESSON 8
EMPOWERMENT TECHNOLOGIES QUARTER 2 LESSON 8MjDayandayan
 
Empowerment technology lesson 1
Empowerment technology  lesson 1 Empowerment technology  lesson 1
Empowerment technology lesson 1 JeffreyMetrillo
 
10 Principles Of Effective Web Design
10 Principles Of Effective Web Design10 Principles Of Effective Web Design
10 Principles Of Effective Web Designsirferds
 
HTML5 - create hyperlinks and anchors
HTML5 - create hyperlinks and anchorsHTML5 - create hyperlinks and anchors
HTML5 - create hyperlinks and anchorsGrayzon Gonzales, LPT
 
EmpTech Lesson 13-Planning and Conceptualizing Social Advocacy.pdf
EmpTech Lesson 13-Planning and Conceptualizing Social Advocacy.pdfEmpTech Lesson 13-Planning and Conceptualizing Social Advocacy.pdf
EmpTech Lesson 13-Planning and Conceptualizing Social Advocacy.pdfliera silvan
 
Introduction to Joomla
Introduction to JoomlaIntroduction to Joomla
Introduction to JoomlaAsif Islam
 
How to create a Google Site
How to create a Google SiteHow to create a Google Site
How to create a Google SiteFiona Beal
 
Emptech Lesson 14-Research for Content in Social Advocay.pdf
Emptech Lesson 14-Research for Content in Social Advocay.pdfEmptech Lesson 14-Research for Content in Social Advocay.pdf
Emptech Lesson 14-Research for Content in Social Advocay.pdfliera silvan
 
HTML Start Up - Introduction to HTML
HTML Start Up - Introduction to HTMLHTML Start Up - Introduction to HTML
HTML Start Up - Introduction to HTMLGrayzon Gonzales, LPT
 
Different types of websites
Different types of websitesDifferent types of websites
Different types of websiteseNest Services
 
Web Design & Development - Session 1
Web Design & Development - Session 1Web Design & Development - Session 1
Web Design & Development - Session 1Shahrzad Peyman
 
Introduction to Web Development
Introduction to Web DevelopmentIntroduction to Web Development
Introduction to Web DevelopmentParvez Mahbub
 
Introduction to Web Components
Introduction to Web ComponentsIntroduction to Web Components
Introduction to Web ComponentsFu Cheng
 
Different Types Of Websites - With Basic Information
Different Types Of Websites - With Basic InformationDifferent Types Of Websites - With Basic Information
Different Types Of Websites - With Basic InformationAfzal Hameed
 

La actualidad más candente (20)

EMPOWERMENT TECHNOLOGIES QUARTER 2 LESSON 8
EMPOWERMENT TECHNOLOGIES QUARTER 2 LESSON 8EMPOWERMENT TECHNOLOGIES QUARTER 2 LESSON 8
EMPOWERMENT TECHNOLOGIES QUARTER 2 LESSON 8
 
Empowerment technology lesson 1
Empowerment technology  lesson 1 Empowerment technology  lesson 1
Empowerment technology lesson 1
 
10 Principles Of Effective Web Design
10 Principles Of Effective Web Design10 Principles Of Effective Web Design
10 Principles Of Effective Web Design
 
HTML5 - create hyperlinks and anchors
HTML5 - create hyperlinks and anchorsHTML5 - create hyperlinks and anchors
HTML5 - create hyperlinks and anchors
 
EmpTech Lesson 13-Planning and Conceptualizing Social Advocacy.pdf
EmpTech Lesson 13-Planning and Conceptualizing Social Advocacy.pdfEmpTech Lesson 13-Planning and Conceptualizing Social Advocacy.pdf
EmpTech Lesson 13-Planning and Conceptualizing Social Advocacy.pdf
 
World wide web
World wide webWorld wide web
World wide web
 
Introduction to Joomla
Introduction to JoomlaIntroduction to Joomla
Introduction to Joomla
 
How to create a Google Site
How to create a Google SiteHow to create a Google Site
How to create a Google Site
 
Emptech Lesson 14-Research for Content in Social Advocay.pdf
Emptech Lesson 14-Research for Content in Social Advocay.pdfEmptech Lesson 14-Research for Content in Social Advocay.pdf
Emptech Lesson 14-Research for Content in Social Advocay.pdf
 
Html Slide Part-1
Html Slide Part-1Html Slide Part-1
Html Slide Part-1
 
HTML Start Up - Introduction to HTML
HTML Start Up - Introduction to HTMLHTML Start Up - Introduction to HTML
HTML Start Up - Introduction to HTML
 
Different types of websites
Different types of websitesDifferent types of websites
Different types of websites
 
Dream weaver ppt
Dream weaver pptDream weaver ppt
Dream weaver ppt
 
Basics for hosting a website
Basics for hosting a websiteBasics for hosting a website
Basics for hosting a website
 
Web Design & Development - Session 1
Web Design & Development - Session 1Web Design & Development - Session 1
Web Design & Development - Session 1
 
Introduction to Web Development
Introduction to Web DevelopmentIntroduction to Web Development
Introduction to Web Development
 
Introduction to Web Components
Introduction to Web ComponentsIntroduction to Web Components
Introduction to Web Components
 
Different Types Of Websites - With Basic Information
Different Types Of Websites - With Basic InformationDifferent Types Of Websites - With Basic Information
Different Types Of Websites - With Basic Information
 
Web Page Designing Using HTML
Web Page Designing Using HTMLWeb Page Designing Using HTML
Web Page Designing Using HTML
 
Web Standards
Web StandardsWeb Standards
Web Standards
 

Similar a EmpTech Lesson 8-Basic Web Page Creation.pptx

Similar a EmpTech Lesson 8-Basic Web Page Creation.pptx (20)

CreatingWebPages-Part1.ppt
CreatingWebPages-Part1.pptCreatingWebPages-Part1.ppt
CreatingWebPages-Part1.ppt
 
Html Concept
Html ConceptHtml Concept
Html Concept
 
Html basic
Html basicHtml basic
Html basic
 
WHAT IS HTML.pdf
WHAT IS HTML.pdfWHAT IS HTML.pdf
WHAT IS HTML.pdf
 
WHAT IS HTML.pdf
WHAT IS HTML.pdfWHAT IS HTML.pdf
WHAT IS HTML.pdf
 
WHAT IS HTML.pdf
WHAT IS HTML.pdfWHAT IS HTML.pdf
WHAT IS HTML.pdf
 
Internet programming notes
Internet programming notesInternet programming notes
Internet programming notes
 
Grade 7_HTML.pptx
Grade 7_HTML.pptxGrade 7_HTML.pptx
Grade 7_HTML.pptx
 
Html
HtmlHtml
Html
 
Graphics For Web
Graphics For WebGraphics For Web
Graphics For Web
 
Importance of HTML
Importance of HTMLImportance of HTML
Importance of HTML
 
What is html and how it uses/
What is html and how it uses/What is html and how it uses/
What is html and how it uses/
 
Tutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web PagesTutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web Pages
 
Tutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web PagesTutorial 08 - Creating Effective Web Pages
Tutorial 08 - Creating Effective Web Pages
 
Let me design
Let me designLet me design
Let me design
 
Dynamic html (#1)
Dynamic  html (#1)Dynamic  html (#1)
Dynamic html (#1)
 
Module 1
Module 1Module 1
Module 1
 
Html
HtmlHtml
Html
 
What is html ?
What is html ?What is html ?
What is html ?
 
Tutorial 8 - Creating Effective Web Pages
Tutorial 8 - Creating Effective Web PagesTutorial 8 - Creating Effective Web Pages
Tutorial 8 - Creating Effective Web Pages
 

Último

The Challenger.pdf DNHS Official Publication
The Challenger.pdf DNHS Official PublicationThe Challenger.pdf DNHS Official Publication
The Challenger.pdf DNHS Official PublicationDelapenabediema
 
Embracing GenAI - A Strategic Imperative
Embracing GenAI - A Strategic ImperativeEmbracing GenAI - A Strategic Imperative
Embracing GenAI - A Strategic ImperativePeter Windle
 
plant breeding methods in asexually or clonally propagated crops
plant breeding methods in asexually or clonally propagated cropsplant breeding methods in asexually or clonally propagated crops
plant breeding methods in asexually or clonally propagated cropsparmarsneha2
 
PART A. Introduction to Costumer Service
PART A. Introduction to Costumer ServicePART A. Introduction to Costumer Service
PART A. Introduction to Costumer ServicePedroFerreira53928
 
Basic phrases for greeting and assisting costumers
Basic phrases for greeting and assisting costumersBasic phrases for greeting and assisting costumers
Basic phrases for greeting and assisting costumersPedroFerreira53928
 
How to Split Bills in the Odoo 17 POS Module
How to Split Bills in the Odoo 17 POS ModuleHow to Split Bills in the Odoo 17 POS Module
How to Split Bills in the Odoo 17 POS ModuleCeline George
 
Sha'Carri Richardson Presentation 202345
Sha'Carri Richardson Presentation 202345Sha'Carri Richardson Presentation 202345
Sha'Carri Richardson Presentation 202345beazzy04
 
2024.06.01 Introducing a competency framework for languag learning materials ...
2024.06.01 Introducing a competency framework for languag learning materials ...2024.06.01 Introducing a competency framework for languag learning materials ...
2024.06.01 Introducing a competency framework for languag learning materials ...Sandy Millin
 
The approach at University of Liverpool.pptx
The approach at University of Liverpool.pptxThe approach at University of Liverpool.pptx
The approach at University of Liverpool.pptxJisc
 
How to Break the cycle of negative Thoughts
How to Break the cycle of negative ThoughtsHow to Break the cycle of negative Thoughts
How to Break the cycle of negative ThoughtsCol Mukteshwar Prasad
 
Unit 8 - Information and Communication Technology (Paper I).pdf
Unit 8 - Information and Communication Technology (Paper I).pdfUnit 8 - Information and Communication Technology (Paper I).pdf
Unit 8 - Information and Communication Technology (Paper I).pdfThiyagu K
 
The Roman Empire A Historical Colossus.pdf
The Roman Empire A Historical Colossus.pdfThe Roman Empire A Historical Colossus.pdf
The Roman Empire A Historical Colossus.pdfkaushalkr1407
 
Basic Civil Engineering Notes of Chapter-6, Topic- Ecosystem, Biodiversity G...
Basic Civil Engineering Notes of Chapter-6,  Topic- Ecosystem, Biodiversity G...Basic Civil Engineering Notes of Chapter-6,  Topic- Ecosystem, Biodiversity G...
Basic Civil Engineering Notes of Chapter-6, Topic- Ecosystem, Biodiversity G...Denish Jangid
 
Sectors of the Indian Economy - Class 10 Study Notes pdf
Sectors of the Indian Economy - Class 10 Study Notes pdfSectors of the Indian Economy - Class 10 Study Notes pdf
Sectors of the Indian Economy - Class 10 Study Notes pdfVivekanand Anglo Vedic Academy
 
Supporting (UKRI) OA monographs at Salford.pptx
Supporting (UKRI) OA monographs at Salford.pptxSupporting (UKRI) OA monographs at Salford.pptx
Supporting (UKRI) OA monographs at Salford.pptxJisc
 
Cambridge International AS A Level Biology Coursebook - EBook (MaryFosbery J...
Cambridge International AS  A Level Biology Coursebook - EBook (MaryFosbery J...Cambridge International AS  A Level Biology Coursebook - EBook (MaryFosbery J...
Cambridge International AS A Level Biology Coursebook - EBook (MaryFosbery J...AzmatAli747758
 
NLC-2024-Orientation-for-RO-SDO (1).pptx
NLC-2024-Orientation-for-RO-SDO (1).pptxNLC-2024-Orientation-for-RO-SDO (1).pptx
NLC-2024-Orientation-for-RO-SDO (1).pptxssuserbdd3e8
 

Último (20)

The Challenger.pdf DNHS Official Publication
The Challenger.pdf DNHS Official PublicationThe Challenger.pdf DNHS Official Publication
The Challenger.pdf DNHS Official Publication
 
Embracing GenAI - A Strategic Imperative
Embracing GenAI - A Strategic ImperativeEmbracing GenAI - A Strategic Imperative
Embracing GenAI - A Strategic Imperative
 
plant breeding methods in asexually or clonally propagated crops
plant breeding methods in asexually or clonally propagated cropsplant breeding methods in asexually or clonally propagated crops
plant breeding methods in asexually or clonally propagated crops
 
PART A. Introduction to Costumer Service
PART A. Introduction to Costumer ServicePART A. Introduction to Costumer Service
PART A. Introduction to Costumer Service
 
Basic phrases for greeting and assisting costumers
Basic phrases for greeting and assisting costumersBasic phrases for greeting and assisting costumers
Basic phrases for greeting and assisting costumers
 
How to Split Bills in the Odoo 17 POS Module
How to Split Bills in the Odoo 17 POS ModuleHow to Split Bills in the Odoo 17 POS Module
How to Split Bills in the Odoo 17 POS Module
 
Chapter 3 - Islamic Banking Products and Services.pptx
Chapter 3 - Islamic Banking Products and Services.pptxChapter 3 - Islamic Banking Products and Services.pptx
Chapter 3 - Islamic Banking Products and Services.pptx
 
Introduction to Quality Improvement Essentials
Introduction to Quality Improvement EssentialsIntroduction to Quality Improvement Essentials
Introduction to Quality Improvement Essentials
 
Sha'Carri Richardson Presentation 202345
Sha'Carri Richardson Presentation 202345Sha'Carri Richardson Presentation 202345
Sha'Carri Richardson Presentation 202345
 
2024.06.01 Introducing a competency framework for languag learning materials ...
2024.06.01 Introducing a competency framework for languag learning materials ...2024.06.01 Introducing a competency framework for languag learning materials ...
2024.06.01 Introducing a competency framework for languag learning materials ...
 
The approach at University of Liverpool.pptx
The approach at University of Liverpool.pptxThe approach at University of Liverpool.pptx
The approach at University of Liverpool.pptx
 
How to Break the cycle of negative Thoughts
How to Break the cycle of negative ThoughtsHow to Break the cycle of negative Thoughts
How to Break the cycle of negative Thoughts
 
Unit 8 - Information and Communication Technology (Paper I).pdf
Unit 8 - Information and Communication Technology (Paper I).pdfUnit 8 - Information and Communication Technology (Paper I).pdf
Unit 8 - Information and Communication Technology (Paper I).pdf
 
The Roman Empire A Historical Colossus.pdf
The Roman Empire A Historical Colossus.pdfThe Roman Empire A Historical Colossus.pdf
The Roman Empire A Historical Colossus.pdf
 
Basic Civil Engineering Notes of Chapter-6, Topic- Ecosystem, Biodiversity G...
Basic Civil Engineering Notes of Chapter-6,  Topic- Ecosystem, Biodiversity G...Basic Civil Engineering Notes of Chapter-6,  Topic- Ecosystem, Biodiversity G...
Basic Civil Engineering Notes of Chapter-6, Topic- Ecosystem, Biodiversity G...
 
Sectors of the Indian Economy - Class 10 Study Notes pdf
Sectors of the Indian Economy - Class 10 Study Notes pdfSectors of the Indian Economy - Class 10 Study Notes pdf
Sectors of the Indian Economy - Class 10 Study Notes pdf
 
Supporting (UKRI) OA monographs at Salford.pptx
Supporting (UKRI) OA monographs at Salford.pptxSupporting (UKRI) OA monographs at Salford.pptx
Supporting (UKRI) OA monographs at Salford.pptx
 
Cambridge International AS A Level Biology Coursebook - EBook (MaryFosbery J...
Cambridge International AS  A Level Biology Coursebook - EBook (MaryFosbery J...Cambridge International AS  A Level Biology Coursebook - EBook (MaryFosbery J...
Cambridge International AS A Level Biology Coursebook - EBook (MaryFosbery J...
 
NLC-2024-Orientation-for-RO-SDO (1).pptx
NLC-2024-Orientation-for-RO-SDO (1).pptxNLC-2024-Orientation-for-RO-SDO (1).pptx
NLC-2024-Orientation-for-RO-SDO (1).pptx
 
B.ed spl. HI pdusu exam paper-2023-24.pdf
B.ed spl. HI pdusu exam paper-2023-24.pdfB.ed spl. HI pdusu exam paper-2023-24.pdf
B.ed spl. HI pdusu exam paper-2023-24.pdf
 

EmpTech Lesson 8-Basic Web Page Creation.pptx

  • 1. Lesson 8: Basic Web Page Creation
  • 2. What does Web Page mean?
  • 3. Web Page A Web page is a document for the World Wide Web that can be accessed and displayed on a monitor or smartphone using any web browser.
  • 4. Web Page Web pages are made up of Hypertext Markup Language (HTML) and can be created and modified by using basic application like Notepad and professional HTML editors.
  • 5.  HTML is Easy to Learn and Use  HTML is Free  Online Website Builder - Easy Use of Drag-And-Drop Interface
  • 6. WYSIWYG  What You See Is What You Get  Whatever you will type, insert, draw, place, rearrange, or whatever you do on a web page is what the audience will see
  • 7. HTML  HTML stands for Hyper Text Markup Language  HTML describes the structure of a web page  HTML consists of a series of elements  HTML elements tell the browser how to display the content
  • 8. HTML HTML elements are represented by TAGS  HTML TAGS label pieces of content such as “heading”, “paragraph”, “table” and so on...  Browsers do not display the HTML tags, but use them to render the content of the page
  • 9. Requirements in creating a web page using the html 1. Editor – using the Notepad (source code) in text and extension name - .html or .htm. 2. Browser – responsible for reading HTML instructions and displaying the web page output. (ex. Internet Explorer, Mozilla Firefox, Google Chrome)
  • 10. Creating a Website Using Notepad Web pages can be created and modified using professional HTML editors. However, in learning HTML, it is better to use a simple text editor like Notepad. Follow the steps to create your first web page with Notepad.
  • 11.
  • 12.
  • 13. HTML document is divided into two main sections the head and the body. Each section contains specific information. The head section contains information about the documents like title, search engine or keywords but is not visible to the reader. The body section contains the information or content that you want to appear on the web page.