html5

12
Punjab College Of Technical Education Report On HTML 5

Upload: shivani-gautam

Post on 14-Nov-2014

1.055 views

Category:

Education


0 download

DESCRIPTION

Report Of HTML 5

TRANSCRIPT

Page 1: Html5

Punjab College Of Technical Education

Report

On

HTML 5

Page 2: Html5

1. Introduction

HTML stands for Hyper Text Markup Language is the predominant markup language for web pages. HTML elements are the basic building-blocks of WebPages. HTML is written in the form of HTML elements consisting of tags, enclosed in angle brackets like <html>, within the web page content. HTML tags normally come in pairs like <h1> and </h1>. The first tag in a pair is the start tag, the second tag is the end tag. In between these tags web designers can add text, tables, and images.

The purpose of a web browser is to read HTML documents and compose them into visual or audible web pages. The browser does not display the HTML tags, but uses the tags to interpret the content of the page. HTML elements form the building blocks of all websites. HTML allows images and objects to be embedded and can be used to create interactive forms. It provides a means to create structured documents by denoting structural semantics for text such as headings, paragraphs, lists, links, quotes and other items. It can embed scripts in languages such as JavaScript which affect the behavior of HTML WebPages.

2. History

In 1980 physicist Tim Berners-Lee who was a contractor at CERN proposed and prototyped ENQUIRE, a system for CERN researchers to use and share documents. In 1989 Berners-Lee wrote a memo proposing an Internet-based hypertext system. Berners-Lee specified HTML and wrote the browser and server software in the last part of 1990. In that year Berners-Lee and CERN data systems engineer  Robert Cailliau collaborated on a joint request for funding but the project was not formally adopted by CERN. In his personal notes from 1990 he lists "some of the many areas in which hypertext is used" and puts an encyclopedia first.

The first publicly available description of HTML was a document called HTML Tags, first mentioned on the Internet by Berners-Lee in late 1991. It describes 20 elements comprising the initial, relatively simple design of HTML. Except for the hyperlink tag these were strongly influenced by SGML guide, an in-house SGML based documentation format at CERN. Thirteen of these elements still exist in HTML 4.

3. Markup

HTML markup consists of several key components, including elements and their attributes, character-based data types, character references and entity references. Another important component is the document type declaration, which triggers standards mode rendering.

<html>

<head>

<title>Hello HTML</title>

</head>

<body>

<p>Hello World!</p>

Page 3: Html5

</body>

</html>

3.1. ElementsHTML documents are composed entirely of HTML elements that, in their most general form have three components: a pair of tags, a "start tag" and "end tag"; some attributes within the start tag; and finally, any textual and graphical content between the start and end tags, perhaps including other nested elements. The HTML element is everything between and including the start and end tags. Each tag is enclosed in angle brackets.

3.2. AttributesMost of the attributes of an element are name-value pairs, separated by "=" and written within the start tag of an element after the element's name. The value may be enclosed in single or double quotes, although values consisting of certain characters can be left unquoted in HTML Leaving attribute values unquoted is considered unsafe. In contrast with name-value pair attributes, there are some attributes that affect the element simply by their presence in the start tag of the element, like the is map attribute for the image element.

3.3. Data typesHTML defines several data types for element content, such as script data and style sheet data, and a plethora of types for attribute values, including IDs, names, URIs, numbers, units of length, languages, media descriptors, colors, character encodings, dates and times, and so on. All of these data types are specializations of character data.

4. Versions

i> November 24, 1995

HTML 2.0 was published as IETF RFC 1866. Supplemental RFCs added capabilities

ii> January 1997

HTML 3.2 was published as a W3C Recommendation. It was the first version developed and standardized exclusively by the W3C, as the IETF had closed its HTML Working Group in September 1996

iii> April 1998

HTML 4.0was reissued with minor edits without incrementing the version number.

iv> January 2008

HTML5 was published as a Working Draft (link) by the W3C.

Page 4: Html5

5. HTML 5

HTML5 is a language for structuring and presenting content for the World Wide Web, a core technology of the Internet. It is the fifth revision of the HTML standard and as of August 2011 is still under development. Its core aims have been to improve the language with support for the latest multimedia while keeping it easily readable by humans and consistently understood by computers and devices web browsers, parsers etc. HTML5 is intended to subsume not only HTML4, but XHTML1 and DOM2HTML particularly JavaScript as well.

The Web Hypertext Application Technology Working Group (WHATWG) began work on the new standard in 2004, when the World Wide Web Consortium(W3C) was focusing future developments on XHTML 2.0, and HTML 4.01 had not been updated since 2000. In 2009, the W3C allowed the XHTML 2.0 Working Group's charter to expire, and decided not to renew it. W3C and WHATWG are currently working together on the development of HTML5.

Even though HTML5 has been well known among web developers for years, it became the topic of mainstream media in April 2010 after Apple Inc's CEO Steve Jobs issued a public letter titled "Thoughts on Flash" where he concludes that with the development of HTML5, Adobe Flash is no longer necessary to watch video or consume any kind of web content. This sparked a debate in web development circles where some suggested that while HTML5 provides enhanced functionality developers must consider the varying browser support of the different parts of the standard as well as other functionality differences between HTML5 and Flash.

6. Logo

On 18 January 2011, the W3C introduced a logo to represent the use of or interest in HTML5. Unlike

other badges previously issued by the W3C, it does not imply validity or conformance to a certain

standard. As of 1 April 2011, this logo is official. When initially presenting it to the public, the W3C

announced the HTML5 logo as a "general-purpose visual identity for a broad set of open web

technologies, including HTML5, CSS, SVG, WOFF, and others". Some web standard advocates,

including The Web Standards Project, criticized that definition of "HTML5" as an umbrella term,

pointing out the blurring of terminology and the potential for miscommunication. Three days later, the

W3C responded to community feedback and changed the logo's definition, dropping the enumeration of

related technologies. The W3C then said the logo "represents HTML5, the cornerstone for modern Web

applications"

Page 5: Html5

.

7. Markup

HTML5 introduces a number of new elements and attributes that reflect typical usage on

modern websites. Some of them are semantic replacements for common uses of generic block (<div>)

and inline (<span>) elements, for example <nav> (website navigation block), <footer> 

or <audio> and <video> instead of<object>. Some deprecated elements from HTML 4.01 have been

dropped, including purely presentational elements such as <font> and <center>, whose effects are

achieved using Cascading. There is also a renewed emphasis on the importance of DOM scripting (e.g.,

JavaScript) in Web behavior.

The HTML5 syntax is no longer based on SGML despite the similarity of its markup. It has, however,

been designed to be backward compatible with common parsing of older versions of HTML. It comes

with a new introductory line that looks like an SGML document type declaration, <!DOCTYPE html>,

which triggers the standards-compliant rendering mode. As of 5 January 2009, HTML5 also

includes Web Forms 2.0, a previously separate WHATWG specification.

8. Features

In addition to specifying markup HTML5 provides some new features along with its previous features.

The new features provided by HTML5 are given below.

8.1.CANVAS

HTML5 defines the <canvas> element as “a resolution-dependent bitmap canvas that can be used for

rendering graphs, game graphics, or other visual images on the fly.” A canvas is a rectangle in your page

where you can use JavaScript to draw anything you want. HTML5 defines a set of functions the

canvas API for drawing shapes, defining paths, creating gradients, and applying transformations.

Page 6: Html5

8.2. Video

HTML5 defines a new element called <video> for embedding video in your web pages. Embedding video

used to be impossible without third-party plugins such as Apple QuickTime or Adobe Flash.

The <video> element is designed to be usable without any detection scripts. You can specify multiple

video files, and browsers that support HTML5 video will choose one based on what video formats they

support.

Browsers that don’t support HTML5 video will ignore the <video> element completely, but you can use

this to your advantage and tell them to play video through a third-party plugin instead. Kroc Camen has

designed a solution called Video for Everybody! that uses HTML5video where available, but falls back to

QuickTime or Flash in older browsers. This solution uses no JavaScript whatsoever, and it works in

virtually every browser, including mobile browsers.

8.3. Local storage

Page 7: Html5

HTML5 storage provides a way for web sites to store information on your computer and retrieve it

later. The concept is similar to cookies, but it’s designed for larger quantities of information.

Cookies are limited in size, and your browser sends them back to the web server every time it requests a

new page which takes extra time and precious bandwidth. HTML5 storage stays on your computer, and

web sites can access it with JavaScript after the page is loaded.

8.4. WEB WORKERS

Web Workers provide a standard way for browsers to run JavaScript in the background. With web workers, you can spawn multiple “threads” that all run at the same time, more or less. These “background threads” can do complex mathematical calculations, make network requests, or access local storage while the main web page responds to the user scrolling, clicking, or typing.

8.5. Offline Web Applications

Reading static web pages offline is easy: connect to the Internet, load a web page, disconnect from the

Internet, drive to a secluded cabin, and read the web page at your leisure. But what about web

applications like Gmail or Google Docs? Thanks to HTML5, anyone (not just Google!) can build a web

application that works offline.

Page 8: Html5

Offline web applications start out as online web applications. The first time you visit an offline-enabled

web site, the web server tells your browser which files it needs in order to work offline. These files can be

anything — HTML, JavaScript, images, even videos. Once your browser downloads all the necessary

files, you can revisit the web site even if you’re not connected to the Internet. Your browser will notice

that you’re offline and use the files it has already downloaded. When you get back online, any changes

you’ve made can be uploaded to the remote web server.

8.6. GEOLOCATION

Geolocation is the art of figuring out where you are in the world and (optionally) sharing that information with people you trust. There is more than one way to figure out where you are — your  IP address, your wireless network connection, which cell tower your phone is talking to, or dedicated GPS hardware that calculates latitude and longitude from information sent by satellites in the sky.

Geolocation support is being added to browsers right now, along with support for new HTML5 features.

8.7. MICRODATA

Microdata is a standardized way to provide additional semantics in your web pages. For example, you can

use microdata to declare that a photograph is available under a specific Creative Commons license. As

you’ll see in the distributed extensibility chapter, you can use microdata to mark up an “About Me” page.

Browsers, browser extensions, and search engines can convert your HTML5microdata markup into

Page 9: Html5

a vCard, a standard format for sharing contact information. You can also define your own microdata

vocabularies.

The HTML5 microdata standard includes both HTML markup and a set of DOM functions. There’s no

harm in including microdata markup in your web pages. It’s nothing more than a few well-placed

attributes, and search engines that don’t understand the microdata attributes will just ignore them. But if

you need to access or manipulate microdata through the DOM, you’ll need to check whether the browser

supports the microdata DOM API

9. Difference Between HTML4 And HTML5

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, convas.

These controls were not present It contains attributes like control menu, spell

check etc.

Page 10: Html5

10. Websites using HTML5

YouTube uses HTML5, www.youtube.com/html5

Google wave, a collaboration tool from Google uses several html5 tags

Only some of the browser only supports HTML5 features currently