Scribd
Upload
21 views

1 HTML

Uploaded by

kejogef328
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
21 views

1 HTML

Uploaded by

kejogef328
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 15

Understanding HTML5

Mark-up Language
• Markup languages are designed for the processing, definition and
presentation of text. The language specifies code for formatting, both
the layout and style, within a text file.
• The code used to specify the formatting are called tags.
• It is human-readable, meaning markup files contain standard words,
rather than typical programming syntax.
• While several markup languages exist, the two most popular
are HTML and XML.
Difference between HTML and XML
HTML XML
HTML is a markup language used for creating webpages. The XML is used for storing structured data, rather than formatting
contents of each webpage are defined by HTML tags. Basic information on a page. While HTML documents use
page tags, such as <head>, <body>, and <div> define sections predefined tags (like the examples above), XML files use
of the page, while tags such as <table>, <form>, <image>, custom tags to define elements. For example, an XML file that
and <a> define elements within the page. stores information about computer models may include the
following section:

<a href="http://www.techwyvern.xyz">techwyven.xyz</a> <computer>


<manufacturer>Dell</manufacturer>
<model>XPS 17</model>
<components>
<processor>2.00 GHz Intel Core i7</processor>
<ram>6GB</ram>
<storage>1TB</storage>
</components>
</computer>
What is HTML?

• HTML is the standard markup language for creating Web pages.


• HTML stands for Hyper Text Markup Language
• HTML describes the structure of Web pages using markup
• HTML elements are the building blocks of HTML pages
• 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
HTML Versions
• HTML 1.0: This was the barebones version of HTML and the very first release of the
language.
• HTML 2.0: This version was introduced in 1995. It gradually evolved, allowing extra
capabilities including form-based file upload, tables, client-side image maps and
internationalization.
• HTML 3.2: In an attempt to ensure development of standards for the World Wide
Web, the World Wide Web Consortium (W3C) was founded by Tim Berners-Lee in
1994. By 1997, they published HTML 3.2.
• HTML 4.0: Later in 1997, the W3C released HTML 4.0 — a version that adopted
many browser-specific element types and attributes.
• HTML 4.0 was later reissued with minor edits in 1998.
• HTML 4.01: In December 1999, HTML 4.01 was released.
• XHTML: The specifications were introduced in 2000 and it was recommended to be
used as the joint-standard with HTML 4.01. It incorporated XML to ensure code is
properly written and to ensure interoperability between programming languages.
• HTML5: The W3C published HTML5 as a recommendation in October 2014 and
later released HTML 5.1 in November 2016.
Basic Structure of HTML

<!DOCTYPE html> • The <!DOCTYPE html> declaration defines


<html> this document to be HTML5
<head> • The <html> element is the root element of an
HTML page
<title>Page Title</title> • The <head> element contains meta
</head> information about the document
<body> • The <title> element specifies a title for the
document
<h1>My First Heading</h1>
• The <body> element contains the visible page
<p>My first paragraph.</p> content
</body> • The <h1> element defines a large heading
</html> • The <p> element defines a paragraph
Basic Structure of HTML
• An HTML document has two* main
parts:
• head. The head element contains title
and meta data of a web document.
• body. The body element contains the
information that you want to display
on a web page.
• In a web page, the first tag
(specifically, <html>) indicates the
markup language that is being used
for the document.
• The <head> tag contains
information about the web page.
Lastly, the content appears in the
<body> tag.
HTML PGE STRUCTURE
HTML Tags
• HTML tags are element names surrounded by angle brackets:
• <tagname>content goes here...</tagname>
• HTML tags normally come in pairs like <p> and </p>
• The first tag in a pair is the start tag, the second tag is the end tag
• The end tag is written like the start tag, but with a forward slash inserted
before the tag name
HTML 5
• HTML5 is the next major revision of the HTML standard superseding
HTML 4.01, XHTML 1.0, and XHTML 1.1. HTML5 is a standard for
structuring and presenting content on the World Wide Web.
• HTML5 is a cooperation between the World Wide Web Consortium
(W3C) and the Web Hypertext Application Technology Working
Group (WHATWG).
• The new standard incorporates features like video playback and drag-
and-drop that have been previously dependent on third-party browser
plug-ins such as Adobe Flash, Microsoft Silverlight, and Google
Gears.
New Features
• New Semantic Elements − These are like <header>, <footer>, and <section>.
• Forms 2.0 − Improvements to HTML web forms where new attributes have been introduced for
<input> tag.
• Persistent Local Storage − To achieve without resorting to third-party plugins.
• WebSocket − A next-generation bidirectional communication technology for web applications.
• Server-Sent Events − HTML5 introduces events which flow from web server to the web browsers
and they are called Server-Sent Events (SSE).
• Canvas − This supports a two-dimensional drawing surface that you can program with JavaScript.
• Audio & Video − You can embed audio or video on your webpages without resorting to third-party
plugins.
• Geolocation − Now visitors can choose to share their physical location with your web application.
• Microdata − This lets you create your own vocabularies beyond HTML5 and extend your web
pages with custom semantics.
• Drag and drop − Drag and drop the items from one location to another location on the same
webpage
HTML5 - Syntax

• HTML 5 language has a "custom" HTML syntax that is compatible with HTML 4
and XHTML1 documents published on the Web, but is not compatible with the
more esoteric SGML features of HTML 4.
• HTML 5 does not have the same syntax rules as XHTML where we needed lower
case tag names, quoting our attributes, an attribute had to have a value and to close
all empty elements.
• HTML5 comes with a lot of flexibility and it supports the following features −
• Uppercase tag names.
• Quotes are optional for attributes.
• Attribute values are optional.
• Closing empty elements are optional.
The DOCTYPE
• DOCTYPEs in older versions of HTML were longer because the HTML language was SGML
based and therefore required a reference to a DTD.
• HTML 5 authors would use simple syntax to specify DOCTYPE as follows −
• <!DOCTYPE html>
• The above syntax is case-insensitive.
About HTML 5
• HTML5 supports both audio and video whereas none of these was a part of
HTML
• HTML does not allow JavaScript to run within the web browser whereas
HTML5 provides full support for JavaScript to run in the background.
• In HTML5, inline MathML and SVG can be used in text whereas this
wasn’t possible in HTML.
• HTML5 supports new kinds of form controls, for example: dates and times,
email, number, range, tel, url, search etc.
• There are many new elements introduced in HTML5. Some of the most
important ones are: summary, time, audio, details, embed, figcaption, figure,
footer, header, article, canvas, nav, output, section, source, track, video, etc..
Next Topic
Meta Tags

You might also like