SlideShare una empresa de Scribd logo
1 de 14
Introduction to HTML
A workshop by Xolani Madlopha
What is HTML?
• It is an abbreviation for Hyper Text Markup Language.
• In creating the website, it focuses more on the content of the
website.
• It is the type of coding or hypertext that one needs to know when
adding content to the website or webpage they are creating.
• HTML is gotten from a dialect SGML (Standard
Illustrations Markup Language).
• The eventual fate of HTML is XML (eXtended Markup
Dialect).
• HTML isn't a programming dialect, it is a Markup
Dialect.
• A markup dialect is an arrangement of markup labels.
• A tag is constantly encased in edge section
<>like <HTML>
• HTML labels ordinarily come in sets like
<HTML> and </HTML> i.e.
Begin tag = <HTML>
End tag =</HTML>
• Start and end labels are additionally called opening
labels and shutting labels
BASIC STRUCTURE OF HTML
<html>
<head></head>
<body></body>
</html>
THESE BASIC STRUCTURES ARE VERY ESSENTIAL AND
MUST BE ALWAYS THERE AND USED IN YOUR HTML.
• <HTML> - Describe HTML web page that is
to be viewed by a web browser.
• <HEAD> - This defines the header section
of the page.
• <TITLE> - This shows a caption in the title
bar of the page.
• <BODY> - This tag show contents of the
web page will be displayed.
THE BASIC HTML TAGS APPLIED LIKE THIS:
<html>
<head>
Write your heading and other top things you need to mention
</head>
<body> write the full content and paragraphs here
write the full content and paragraphs here
write the full content and paragraphs here
</body>
</html>
Heading Element:->
• There are six heading elements
(<H1>,<H2>,<H3>,<H4>, <H5>,<H6>).
• All the six heading elements are container
tag and requires a closing tag.
• <h1> will print the largest heading
• <h6> will print the smallest heading
The visual description of how headers
make your headings to be:
How to start
• You can use Notepad or Notepad ++
• Write the codes and tags with the content incide the notepad/
notepad ++
• Then save the file with these extensions: (.Htm), (.Htm).
• Click on that file and open it with Chrome, Internet Explorer etc. to
see if the content is displayed in a web format.
REFERENCES
Reddy. Y, (2013), Introduction to html, Slideshare.net,
(Accesed on 2 September 2018)
Calvert. S, Swift. B, (2013), Html css-presentation,
Slideshare.net, (Accesed on 2 September 2018)
Patni. S, (2018), introduction to html, Slideshare.net
Mayalisa, (2018), Introduction to html, Slideshare.net,
(Accesed on 2 September 2018)

Más contenido relacionado

La actualidad más candente (20)

Html 5
Html 5Html 5
Html 5
 
Week 4 Lecture Part 2
Week 4 Lecture Part 2Week 4 Lecture Part 2
Week 4 Lecture Part 2
 
Html
HtmlHtml
Html
 
HTML
HTMLHTML
HTML
 
uptu web technology unit 2 html
uptu web technology unit 2 htmluptu web technology unit 2 html
uptu web technology unit 2 html
 
Html training part1
Html training part1Html training part1
Html training part1
 
[Basic HTML/CSS] 1. html - basic tags
[Basic HTML/CSS] 1. html - basic tags[Basic HTML/CSS] 1. html - basic tags
[Basic HTML/CSS] 1. html - basic tags
 
Lesson 1: Introduction to HTML
Lesson 1: Introduction to HTMLLesson 1: Introduction to HTML
Lesson 1: Introduction to HTML
 
Html
HtmlHtml
Html
 
An Introduction to HTML
An Introduction to HTMLAn Introduction to HTML
An Introduction to HTML
 
Html introduction
Html introductionHtml introduction
Html introduction
 
How to create basic webpage
How to create basic webpageHow to create basic webpage
How to create basic webpage
 
Ict html
Ict htmlIct html
Ict html
 
HTML- Hyper Text Markup Language
HTML- Hyper Text Markup LanguageHTML- Hyper Text Markup Language
HTML- Hyper Text Markup Language
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
 
SEO Training in Noida- Skyinfotech.in
SEO Training in Noida- Skyinfotech.inSEO Training in Noida- Skyinfotech.in
SEO Training in Noida- Skyinfotech.in
 
Html
HtmlHtml
Html
 
HTML5
HTML5 HTML5
HTML5
 
Html
HtmlHtml
Html
 
Html vs xhtml
Html vs xhtmlHtml vs xhtml
Html vs xhtml
 

Similar a 215077679 introduction to HTML (20)

Ankit (221348051) BCA-Aiml.pptx
Ankit (221348051) BCA-Aiml.pptxAnkit (221348051) BCA-Aiml.pptx
Ankit (221348051) BCA-Aiml.pptx
 
HYPER TEXT MARKUP LANGUAGE BASIC LESSONS
HYPER TEXT MARKUP LANGUAGE BASIC LESSONSHYPER TEXT MARKUP LANGUAGE BASIC LESSONS
HYPER TEXT MARKUP LANGUAGE BASIC LESSONS
 
Basic HTML
Basic HTMLBasic HTML
Basic HTML
 
Html - Tutorial
Html - TutorialHtml - Tutorial
Html - Tutorial
 
HTML 5 Tutorial
HTML 5 TutorialHTML 5 Tutorial
HTML 5 Tutorial
 
HTML & CSS.ppt
HTML & CSS.pptHTML & CSS.ppt
HTML & CSS.ppt
 
Slides 2 - HTML
Slides 2 - HTMLSlides 2 - HTML
Slides 2 - HTML
 
Html
HtmlHtml
Html
 
What is html
What is htmlWhat is html
What is html
 
Lecture 2 introduction to html
Lecture 2  introduction to htmlLecture 2  introduction to html
Lecture 2 introduction to html
 
Handout1 intro to html
Handout1 intro to htmlHandout1 intro to html
Handout1 intro to html
 
Html and its tags
Html and its tagsHtml and its tags
Html and its tags
 
An-Introduction-to-HTML
An-Introduction-to-HTMLAn-Introduction-to-HTML
An-Introduction-to-HTML
 
Basic Html Notes
Basic Html NotesBasic Html Notes
Basic Html Notes
 
Class1slides
Class1slidesClass1slides
Class1slides
 
Html
HtmlHtml
Html
 
2a web technology html basics 1
2a web technology html basics 12a web technology html basics 1
2a web technology html basics 1
 
Html tutorial
Html tutorialHtml tutorial
Html tutorial
 
Html tutorial
Html tutorialHtml tutorial
Html tutorial
 
Html tutorial
Html tutorialHtml tutorial
Html tutorial
 

Último

Application orientated numerical on hev.ppt
Application orientated numerical on hev.pptApplication orientated numerical on hev.ppt
Application orientated numerical on hev.pptRamjanShidvankar
 
Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...Association for Project Management
 
Introduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The BasicsIntroduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The BasicsTechSoup
 
Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)Jisc
 
ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.MaryamAhmad92
 
SOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning PresentationSOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning Presentationcamerronhm
 
Towards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptxTowards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptxJisc
 
Unit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptxUnit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptxVishalSingh1417
 
Understanding Accommodations and Modifications
Understanding  Accommodations and ModificationsUnderstanding  Accommodations and Modifications
Understanding Accommodations and ModificationsMJDuyan
 
Single or Multiple melodic lines structure
Single or Multiple melodic lines structureSingle or Multiple melodic lines structure
Single or Multiple melodic lines structuredhanjurrannsibayan2
 
Python Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxPython Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxRamakrishna Reddy Bijjam
 
Dyslexia AI Workshop for Slideshare.pptx
Dyslexia AI Workshop for Slideshare.pptxDyslexia AI Workshop for Slideshare.pptx
Dyslexia AI Workshop for Slideshare.pptxcallscotland1987
 
ComPTIA Overview | Comptia Security+ Book SY0-701
ComPTIA Overview | Comptia Security+ Book SY0-701ComPTIA Overview | Comptia Security+ Book SY0-701
ComPTIA Overview | Comptia Security+ Book SY0-701bronxfugly43
 
Fostering Friendships - Enhancing Social Bonds in the Classroom
Fostering Friendships - Enhancing Social Bonds  in the ClassroomFostering Friendships - Enhancing Social Bonds  in the Classroom
Fostering Friendships - Enhancing Social Bonds in the ClassroomPooky Knightsmith
 
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxHMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxEsquimalt MFRC
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfAdmir Softic
 
Unit-IV; Professional Sales Representative (PSR).pptx
Unit-IV; Professional Sales Representative (PSR).pptxUnit-IV; Professional Sales Representative (PSR).pptx
Unit-IV; Professional Sales Representative (PSR).pptxVishalSingh1417
 
This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.christianmathematics
 

Último (20)

Application orientated numerical on hev.ppt
Application orientated numerical on hev.pptApplication orientated numerical on hev.ppt
Application orientated numerical on hev.ppt
 
Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...
 
Spatium Project Simulation student brief
Spatium Project Simulation student briefSpatium Project Simulation student brief
Spatium Project Simulation student brief
 
Introduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The BasicsIntroduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The Basics
 
Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)
 
ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.
 
SOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning PresentationSOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning Presentation
 
Towards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptxTowards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptx
 
Unit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptxUnit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptx
 
Understanding Accommodations and Modifications
Understanding  Accommodations and ModificationsUnderstanding  Accommodations and Modifications
Understanding Accommodations and Modifications
 
Single or Multiple melodic lines structure
Single or Multiple melodic lines structureSingle or Multiple melodic lines structure
Single or Multiple melodic lines structure
 
Python Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxPython Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docx
 
Dyslexia AI Workshop for Slideshare.pptx
Dyslexia AI Workshop for Slideshare.pptxDyslexia AI Workshop for Slideshare.pptx
Dyslexia AI Workshop for Slideshare.pptx
 
ComPTIA Overview | Comptia Security+ Book SY0-701
ComPTIA Overview | Comptia Security+ Book SY0-701ComPTIA Overview | Comptia Security+ Book SY0-701
ComPTIA Overview | Comptia Security+ Book SY0-701
 
Fostering Friendships - Enhancing Social Bonds in the Classroom
Fostering Friendships - Enhancing Social Bonds  in the ClassroomFostering Friendships - Enhancing Social Bonds  in the Classroom
Fostering Friendships - Enhancing Social Bonds in the Classroom
 
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxHMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdf
 
Unit-IV; Professional Sales Representative (PSR).pptx
Unit-IV; Professional Sales Representative (PSR).pptxUnit-IV; Professional Sales Representative (PSR).pptx
Unit-IV; Professional Sales Representative (PSR).pptx
 
This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.
 
Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024
 

215077679 introduction to HTML

  • 1. Introduction to HTML A workshop by Xolani Madlopha
  • 2. What is HTML? • It is an abbreviation for Hyper Text Markup Language. • In creating the website, it focuses more on the content of the website. • It is the type of coding or hypertext that one needs to know when adding content to the website or webpage they are creating.
  • 3. • HTML is gotten from a dialect SGML (Standard Illustrations Markup Language). • The eventual fate of HTML is XML (eXtended Markup Dialect). • HTML isn't a programming dialect, it is a Markup Dialect. • A markup dialect is an arrangement of markup labels.
  • 4. • A tag is constantly encased in edge section <>like <HTML> • HTML labels ordinarily come in sets like <HTML> and </HTML> i.e. Begin tag = <HTML>
  • 5. End tag =</HTML> • Start and end labels are additionally called opening labels and shutting labels
  • 6. BASIC STRUCTURE OF HTML <html> <head></head> <body></body> </html> THESE BASIC STRUCTURES ARE VERY ESSENTIAL AND MUST BE ALWAYS THERE AND USED IN YOUR HTML.
  • 7. • <HTML> - Describe HTML web page that is to be viewed by a web browser. • <HEAD> - This defines the header section of the page. • <TITLE> - This shows a caption in the title bar of the page. • <BODY> - This tag show contents of the web page will be displayed.
  • 8. THE BASIC HTML TAGS APPLIED LIKE THIS: <html> <head> Write your heading and other top things you need to mention </head> <body> write the full content and paragraphs here write the full content and paragraphs here write the full content and paragraphs here </body> </html>
  • 9. Heading Element:-> • There are six heading elements (<H1>,<H2>,<H3>,<H4>, <H5>,<H6>). • All the six heading elements are container tag and requires a closing tag. • <h1> will print the largest heading • <h6> will print the smallest heading
  • 10. The visual description of how headers make your headings to be:
  • 11.
  • 12. How to start • You can use Notepad or Notepad ++ • Write the codes and tags with the content incide the notepad/ notepad ++ • Then save the file with these extensions: (.Htm), (.Htm). • Click on that file and open it with Chrome, Internet Explorer etc. to see if the content is displayed in a web format.
  • 13.
  • 14. REFERENCES Reddy. Y, (2013), Introduction to html, Slideshare.net, (Accesed on 2 September 2018) Calvert. S, Swift. B, (2013), Html css-presentation, Slideshare.net, (Accesed on 2 September 2018) Patni. S, (2018), introduction to html, Slideshare.net Mayalisa, (2018), Introduction to html, Slideshare.net, (Accesed on 2 September 2018)