HTML5 is a revolutionary web technology aiming to upgrade user experience. First time in 2010 general public heard the term “HTML5” in connection to Steve Job’s speech on Flash. Much earlier the professional web development community got acquainted with an original concept to unite HTML markup language and powerful web apps technology. Moreover, HTML5 was promised to solve urgent cross-platform app deployment problems. To sum it up, HTML5 seemed to be a magic elixir for webmasters and designers. But it’s been several years since HTML5 appeared on the Internet landscape and so far HTML5 didn’t gain critical mass and didn’t turn yet into a web mainstream.
Obviously, HTML5 has huge potential. Thanks to new elements like <canvas> tags or new video players HTML5 websites are much more dynamic and interactive than its predecessors. Users can move website design elements, play games online, watch streaming videos directly via modern browsers. In fact, HTML5 websites have better aesthetics, amazing design and astonishing graphics. Thus, HTML5 gives designers more opportunities to express their design vision and creativity.
Besides, HTML5 technology unifies user experience. No matter what device you prefer, HTML5 website behavior remains the same. You do not have to adapt to new environment, hot keys or screen parameters. As we know sometimes visually appealing websites may lack comprehensible message and thus, familiar website behavior is a user-friendly sign for all your site visitors.
Another technological HTML5 perk is the absence of old-fashioned Flash plugin. HTML5 eliminates the need to install Flash plug-ins in order to stream video or use hardware acceleration for games and movies. HTML5 is an organic part of web eco-system that consumer less hardware capacities.
Regardless such astonishing features, webmaster still consider HTML5 promising but rather raw to implement technology. And their reluctance to learn and implement HTML5 is easy to understand if we take into consideration HTML5 historical facts.
History
About 6 years ago HTML5 working group was established. All developers and designers put much hope in upcoming HTML5 web notion. The W3C mission is to work out instructions for web developers worldwide, to set HTML5 guidelines and to make HTML5 a transparent web technology. In particular, the working group should create HTML5 specification and publish it. But the first specification was not what tech-savvy audience was longing for. It was a mere compromise between old HTML and new web trends. Pressed by major vendors like Mozilla Foundation and Apple, the working group made specification more flexible. Though, it sounds strange, but still HTML5 technology has no stable specification that webmasters can evaluate and examine.
One more thing, broad media hype related to HTML5 started in 2010 by Apple vs. Adobe war. Steve Jobs published his thoughts on Flash stating that a new web surfing generation must be fast, secure and smooth. Thus, power-consuming and cumbersome Flash should be replaced with a new solution. This solution is supposed to be HTML5. Job’s open letter exploded tech industry and captured attention of larger audience.
Since the proclamation of Flash as an appendix of the old web, the web world has split into 2 camps: HTML5 early adopters and Flash+HTML conservative users. Each counterpart has strong arguments.
HTML5 fans tried to convince that new features are cool and give seamless integration. Flash+HTML advocates prove that Flash and HTML union is stable and well-known; newbie is too fresh to deploy. Let’s examine deeper the benefits, resources and hidden dangers that HTML5 brings if you decide to switch to the new web format.
Benefits
When it comes to implementation, each webmaster has to decide: “Is HTML5 right for me?” On the one hand, HTML5 is much more advanced technology than plain HTML. HTML5 combines HTML, CSS3 and Java script technologies. As all in one solution HTML5 shows impressive results unreachable with simple HTML means. It’s like to compare Microsoft Office and Notepad. On the other hand, you have to study from the scratch and test HTML5 websites thoroughly. However, new opportunities may deserve time-spent.
HTML5 treasure is a new approach to multimedia. First of all, designer can express better with canvas, simpler CSS structure and Java Script elements. These improvements are good for dynamic backgrounds or entertainment needs. For example, look at famous bouncing balls on Google Doodle. You can view it here, HTML5 code is available at GitHub.
However, HTML5 power is not limited to jumping balls. HTML5 strives to become a real environment for apps and games. For instance, try billiards game play: smooth playing, responsive, fast motions. No stops or browser freezes. All these features are created with HTML5 means. Another good example is MugTug Sketchpad. Look at Sketchpad powered by HTML5. It’s a wonderful photo editing app that can easily replace Paint-like software. Previously, similar apps would be done on Flash basis. But as you see the two examples demonstrate viability of new web technique.
One more benefit of HTML5 markup are internal <video> and <audio> tags that enables you to embed video content directly into web page. You can enrich your website with music and video and get rid of additional flash player code.
But you should remember certain pitfall that HTML5 has. If you stick to HTML5 format, you rely on up-to-date browsers as Internet Explorer 6, 7 and old Chrome and Firefox do not support HTML5. It means you have to resolve the dilemma: either to make a mirror-website for old-school browsers or lose a part of potential traffic. Nowadays there are many people who yet surf the web using Internet Explorer 6. So you have to study your audience before you move your web presence to HTML5. A beautiful, original website with amazing canvas effects will be useless if your visitors cannot see it. To avoid such problem, you can duplicate content for old browsers and make it “readable” for them. In fact, if your current public uses new Chrome, Safari or visit your website from mobile gadgets, you know that HTML5 is a suitable choice.
The real trouble occurs when you choose a technology for your web app or game. When we speak about websites with HTML5 elements like canvas or <video> tags the limited support of old browsers is not a too big deal. You can always replace the omitted content with blank HTML code. But when you plan to develop a web app, the decision to implement HTML5 can lead to success or failure. If mobile access to your web application is crucial factor, then HTML5 seem to be what you need. If you create an enterprise app or an app for Universities where old browsers survived, HTML5 may reduce the number of your clients.
In the app environment each webmaster has to think twice before he/she bets on HTML5 technology. If you see that HTML5 is your way to success, don’t be afraid that the technology lacks stable specification. There are already many tools, templates, samples and free utilities that can help you to code efficiently.
Resources
When it comes to implementation HTML5 to your website or app, webmasters should take advantage of HTML5 free tools and resources available on the World Wide Web:
-
HTML5 Website Templates
Visit Free HTML5 Templates, HTML5 Boilerplate, or pay for ready HTML5 Web Templates. There lots of free and premium website design templates with ready-to-use PSD and CSS files. Thus, you can create HTML5 website quickly or see real samples of correct design for HTML5.
-
Multimedia
To make your life easier, you can grab video and audio players, check out dynamic video players like the Blowing Up HTML5 video code. Download free HTML5 Video Converter and get ready HTML5 video code and player at one click. Plus, try to deploy HTML5 jPlayer code for music files. There is a trick about HTML5 video: you have to convert videos to 3 video formats (Ogg, H.264 and WebM) to make sure your video files are displayed correctly by all browsers. Thus, you’d better combine good video player with reliable video encoding tool.
-
HTML5 Canvas and Tools
Look at Canvas Demos, install Adobe Edge Beta HTML5 design software, don’t forget about W3 Schools , HTML5 Rocks guides, HTML5eBooks and the ultimate HTML5 toolbox, browse HTML5 Gallery for the inspiration. Moreover, the resources have huge collection of guides, tips and tricks related to HTML5 development. You will learn about stylish canvas coding, HTML5 glossary, tags, differences between browsers requirements. Besides, you can explore the code and see real samples that may be your starting point. With new knowledge you will easily proceed to your HTML5 website or web app development. Tell us in the comments below what do you think about HTML5? Did you ever use HTML5 tools? Share your experience!
