Introduction to Html
Download as PPTX, PDF0 likes522 views
HTML (Hypertext Markup Language) is used to create web pages and describe their structure. It is not a programming language, but rather a markup language that uses tags to annotate text with additional information about its content and structure. Some key tags in HTML include headings, paragraphs, hyperlinks, images, lists, and forms. HTML5 is the latest evolution of HTML, introducing new semantic elements, multimedia capabilities, and form controls.
Introduction to Html
- 1. • With HTML you can create your own Web site. • HTML stands for Hyper Text Markup Language. • HTML is not a programming language, it is a Markup Language. • A markup language is a set of markup tags. • HTML uses markup tags to describe web pages. • HTML is not case sensitive language. • HTML documents contain HTML tags and plain text. PiyushIT
- 2. HTML Was developed in 1992 HTML 2.0 is introduced in 1994 HTML 3.0 was developed in 1995 HTML 3.2 was completed by 1997 HTML 4 was developed in the year 1998 HTML5 was first started by Mozilla, Apple, and Opera under a group called the WHATWG(Web Hypertext Application Technology Working Group). In 2006 W3C (World Wide Web Consortium) showed an interest in HTML5 and in 2007 they created a working group to work in HTML5 project. HTML5 is still under development. PiyushIT
- 3. • Write html code in notepad. • Save the file with (.Html)/(.Htm) extension. • View the page in any web browser viz. INTERNET EXPLORER, NETSCAPE ,Google Chrome etc. • The purpose of a web browser (like internet explorer or Firefox) is to read html documents and display them as web pages. PiyushIT
- 4. An HTML file must have an .htm or .html file extension HTML files can be created with text editors: NotePad, NotePad ++ etc Or HTML editors: Microsoft FrontPage Macromedia Dreamweaver Netscape Composer Expression Web PiyushIT
- 5. Header Navigation Aside Footer Section Article Footer Article Footer Article Footer Figure Image, Video, Quote, Table, etc… Legend PiyushIT
- 6. Header Body < / HTML> < HTML > PiyushIT
- 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. PiyushIT
- 8. <html> <head> <title> The title of your html page </title> </head> <body> <! - - your web page content and markup - -> </body> </html> PiyushIT
- 9. <html> <head> <title>My First HTML Page</title> </head> <body> <p>This is some text...</p> </body> </html> Opening tag Closing tag PiyushIT
- 10. <html> <head> <title>My First HTML Page</title> </head> <body> <p>This is some text...</p> </body> </html> HTML header PiyushIT
- 11. <html> <head> <title>My First HTML Page</title> </head> <body> <p>This is some text...</p> </body> </html> HTML body PiyushIT
- 12. Hyperlink Tags Image Tags Text formatting tags <a href="url">Link text</a> <img src="logo.gif" alt="logo" /> <strong>Bold</strong> and <em>italic</em> text PiyushIT
- 13. <video src="movie.ogg" controls="controls"></video> <audio src=" song.ogg " controls="controls"></audio> PiyushIT
- 14. <!DOCTYPE HTML> <html> <head> <title>Simple Tags Demo</title> </head> <body> <a href="http://www.tricksbypk.blogspot.com/" title= “My Blog">Visit link.</a> <br /> <img src="logo.gif" alt="logo" /> <br /> <strong>Bold</strong> and <em>italic</em> text. </body> </html> PiyushIT
- 15. 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 PiyushIT
- 16. <html> <head><title>heading</title></head> <body> <h1> GLOBAL INFO CHANNEL</h1> <h2> GLOBAL INFO CHANNEL</h2> <h3> GLOBAL INFO CHANNEL</h3> <h4> GLOBAL INFO CHANNEL</h4> <h5> GLOBAL INFO CHANNEL</h5> <h6> GLOBAL INFO CHANNEL</h6> </body> </html> PiyushIT
- 17. PiyushIT
- 18. • HTML documents are divided into paragraphs. • Paragraphs are defined with the <p> tag i.e. <p>This is a paragraph</p> <p>This is another paragraph</p> PiyushIT
- 19. • if you want a line break or a new line without starting a new paragraph Use the <br> tag. • Defines a horizontal line use <hr>tag. • <br> <hr> element are empty HTML element i.e. Global Information Channel<hr> Global Information <br> Channel PiyushIT
- 20. HTML 5 is the next version of Hyper Text Markup Language(HTML4) It is developing by World Wide Web consortium W3C. Defined error handling PiyushIT
- 21. Video and audio tags Header and Footer Drag and drop Canvas Offline Storage Geo-Location PiyushIT
- 23. Experimental First-Person Shooter Game 3D Graphics PiyushIT
- 24. HTML4 HTML5 Elements like nav, header were not present. It brought new element for web structure like nav , header etc It was lack of rules of parsing so it is difficult to handle error. Strictly parsing rules introduced in html5 so handle the error. No multimedia supported without third party It inbuilt multimedia element in html5 like Audio , video , canvas It was not available It contains attributes like control menu, spell check etc.PiyushIT
- 25. YouTube uses HTML5, www.youtube.com/html5 Only some of the browser only supports HTML5 features currently Google Chrome, Mozilla Firefox , opera etc PiyushIT