HTML5 vs Flash

Last year I wrote a guide to HTML5 and some of the features that will be available including the video and canvas elements. The canvas element gives developers a powerful way to draw pixel-based images using JavaScript. For each element needed a “context” is used, which uses JavaScript commands to draw anything you want. The video element will allow direct embedding of videos on a web page without the need for any external plugins.

HTML5 vs Flash

In this article I’m going to talk about HTML5, how it compares to Flash and whether it is going to replace Flash in the near future.

HTML5 has been in development for a few years but it is widely used in web design already and developers are taking advantage of the features even though it still isn’t fully supported in the majority of browsers.

HTML5 Canvas

The canvas tag in HTML5 allows developers to draw graphics on web pages but it can also be used to create animations, user interfaces, drawing applications, charts and can be used to apply effects to images.

Here are a few advantages of canvas over Flash:

  • A compiled Flash file is 111k and the same file using a minified version canvas is only 25k.
  • Better cursor support and flexibility.
  • Receives cursor and keyboard events without the need for extra coding.
  • No need to compile each time a change has been made.

Canvas also has some disadvantages when compared to Flash:

  • Doesn’t embed fonts like Flash so therefore they are rendered using the browser.
  • Drawing and clipping has to be handled manually as there no objects or layers on the canvas.
  • Not able to automatically wrap text in a bounding box.

HTML5 Video

The video tag is starting to be implemented by some of the major video sharing sites such as YouTube and Vimeo who have both released beta versions of their sites using HTML5 to display videos. Unfortunately you have to have a browser that can support this tag, which means you will have to use Chrome or Safari. It can be viewed in IE but you will need to install Chrome Frame. FireFox does support HTML5 video in its latest release but only if you use the Ogg video codec.

If designers and developers want to publish videos for everyone then Flash will be the way to go as it can support more video codecs and include cue points as well.

Conclusion

It’s too early to say whether HTML5 will replace Flash completely as there is still a lot it has yet to achieve to prove itself better than Flash. In my opinion I don’t think HTML5 will ever replace Flash in the near future because there is so much more Flash can do.

I do think that it’s a good idea to start implementing it for basic things, but it could be another 5 or 10 years before we see full cross-browser support and even then many developers will still be against it due to the lack of functionality compared to Flash.

Related posts:

  1. Safari and HTML5
  2. HTML5 Template – Tutorial
  3. A Simple HTML5 Template Tutorial
  4. Best Flash Resources
  5. Create an Animated Flash button

Tags: , ,

2 Responses to “HTML5 vs Flash”


  1. Michael Sears Says:
    April 8th, 2010 at 6:02 pm

    I think that in about 5 years or more HTML5 will be as big as flash is now. It doesn’t take any extra software to use it and the browsers will jump on the compatibility soon enough! IE will probably be the last to support it because we all know how Microsoft can be about change but yet on the other hand they probably will release a version to early and it will all crash down like an earlier version of windows!


  2. Jonathan Bair Says:
    April 9th, 2010 at 9:10 am

    Thanks for this, but you neglected to mention many key reasons to prefer HTML over Flash. In the US, there’s a federal law requiring commercial web sites to be accessible to the blind, and HTML is fully accessible to screen readers while Flash is not (video or games or other graphical content that cannot reasonably provide accommodation to the blind would be fine). I would think the UK or EU has a similar regulation. It’s not just bad form but potentially illegal to use Flash to render text. Flash also poses a security hazard in general, and it is much more taxing on system resources than other implementations of video or graphics. These are important considerations for web designers even though they are on the user side.

Leave a Reply

Contact Us Today...

For more information regarding any of our services or to arrange a free consultation simply send us a message or call 02920 290 080 for Cardiff and 01179 000 482 for Bristol.

Firefox 4 Beta

Mozilla have released the first beta version of Firefox 4. The latest version of this browser will include better support for many of the new web technologies, a new add on manager, crash protection from third party plugins and accelerated hardware support. One of the most obvious changes is that the tabs have now been moved [...]
» more

Cardiff: 02920 290 080 Bristol: 01179 000 482