Switching From Flash to HTML5 Banner Ads

SWITCHING FROM FLASH TO HTML5 BANNER ADS

SWITCHING FROM FLASH TO HTML5 BANNER ADS 2


A Brief History of Flash

Debuted as FutureSplash Animator in 1995 ndash originally

a drawing application developed for pen-based

computing devices

Acquired by Macromedia in 1996 and rebranded as

Macromedia Flash

Flash Player distributed as a free browser plugin in

order to gain market share

ndash Quick easy download and preinstalled on most operating

systems

ndash Backwards-compatible

ndash Write once run everywhere on single consistent platform

ndash Reached 99+ adoption rate on desktop devices by 2000

Macromedia acquired by Adobe in 2005

3


Flash vs Flash Player

Flash Professional CC ndash the graphics and animation authoring tool sold by

Adobe

ndash Source code saved as FLA files

ndash Compiles (ldquopublishesrdquo) code and assets into compressed SWF files

Flash Player ndash the free browser plugin

ndash Loads and runs SWF files

ndash Chrome and IE now ship with specially-maintained versions

4


The Golden Years 2000 to 2007

Seemingly overnight Flash was ubiquitous

ndash Animation ndash online and offline

ndash Video ndash one format instead of three(Real Windows Media QuickTime)

ndash Rich Internet Applications ndash Flex

ndash Games

ndash Banner advertising ndash evolution fromanimated GIFs to Rich Media

ndash Early mobile devices

Early criticism failed to make a dent

ndash Gratuitous usage (ldquoskip intrordquo)

ndash Format not an official open standard

ndash Vendor lock-in

ndash Accessibility

ndash Performance

5



Demise of Flash Part 1 2007-2010

Applersquos iPhone launched in 2007 without Flash Player included as did the iPad in 2010

Steve Jobsrsquo ldquoThoughts on Flashrdquo

ndash Flash is proprietary a closed system

ndash Not needed to experience the full web

ndash Unreliable insecure poor performance

ndash Impact on battery life

ndash Lack of touch support

ndash Would erode Applersquos (quality) control over iOS platform

Adobe was never really able to smooth over performance battery and security issues on mobile

Explosive growth of iPhone and iPad led to first major industry-wide push to minimize or end use of Flash and support standards-based content and technologies

Primacy Lunch and Learn 7


Demise of Flash Part 2 2015

Browser makers have made huge strides in building more robust native

functionality ndash HTML5 CSS3 ES6

Key sites like YouTube have switched to HTML5 playback by default

8



Flash Player has long record of critical security updates aimed at patching

Flash vulnerabilities and Flash malware marked increase in exploits over the

years

ndash Issues have resulted in many security experts advising against installing Flash or

suggesting that internet users employ tools to block Flash

At the same time more intrusive advertising has spurred development of ad

blockers and more granular browser plugin control

ndash AdBlock Adblock Plus uBlock Ghostery

ndash ldquoClick-to-activaterdquo feature in Chrome Firefox Safari

In July Mozilla actively blocked all unpatched versions of Flash by default in

Firefox

Facebooks security chief publicly called for Adobe to declare an end-of-life

date for Flash

9


D-Day September 2015

In June under the title of ldquoBetter battery

life for your laptoprdquo Google announced

that an update to Chrome would

ldquointelligently pause content (like

Flash animations) that arenrsquot central

to the webpage while keeping central

content (like a video) playing without

interruptionrdquo

Update to be automatically rolled out

with Chrome 45 in September

10


Solution Options

Backup GIF

Automated conversion to HTML5 Canvas using Google Swiffy

ndash Fast works OK for simple animations

ndash More complex banners may not convert properly results not easily editable

Animated GIF

Export from Flash to HTML5 Canvas using Flash Professional CC

ndash Potential to reuse original FLA assets

Rebuild in HTML5 with JavaScriptCSS

ndash Code by hand or with tools like Google Web Designer and Adobe Edge Animate CC

11


Advantages to HTML5 Banners

Broad reach - desktop tablet smartphone

ndash Chrome Firefox Safari Opera IE9+

ndash IE8 ndash no HTML5 support so backup GIF displayed

Native to browser ndash stability security

Rapid browser development cycles and automatic updates ndash continual

addition of features and improvements in performance

Support for animation video audio interactivity

Potential lower barrier to entry ndash shift from specialized Flash designers to

more abundant frontend developers

Plenty of free and low-cost tools for working with HTMLCSSJavaScript

12


Disadvantages to HTML5 Banners

Lack of robust popular visual authoring tool

Larger file sizes ndash 120k to 200k

More time to develop more time to QA ndash browser compatibility is now a factor

No well-established advertising industry standards yet

ndash Which technologiesformats to use ndash CSS animations jQuery GSAP Canvas SVG etc

ndash Accepted sizes Font licensing

Dependency on publisher support and updated docs specs templates

Animation and media features still not at parity with Flash ndash Gallery 1 2

ndash Certain effects that are easy in Flash are virtually impossible in HTML5

ndash Set expectations for designers and clients

Quality concerns due to fewer HTML5 banner experts with motion graphics experience

13


The Road Ahead

14


THANK YOU

15






computing devices


Macromedia Flash




systems





3




Adobe






4







ndash Games







ndash Accessibility

ndash Performance

5




















8





years








Firefox


date for Flash

9










interruptionrdquo



10


Solution Options

Backup GIF




Animated GIF





11













12














13


The Road Ahead

14


THANK YOU

15




Adobe






4







ndash Games







ndash Accessibility

ndash Performance

5




















8





years








Firefox


date for Flash

9










interruptionrdquo



10


Solution Options

Backup GIF




Animated GIF





11













12














13


The Road Ahead

14


THANK YOU

15







ndash Games







ndash Accessibility

ndash Performance

5




















8





years








Firefox


date for Flash

9










interruptionrdquo



10


Solution Options

Backup GIF




Animated GIF





11













12














13


The Road Ahead

14


THANK YOU

15




















8





years








Firefox


date for Flash

9










interruptionrdquo



10


Solution Options

Backup GIF




Animated GIF





11













12














13


The Road Ahead

14


THANK YOU

15





years








Firefox


date for Flash

9










interruptionrdquo



10


Solution Options

Backup GIF




Animated GIF





11













12














13


The Road Ahead

14


THANK YOU

15










interruptionrdquo



10


Solution Options

Backup GIF




Animated GIF





11













12














13


The Road Ahead

14


THANK YOU

15


Solution Options

Backup GIF




Animated GIF





11













12














13


The Road Ahead

14


THANK YOU

15













12














13


The Road Ahead

14


THANK YOU

15














13


The Road Ahead

14


THANK YOU

15


The Road Ahead

14


THANK YOU

15


THANK YOU

15

Switching From Flash to HTML5 Banner Ads

Technology

Transcript of Switching From Flash to HTML5 Banner Ads