SlideShare a Scribd company logo
By: Miguel A. Martínez
Course: Principios Tecnológicos
Table of Contents
 What is HTML?
 What is the difference between a
  programming language and a
  markup language?
 How does HTML work?
 Tags and Attributes
 Making your first simple web page
What is HTML?

 HTML stands   for Hyper Text Markup
  Language
 It is a computer language that is used to
  create web sites.
 A web site is created by many lines of
  short codes using this language.
 With a web browser, the .html document
  can be seen as the web site that was
  formed by the numerous line of code.
 HyperText   is the method by which
  you move around on the web —
  by clicking on special text
  called hyperlinks which bring
  you to the next page.
 Click Here
HTML
 Markup    is what HTML
  tags do to the text inside
  them. They mark it as a
  certain type of text
  (italicized text, for example).
 HTML is a Language, as it
  has code-words and syntax
  like any other language.
What is the difference between
a programming language and a
markup language?
 Markup  language by its definition “is
 a modern system for annotating a
 text in a way that is syntactically
 distinguishable from that text." For
 example, in HTML, you have your
 text. Then you have your Hyper Text
 Markup Language which defines
 how that text should look.
 Programming  language is designed
 to communicate instructions to a
 computer. So the main difference is
 that programming languages are
 designed to write programs and
 software. A markup language is
 designed to manipulate the content
 it's marking up, hence the term
 Markup Language.
How does HTML work?
 The   HTML documents known by the
  file type .html or .htm are composed
  of its elements. These are its tags
  and its plain text.
 Tags are what separate normal text
  from HTML text.
 These tags are keywords
  surrounded by angle brackets like
  so: <html>.
Tags and Attributes
 HTML tags   come in pairs, their
  opening tags and their closing tags,
  like so: <p> </p>.
 The start and end tags are what
  define a certain effect on the web
  page, and what is written between
  them is what the start and end tags
  make an effect on.
 Exception: Only has opening tags:
  some can only be like so: <br>.
 Attributes  provide additional
  information about the element.
 They are specified in the start tag
  with a name and its value, like so:
  <a
  href="http://www.w3schools.com">T
  his is a link</a>
Making your first simple web
    page
   <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML
    4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
      <title>My First HTML Page</title>
    </head>
    <body>
      My text goes here.
    </body>
    </html>
References
   http://en.wikipedia.org/wiki/HTML#Markup
   http://www.w3schools.com
   http://www.yourhtmlsource.com
   http://www.web-
    source.net/html_codes_chart.htm
   http://en.wikipedia.org/wiki/Programming_l
    anguage
   http://en.wikipedia.org/wiki/Markup_langua
    ges

More Related Content

PPTX
What is html
PPTX
What is html and how it uses/
PPTX
What is html
PPTX
1 introductin to HTML
PPTX
Introduction to basic HTML [Librarian edition]
PPTX
Hypertext markup language (html)
PPT
Basic html
PPT
Dynamic html (#1)
What is html
What is html and how it uses/
What is html
1 introductin to HTML
Introduction to basic HTML [Librarian edition]
Hypertext markup language (html)
Basic html
Dynamic html (#1)

What's hot (20)

PPTX
Basic knowledge on html and dhtml
PPTX
Html tag
PPTX
The Difference between HTML, XHTML & HTML5 for Beginners
PPTX
Html lecture1
PPTX
Lecture 2 introduction to html basics
PPT
Html basic
DOCX
INTRODUCTION TO HTML
PPTX
HTML and DHTML
PPTX
Basic HTML
PPTX
HTML- Hyper Text Markup Language
PPT
Html for beginners part I
PPTX
HTML (Hyper Text Markup Language)
PDF
[Basic HTML/CSS] 1. html - basic tags
PPT
PPTX
PPTX
Class2
PPTX
HTML5 and DHTML
PPT
Hyper Text Mark-up Language
PPT
Basic knowledge on html and dhtml
Html tag
The Difference between HTML, XHTML & HTML5 for Beginners
Html lecture1
Lecture 2 introduction to html basics
Html basic
INTRODUCTION TO HTML
HTML and DHTML
Basic HTML
HTML- Hyper Text Markup Language
Html for beginners part I
HTML (Hyper Text Markup Language)
[Basic HTML/CSS] 1. html - basic tags
Class2
HTML5 and DHTML
Hyper Text Mark-up Language
Ad

Viewers also liked (19)

PDF
1989 -como interpretar un plano
PPTX
时尚品分享社区调研分析
PDF
Tieng anh chuyen_nganh_cntt_-_ly_thuyet
DOC
Proyecto
PPT
Green presentation complate
PPT
шаблон презентации результатов работы
PDF
100 cau gioi_tu_dap_an_9373(1)
PPTX
Cèsar Manjarrez
DOC
To be print_all
PPT
Omni Intro
PPTX
Fabricio Arèvalo
PPT
шаблон презентации результатов работы
PPTX
The Present Perfect Tense
PDF
Leer es mi cuento
PPT
historia-de-enfermeria
PPTX
The verb be in the past (was and were)
PDF
NRF 2017 : Compte-rendu et analyse signés Niji
1989 -como interpretar un plano
时尚品分享社区调研分析
Tieng anh chuyen_nganh_cntt_-_ly_thuyet
Proyecto
Green presentation complate
шаблон презентации результатов работы
100 cau gioi_tu_dap_an_9373(1)
Cèsar Manjarrez
To be print_all
Omni Intro
Fabricio Arèvalo
шаблон презентации результатов работы
The Present Perfect Tense
Leer es mi cuento
historia-de-enfermeria
The verb be in the past (was and were)
NRF 2017 : Compte-rendu et analyse signés Niji
Ad

Similar to HTML (20)

PPTX
html -Hyper Text Markup Languagejjjjjjjjjjjjjjjjjjjjjjjjj
PDF
HTML Basics.pdf
PPTX
How to learn HTML in 10 Days
PPTX
web pro web pro web pro web pro v w.pptx
PPT
Introduction of HTML Language for Basics.ppt
PPT
Html for Beginners
PPTX
Unit_II.pptx thtrhththtrhjjuyujymkfhtyhkmythkymkykymnkmyjnmyjmnykn
PPTX
Basic HTML
PPTX
Html in Web design and Development.pptxt.pptx
PPT
Html book2
PDF
Introduction to HTML
PPTX
Lec 2 Web.pptxLec 2 Web.pptxLec 2 Web.pptx
PPT
Html basics
PPTX
PPTX
web programming, Introduction to html tags
PPTX
web design
PPTX
3 1-html-fundamentals-110302100520-phpapp02
PPTX
HTML Fundamentals
PPTX
Web design - HTML (Hypertext Markup Language) introduction
html -Hyper Text Markup Languagejjjjjjjjjjjjjjjjjjjjjjjjj
HTML Basics.pdf
How to learn HTML in 10 Days
web pro web pro web pro web pro v w.pptx
Introduction of HTML Language for Basics.ppt
Html for Beginners
Unit_II.pptx thtrhththtrhjjuyujymkfhtyhkmythkymkykymnkmyjnmyjmnykn
Basic HTML
Html in Web design and Development.pptxt.pptx
Html book2
Introduction to HTML
Lec 2 Web.pptxLec 2 Web.pptxLec 2 Web.pptx
Html basics
web programming, Introduction to html tags
web design
3 1-html-fundamentals-110302100520-phpapp02
HTML Fundamentals
Web design - HTML (Hypertext Markup Language) introduction

Recently uploaded (20)

PDF
Assigned Numbers - 2025 - Bluetooth® Document
PDF
Univ-Connecticut-ChatGPT-Presentaion.pdf
PDF
WOOl fibre morphology and structure.pdf for textiles
PDF
MIND Revenue Release Quarter 2 2025 Press Release
PPTX
A Presentation on Artificial Intelligence
PDF
project resource management chapter-09.pdf
PDF
DP Operators-handbook-extract for the Mautical Institute
PDF
A comparative analysis of optical character recognition models for extracting...
PDF
Unlocking AI with Model Context Protocol (MCP)
PDF
Accuracy of neural networks in brain wave diagnosis of schizophrenia
PDF
A comparative study of natural language inference in Swahili using monolingua...
PPTX
OMC Textile Division Presentation 2021.pptx
PDF
Encapsulation theory and applications.pdf
PPTX
Group 1 Presentation -Planning and Decision Making .pptx
PDF
7 ChatGPT Prompts to Help You Define Your Ideal Customer Profile.pdf
PDF
Web App vs Mobile App What Should You Build First.pdf
PDF
Microsoft Solutions Partner Drive Digital Transformation with D365.pdf
PDF
1 - Historical Antecedents, Social Consideration.pdf
PPTX
cloud_computing_Infrastucture_as_cloud_p
PDF
gpt5_lecture_notes_comprehensive_20250812015547.pdf
Assigned Numbers - 2025 - Bluetooth® Document
Univ-Connecticut-ChatGPT-Presentaion.pdf
WOOl fibre morphology and structure.pdf for textiles
MIND Revenue Release Quarter 2 2025 Press Release
A Presentation on Artificial Intelligence
project resource management chapter-09.pdf
DP Operators-handbook-extract for the Mautical Institute
A comparative analysis of optical character recognition models for extracting...
Unlocking AI with Model Context Protocol (MCP)
Accuracy of neural networks in brain wave diagnosis of schizophrenia
A comparative study of natural language inference in Swahili using monolingua...
OMC Textile Division Presentation 2021.pptx
Encapsulation theory and applications.pdf
Group 1 Presentation -Planning and Decision Making .pptx
7 ChatGPT Prompts to Help You Define Your Ideal Customer Profile.pdf
Web App vs Mobile App What Should You Build First.pdf
Microsoft Solutions Partner Drive Digital Transformation with D365.pdf
1 - Historical Antecedents, Social Consideration.pdf
cloud_computing_Infrastucture_as_cloud_p
gpt5_lecture_notes_comprehensive_20250812015547.pdf

HTML

  • 1. By: Miguel A. Martínez Course: Principios Tecnológicos
  • 2. Table of Contents  What is HTML?  What is the difference between a programming language and a markup language?  How does HTML work?  Tags and Attributes  Making your first simple web page
  • 3. What is HTML?  HTML stands for Hyper Text Markup Language  It is a computer language that is used to create web sites.  A web site is created by many lines of short codes using this language.  With a web browser, the .html document can be seen as the web site that was formed by the numerous line of code.
  • 4.  HyperText is the method by which you move around on the web — by clicking on special text called hyperlinks which bring you to the next page.  Click Here
  • 6.  Markup is what HTML tags do to the text inside them. They mark it as a certain type of text (italicized text, for example).  HTML is a Language, as it has code-words and syntax like any other language.
  • 7. What is the difference between a programming language and a markup language?  Markup language by its definition “is a modern system for annotating a text in a way that is syntactically distinguishable from that text." For example, in HTML, you have your text. Then you have your Hyper Text Markup Language which defines how that text should look.
  • 8.  Programming language is designed to communicate instructions to a computer. So the main difference is that programming languages are designed to write programs and software. A markup language is designed to manipulate the content it's marking up, hence the term Markup Language.
  • 9. How does HTML work?  The HTML documents known by the file type .html or .htm are composed of its elements. These are its tags and its plain text.  Tags are what separate normal text from HTML text.  These tags are keywords surrounded by angle brackets like so: <html>.
  • 10. Tags and Attributes  HTML tags come in pairs, their opening tags and their closing tags, like so: <p> </p>.  The start and end tags are what define a certain effect on the web page, and what is written between them is what the start and end tags make an effect on.  Exception: Only has opening tags: some can only be like so: <br>.
  • 11.  Attributes provide additional information about the element.  They are specified in the start tag with a name and its value, like so: <a href="http://www.w3schools.com">T his is a link</a>
  • 12. Making your first simple web page  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>My First HTML Page</title> </head> <body> My text goes here. </body> </html>
  • 13. References  http://en.wikipedia.org/wiki/HTML#Markup  http://www.w3schools.com  http://www.yourhtmlsource.com  http://www.web- source.net/html_codes_chart.htm  http://en.wikipedia.org/wiki/Programming_l anguage  http://en.wikipedia.org/wiki/Markup_langua ges