Thursday, 3 September 2015

(Image: HTML5 logo and wordmark by W3C. Licensed under CC BY 3.0 via Wikimedia Commons.)

HTML5: 5 Tips That Will Change Your Life

HTML5 is the future of the Web. Whether you're a developer or a power user, there are things you should know about the Web's new programming foundation.

(Image: HTML5 logo and wordmark by W3C. Licensed under CC BY 3.0via Wikimedia Commons.)
In case you missed it, the Web has changed. All of that online banking, real-time video chatting, and cat-video sharing has stretched the foundation of the Web to its breaking point and beyond. That's why the foundation has been given an upgrade.
HyperText Markup Language (HTML) is the language of the browser. Originally based on the document-oriented Standard General Markup Language (SGML), HTML served the needs of the original academic users of the Web through its first four versions, but the increasing user demand for a variety of functions -- from secure encrypted transactions to video media -- meant that APIs, SDKs, add-on libraries, and external applications had to be bolted on to the HTML in order to make things work more or less the way people and organizations wanted. So in 2004 the Web Hypertext Application Technology Working Group (WHATWG) started working on a new version of HTML to be known as HTML5.
On October 28, 2014, the World Wide Web Consortium (W3C) -- which had joined forces with the WHATWG to develop the standard -- released HTML5 as a stable recommendation, which is standards-speak for "it's finished." Now we can all sit at our systems and enjoy the benefits that HTML5 will bring to everyone.
And what might those benefits be? They depend, a bit, on whether you're a developer or a user. For developers, life can be dramatically simpler under HTML5 than under HTML4.1 because there are add-ons and extras that you won’t need to use. That’s a good thing, though there are still some issues you'll have to take into consideration in the near term.
For users, life should be easier, because many of the add-ons that create security holes and compatibility problems are no longer required in order to have a rich, secure browser experience. And that browser experience should extend to more devices with a consistent look and feel from screen to screen. What's not to like, right?
[Think Fortran is dead? Think again.]
It's important to remember that HTML5 is a standard in the early stages of its finalized life. That means there are going to be some bumps in the road and some surprises along the way. That's why we thought it would be helpful to give some insight into this new way of building Web pages.
If you're already coding in HTML5 all of this might be old news -- and you might have some insight into things we missed. Let us know about your experiences and your plans. It would be nice to have some real information on HTML5 before HTML5.1 rolls around (and that process starts next year). Let's get started, shall we?

HTML5 Is A New Language

From HTML to HTML4.2, every iteration of HTML was based on SGML, a document description language developed by IBM in the 1960s. While the language evolved and grew, it had a consistent basis. That's no longer the case. HTML5 is a whole new language that's not based on SGML. For Web users this will have no impact at all -- most have never heard of SGML and wouldn't know what to do with HTML if it bit them on the hand. For developers, though, it means that a lot of the "muscle memory" regarding common tags and features will have to be re-learned. That's not necessarily a bad thing, but it is something to keep in mind as you're thinking about schedules and deadlines.
The good news is that HTML5 is backward-compatible with earlier versions of HTML, so code developed last year should continue to make pages appear this year. That's great for continuity, but we know from experience that some organizations will use this to be lazy. Don't do that: Move beyond cut-and-paste and develop your new HTML5 code from scratch. You'll be glad you did.

You'll Need A New Browser

Remember when we said that HTML5 is backward-compatible? That's true. What's not true is that browsers built for HTML4 are forward-compatible with HTML5. If your organization has standardized on an earlier version of a particular browser (and yes, all you groups that insist on an old version of Internet Explorer, we're looking at you), then HTML5 is the clarion call notifying you that it's time to upgrade.
The current versions of all major browsers support HTML5. They're also safer and more reliable than the older versions. Start planning now.
(Image: geralt via Pixabay)

You'll Need A New Browser

Remember when we said that HTML5 is backward-compatible? That's true. What's not true is that browsers built for HTML4 are forward-compatible with HTML5. If your organization has standardized on an earlier version of a particular browser (and yes, all you groups that insist on an old version of Internet Explorer, we're looking at you), then HTML5 is the clarion call notifying you that it's time to upgrade.
The current versions of all major browsers support HTML5. They're also safer and more reliable than the older versions. Start planning now.

New Browser Workaround

OK, so if you (or your CIO) are going to be really stubborn about the whole 'new browser' thing, there's a kludgy way to get around the requirement. You can define HTML5 code as block elements in your older HTML code and insert HTML5 elements there. It will work, and might even work well. But you won't feel good about yourself.
If there's some legitimate reason that you absolutely cannot upgrade to a current browser then this could work, unless...
You're stuck on a version of Internet Explorer prior to IE8. Then you have a problem, because Microsoft didn't allow you to define unknown code in a style. There's a Javascript workaround (search on 'HTML5' and 'the shiv') but you're starting to stack kludge on kludge and we know how well that tends to work out, don't we?
(Image: geralt via Pixabay)

New Browser Workaround

OK, so if you (or your CIO) are going to be really stubborn about the whole "new browser" thing, there's a kludgy way to get around the requirement. You can define HTML5 code as block elements in your older HTML code and insert HTML5 elements there. It will work, and might even work well. But you won't feel good about yourself.
If there's some legitimate reason that you absolutely cannot upgrade to a current browser then this could work, unless…
You’re stuck on a version of Internet Explorer prior to IE8. Then you have a problem, because Microsoft didn't allow you to define unknown code in a style. There's a Javascript workaround (search on "HTML5" and "the shiv") but you’re starting to stack kludge on kludge and we know how well that tends to work out, don't we?

Video Is A Lot Easier

Making video happen in HTML4 is something of a pain. It's not that no one knows how to do it. It's that there are several possible methods, none of which come from the language itself. It's all about the plug-in. This has worked, most of the time, but all of us have seen the various sad-face computer icons that tell us one plug-in or another has crashed, needs to be updated, or isn't available.
HTML5 avoids all of that because video is a media type defined within the language itself. Want to include a video on your page? It's as simple in HTML5 as including a static image is in HTML4. If you've ever spent time wrestling with the inclusion code for a custom video player, you'll likely weep with joy the first time you write a video page in HTML5. And for users, those cute cat videos became much more reliable.
Now, there are still a few wrinkles: Not all browsers offer identical support for all video media types. In general, though, if you stick with the new WebM video format you should be fine.

(Image: geralt via Pixabay)

Video Is A Lot Easier

Making video happen in HTML4 is something of a pain. It's not that no one knows how to do it. It's that there are several possible methods, none of which come from the language itself. It's all about the plug-in. This has worked, most of the time, but all of us have seen the various sad-face computer icons that tell us one plug-in or another has crashed, needs to be updated, or isn't available.
HTML5 avoids all of that because video is a media type defined within the language itself. Want to include a video on your page? It's as simple in HTML5 as including a static image is in HTML4. If you've ever spent time wrestling with the inclusion code for a custom video player, you'll likely weep with joy the first time you write a video page in HTML5. And for users, those cute cat videos became much more reliable.
Now, there are still a few wrinkles: Not all browsers offer identical support for all video media types. In general, though, if you stick with the newWebM video format you should be fine.

Animation Is Included

How many of you remember having to learn Flash in order to do cool animated effects on your Web page? If you didn't learn Flash, you worked with a designer who inserted blocks of magical mystery code into your otherwise very solid page. Those days are over, and pretty much everyone (including Adobe) seems happy about it.
HTML5 includes all the features you need to build animation into your page. You can even do advanced 3D animation without having to resort to any external code. That's very cool. It's also far more secure and reliable than earlier methods, and we all know that we love security and reliability almost as much as we love a dancing carrot that comes to show us which button we should choose next.
Another benefit: You no longer have to think about which device your page will display on. Any browser that supports HTML5 on any device will show your nifty animation just fine.

(Image: ClkerFreeVectorImages via Pixabay)

Animation Is Included

How many of you remember having to learn Flash in order to do cool animated effects on your Web page? If you didn't learn Flash, you worked with a designer who inserted blocks of magical mystery code into your otherwise very solid page. Those days are over, and pretty much everyone (including Adobe) seems happy about it.
HTML5 includes all the features you need to build animation into your page. You can even do advanced 3D animation without having to resort to any external code. That's very cool. It's also far more secure and reliable than earlier methods, and we all know that we love security and reliability almost as much as we love a dancing carrot that comes to show us which button we should choose next.
Another benefit: You no longer have to think about which device your page will display on. Any browser that supports HTML5 on any device will show your nifty animation just fine.