HTML5 vs Flash : Term paper at VGSOM, IIT Kharagpur

Web War: HTML5 vs. FLasHWeb War: HTML5 vs. FLasH
Term Paper
Vinod Gupta School of Management
IIT Kharagpur
Submitted in partial fulfillment for the Management Information Systems (BM61014) Course at Vinod Gupta
School of Management, IIT Kharagpur
Submitted to: Submitted by:
Prof. Prithwis Mukerjee Kanishka Chakraborty
10BM60036
1

ContentContent
1. Abstract---------------------------------------------------------------------------------------------------- 3
2. Introduction----------------------------------------------------------------------------------------------- 3
3. What is HTML5------------------------------------------------------------------------------------------- 4
i. History--------------------------------------------------------------------------- 4
ii. New Features------------------------------------------------------------------ 6
4. Present Situation---------------------------------------------------------------------------------------- 9
5. Why HTML5 scores higher--------------------------------------------------------------------------- 9
6. Roadblocks to overcome----------------------------------------------------------------------------- 11
7. Future of Web--------------------------------------------------------------------------------------------- 13
8. References------------------------------------------------------------------------------------------------- 14
2

Abstract
With the introduction of HTML5, a buzz has been created regarding the future of Web. The major
casualties of this new addition to the lineup of HTML will be Adobe Flash and Microsoft Silverlight. HTML5
introduces quite a lot of elements and attributes addressing the needs of the modern websites. Both
HTML5 and Flash are used to support and display media and create interactivity on the web. Opera,
Mozilla and Google have given HTML5 their support as the standard for interactivity. But many big
players on the web, such as Hulu, still use Flash. In the light of this, the competition is going to be a fierce
one and this paper discusses some aspects of this on-going Web war.
Introduction
First let’s discuss what Hypertext markup language (HTML) is. Basically it’s the code at the back of every
website on the Internet. It is made up of words (a series of it) and values, all of which have been assigned
specific meanings and tasks. Each of the word and value are tied together with specific syntax. HTML is
written in form of tags started and ended by angle brackets and are present within the webpage. What a
browser does is, it reads these tags, interprets them and then display according to its interpretation.
So what is HTML5? HTML5 is the latest version of HTML. It is a standard for structuring and presenting
content on the World Wide Web. It comes with a lot of new features such as video playback and drag &
drop which were not there in any of its predecessor. HTML5 consolidates many such tools, and thus
eliminates the need for any other third party add-ins.
3

According to Bruce Lawson, Web evangelist for Opera Software and author of "Introducing HTML5",
“HTML5 replaces the fragile ecosystem of JavaScript, HTML, plug-ins and undocumented de facto
standards with a rigorously specified standard,"i
.
What is HTML5?
HTML5, the latest in the HTML generation, has arrived with a lot of new features which have never been
an integral part of HTML. Some of the most interesting features of HTML5 are as follows:-
• You can build an application once and apply it to both desktop and mobile devices. HTML5
promises to bridge the gap between browsers and mobile operating system
• HTML5 offers significant cost savings. The developers themselves are less expensive,
development time is shorter and there are significant public resources out there for them to use
• It will provide some local data storage on the device which allows one to take their work offlineii
while also utilizing the benefits of web-based apps (such as instant updates and accessibility to
different sources of data)
This version, unlike its predecessors is not based on SGML. Wikipedia defines SGML (Standard
Generalized Markup Language) as an ISO-standard technology for defining generalized markup
languages for documents. It has been designed as such it is compatible with all the older versions of
HTML. It resembles a SGML document type declaration, which enables standards-compliant rendering in
all browsers that use "DOCTYPE sniffing". iii
i) History
So from where did the idea of HTML5 came? To understand lets go to pre-historic times of HTML. HTML
was introduced in the year 1989. In the first five years of its inception, it went through a
number of revisions and extensions. The first modification came in 1995 in the form of
4

HTML 2 which had the added features of form based file uploads and tables. Then in
January 1997, came HTML 3.2. This was the first one to be developed and standardized
by World Wide Consortium (W3C). In the same year, in December 1997 HTML 4.0 was
introduced. It came with three different versions:-
• Strict, in which any depreciated element, was forbidden
• Transitional, in which depreciated elements were allowed
• And finally, Frameset, which mainly allowed frame related element
In December 1999, HTML 4.01 was published as a W3C Recommendation. The variations it
introduced were the same as introduced by HTML 4.0.
In the year 2000, XHTML 1.0 (extensible Hypertext Markup Language) was introduced which had
serialization as its major offering. It was a more restrictive subset of SGML. It too came up with the same
versions as HTML 4.0 i.e. Strict, Transitional and Framesets. XHTML was followed by XHTML 1.1.,
XHTML basic, XHTML-MP, XHTML 1.2 and XHTML 2.0.
In the year 2003, X-Forms were introduced. X-Forms were positioned as the future of Web
forms. The introduction of X-HTML generated interest of reviving HTML. In a workshop
organized by W3C in 2004, some proposals for the new version of HTML
were proposed jointly by Mozilla and Opera. But it was rejected by W3C and
the task of replacing HTML continued. Apple, Mozilla and Opera
formed what is known as WHATWG and started working on HTML
evolution. The core principles guiding WHATWG were:-
5

• The technologies developed must be backward compatible i.e. the newer version must be
compatible with the previous versions
• The implementation must match the specifications
• The specifications mentioned must be a detailed one, so that the implementation achieves
complete interoperability
• Everything specified in the documents of HTML 4, XHTML 1 and DOM 2 HTML must be included
In the year a major breakthrough came into being and W3C indicated that it’s interested in the
development of HTML5, the next version of HTML. In the year 2007, W3C formed a working group
chartered to work with WHATWG, to develop the specifications of HTML5. It had been estimated that
HTML5 will reach W3C Recommendation by late 2010. But it already has faced a few glitches:-
• The first working draft missed its deadline by 8 months
• Last Call & Candidate recommendations were expected to be reached in 2008, but as of now it
still is in working draft position
ii) New features
HTML5 has many new elements and attributes. The following list compiles some of them:-
1. New structure elements:-
 Section (Generic documentor application section)
 article (represent independent piece of work)
 aside (a piece of content that is slightly related to the rest of the page)
 hgroup (header of a section)
6

 header (group of introductory or navigational aids)
 footer (footer for a section and contain information about the author, copyright
etc)
 nav (section of the document intended for navigation)
 figure (a piece of self-contained flow content, typically referenced as a single unit
from the main flow of the document)
2. New Doctype and Charset:-
HTML 5 is very easy to implement. One just has to use the doctype as <! doctype html> and
that’s all. This is only possible because HTML% is no longer a part of SGML. The charset
(Character set) used by HTML5 is UTF-8.
3. New Inline Elements:-
Some of the new additions to the inline elements-
 <mark> - to indicate content that is marked in some fashion
 <time> - to indicate content that is a time or date
 <meter> - to indicate content that is a fraction of a known range - such as disk
usage
 <progress> - to indicate the progress of a task towards completion
4. Support for Dynamic Pages:-
The basic purpose of developing HTML5 was to help the web developers. Thus many new
features have been added to support dynamic pages.
 Context menus - creation and use of context menus within Web pages and
applications is supported by HTML5
7

 async attribute – this will reduce the loading time of the page as it allows
asynchronous loading of a page
 <details> - This tag is meant to provide information regarding any element
 <datagrid> - this is an important addition which will help in dynamically loading
 content from a database or other dynamic sources
 <menu> - this tag helps in building a menu in the webpage
 <command> - defines action should happen when a dynamic element is activated
 href – This tag is not required now which will allow one to use the a tag with scripts
and in Web applications without a need of anchors
5. New form types:-
HTML 5 has added a few more input types which are as follows:-
 datetime
 datetime-local
 date
 month
 week
 time
 number
 range
 email
 url
8

6. New elements and features:-
These are probably the most striking features of HTML5 which makes it stand out from its
predecessors. The following list compiles the most exciting elements of HTML5:-
 Canvas – The <canvas> element is a resolution-dependent bitmap canvas. It is a
rectangle in the webpage where one can use JavaScript to draw anything. It can be used
for rendering graphs, game graphics, or other visual images on the fly.
 Video – It is now possible to add a video to the webpage with just the help of a tag. Till
now any webpage hosted on a webpage has been rendered with the help of third-party
plug-ins such as Flash, QuickTime etc. HTML5 defines how to embed a video in a
webpage with the help of the <video> tag.
 Audio – HTML5 supports the addition of audio feature to a webpage with the help of the
<audio> tag.iv
 Drag & Drop – HTML5 offers the developers the option of using drag and drop feature
which will certainly make the website building a lot more easy and fun.
 Offline Storage – HTML5 is a way for web pages to locally store named key/value pairs
that too within the client web browser. Just like cookies, the data persists even after one
navigates away from the web site or close your browser tab or exit your browser. But
unlike cookies, this data is never transmitted to any remote server. The most interesting
thing about this storage facility is that it is natively present in the web browser and thus
9

doesn’t require any third party software. This new API has been standardized and
implemented across all major browsers, platforms, and devices.
 Geolocation - HTML5 also features a new geolocation APIs make location, which is
directly available to any HTML5-compatible browser-based application. With this API the
user can know her/his exact location. Right now this is only in its inception and now all
browser support this. But it sure is going to be very helpful to user in the recent future.
Present Situation
With the introduction of HTML5, the major casualties will be the present add-ins which are used
to display media content on websites. At present any such media based content is hosted with
the help of third party add-ins such as Flash (Adobe), QuickTime etc. All the major video
uploading websites makes use of Flash.
So what is Flash? Flash basically is a multimedia platform. The application of this platform is to
host animation, videos and interactivity features to the web pages. It comes under the RIA (Rich
Internet Applications) technology of Adobe. It was originally developed by Macromedia and now
it’s developed and distributed Adobe. Adobe claims Flash has a penetration of 99.3% of Internet
Desktop users use Flash.
Silverlight, too like Adobe Flash, is a rich client platform developed by Microsoft in 2007. It is a
web application framework that integrates multimedia, graphics, animation and can interact with a
single runtime environment. It is another of HTML5 casualties. HTML5 is witnessing a exponential
rise in its support base. So much so that even Microsoft itself has put its weight behind HTML5.
Microsoft’s cross platform strategy is aiming HTML5. v
10

Why HTML5 scores higher
The major challenge in front of Flash is mobile penetration. The reason for this can easily be
determined. Apple iPhone, which account for 60% of the global smart phones traffic, and iPod
which accounts for 95% mobile internet traffic, do not allow any third-party runtimes.
The biggest advantage that HTML5 has is that it is built into the browser, and doesn't require a
3rd party plug-in. This gives HTML5 a natural advantage over Flash. Apple has given its full
support to HTML5. This is due to the very fact that HTML5 doesn’t any 3rd
party plug-in. iPhones
and iPod do not support flash and with HTML5 they too will be able to display videos on the web
pages. The native video element present in HTML5 will make the installation of Flash just for the
purpose of watching a video redundant. With HTML5 all media content is displayed within the
native browser. HTML5 can also handle animations and features such as zoom animation and
page flip.
Flash was developed for desktop PC. So when Abode designed flash, they didn’t think of power
consumption, overheating or touch screen compatibility. In the age of laptops, mobile phones and
tablet computers these are major considerations. Flash demands considerable CPU usage and
as a result overheating problems occur. On the other hand HTML5 has taken all these points into
consideration. No such problems have been reported so far.
HTML5 is an open source whereas Flash is proprietary in nature. This has been a concern for the
propellants of open standards and free software.
The security record of Flash has many dark spots. It has lead to several security experts
recommending not to install Flash or to block it. Even the US-CERT recommends blocking Flash.
Flash Cookies is something which too is a major concern. About 50% of the websites having flash
content in it employ cookies too. But since the privacy policy of Flash doesn’t mention about
these cookies the user is unaware of it. Thus although the user deletes the HTTP cookies, the
Flash cookies persist and can be used to breach security. This problem is not present in HTML5.
Although it has the feature of offline storage, the data is never transmitted to any remote
machine.
A survey of online media professionals about whether they support video apps for their mobile
devices was conducted. While 65 percent plan to support video on the iPhone via apps or an
HTML5 Web video, about 40 percent plan on supporting Android and Blackberry devices.
11

Roadblocks to overcome
Now let’s discuss what are the major roadblocks that faced by HTML5
1) The major perception about HTML5 is that it’s going to take 12 more years to complete and
hence one shouldn’t bother about it. But YouTube and Vimeo has gone out to show that it is
already implementable. As more and more successful stories pour in, the user base will grow.
2) Flash has almost 99% penetration in all internet desktops. A lot needs to be done by HTML5
if it wants to reach similar heights. The following figure depicts the penetration level of Flash
(published by Adobe in September 2010)
All figures are in % Flash Player 9 and
below
Flash Player 10 Flash Player 10.1
Mature Markets 99 97.9 73.8
US/Canada 99.5 98.1 75.8
Europe 99 98.2 76.2
12

Japan 98.7 97 65.5
Australia/New
Zealand
98.8 97.7 69.5
Emerging countries 98.9 96.1 n/avii
Notes
• Mature markets include US, Canada, UK, Germany, France, Japan, Australia, New Zealand.
• Europe includes UK, Germany, and France.
• The Emerging markets are surveyed every other wave. They include China, S. Korea, Russia,
India and Taiwan.
• Australia and New Zealand were added to the mature markets surveyed in September 2009.
3) Compatibility with browsers is another issue. While Safari on Mac system scores very high on
HTML5 implementation, browsers on Windows has a long distance to cover. The following
chart shows the current status of implementation of different HTML5 features in various
browsers.
13

4) As far as maturity of tools necessary for the delivery and monetization of video is concerned
(advertising, reporting and content security) flash scores much higher than HTML5. This is
acting as a deterrent to the usage of HTML5.
5) HTML5 is based on JavaScript which has fallen behind the ECMAScript standard. The
ECMAScript standard itself has fallen behind Adobe’s ActionScript language.
6) Even in enabled browsers, the support for HTML5 has been found to be non-standard. The
specification is still said to be a working draft.
The Future
With all the features HTML5 boasts of, it surely can be termed as the next big thing in the world
WWW. Major heavyweights have given HTML5 their support. Jobs have made the following
observations about Adobe Flash and HTML5
14

They are lazy, Jobs says. They have all this potential to do interesting things but they just refuse
to do it. They don’t do anything with the approaches that Apple is taking, like Carbon. Apple does
not support Flash because it is so buggy, he says. Whenever a Mac crashes more often than not
it’s because of Flash. No one will be using Flash, he says. The world is moving to HTML5. ix
Adobe itself has showcased their new flash suite that allows users to convert the applications that
they have created in flash and output the files into HTML5 script. Microsoft has announced that
they are shifting their focus from SilverLight to HTML5 as their web based animation package.
This goes on to prove what the prospects of HTML5 are. Even the rivals are accepting the
importance of HTML5 and transforming their operations according to it. Digital publishing will
seriously be disrupted by this emerging technology in the coming years.
Steve Ballmer of Microsoft, in a Gartner Symposium said that, No question, world is going
HTML5. Google CEO Eric Schmidt calls HTML5 the next step in browsers.
It is natural that there will be a few road blocks to pass before it is fully adopted by all, but it can
be said with enough certainty that HTML5 is going to stay. One of the major speculation made
about the future of HTML5 was IE will not support it because, Microsoft, owner of IE has vested
interest in SilverLight. But this has been proved wrong by Microsoft’s support of HTML5. In
addition to this, Google has been a major propellant of HTML5 and going out of its way to support
it.
With the introduction of HTML5 and JavaScript frameworks, Flash has become redundant.
Frameworks like jQuery allow one to create amazing effects and transitions with simple lines of
code. This will further erode the already dwindling user base of Flash. The market leader of video
uploads, YouTube too has already started implementing HTML5 in addition to Flash. This will
further strengthen the support base of HTML5.
So is it the next big thing? Absolutely. It’s going to be the future of Web and sooner users start
adopting it, the better. Websites employing HTML5 sooner than later will find themselves in a far
better position than their competitors. As far as Flash is concerned, Adobe is working towards the
customization of the product to complement the features of HTML5. If all goes well, the web world
is soon going to witness a major change.
References
15

i
http://www.popularmechanics.com/technology/how-to/software/truth-about-html5
ii
http://www.businesscomputingworld.co.uk/whats-so-interesting-about-html5/
iii
http://en.wikipedia.org/wiki/HTML5
iv
http://webdesign.about.com/od/html5/a/html_5_whats_new.htm
v
http://hardgeek.org/html-5-vs-silver-light-microsoft-favors-html5
vi
http://techcrunch.com/2010/06/03/survey-ipad-html5-video/
vii
http://www.adobe.com/products/player_census/flashplayer/version_penetration.html
viii
http://www.images.google.com
ix
http://techreport.com/discussions.x/18403

HTML5 vs Flash : Term paper at VGSOM, IIT Kharagpur

More Related Content

What's hot

Viewers also liked

Similar to HTML5 vs Flash : Term paper at VGSOM, IIT Kharagpur

Recently uploaded

HTML5 vs Flash : Term paper at VGSOM, IIT Kharagpur