Christopher Schmitt Talks HTML5

HTML5 has been blogged about by Web developers all over as the next big thing in Web design. But what is it, and how does it actually affect Web designers? Christopher Schmitt will shed some light on HTML5 and show us where this next wave of technology may take us. If you’re a Web designer, have an interest in interactive design, or just enjoy surfing the Web, you’ll surely enjoy hearing about this next wave of Web technology!

Q: So, what is HTML5? How does this iteration of HTML follow in the history of HTML on the Internet? In short, how would you explain HTML5 to a current Web designer?

What made HTML popular [in the first place] was something that wasn’t in the HTML set of tags. The NSCA Mosaic Web browser introduced a little tag called IMG. With this free browser and the subsequent Netscape Navigator, people could publish images along with text around the word. And to do it, all people needed to know was a handful of HTML elements and be handy with a digital imaging application.

Think of it. Instead of Microsoft Word and before junk email, people were starting to have little printing presses that could reach farther than ever before.

From that little outburst of a beginning to now, it’s been well over a decade.

HTML5 is a look [back] at how Web designers and developers have done things for the past seven to 10 years or so. That look back includes things like how people actually code HTML, how we use so many DIVs to mark up pages, how we use JavaScript and backend technologies to make form validations work or determine where a user is located.

And in looking back, the writers of the spec for HTML5 had a clear intention: Instead of re-inventing the wheel for each new Web site or Web application or coding things against the current specification, let’s make things easier for everyone.

This has led to a more flexible coding environment for HTML, front-end form validation, and a lot of new JavaScript APIs.

HTML5 is an absolution of our sins as Web developers. If we want to have video in our pages [for example], we don’t have to look the other way when we see W3C HTML validator results for the Flash plugin markup.

In short, HTML5 is nothing short of the maturing of the Web.

Q: HTML5 is so new that many of its features aren’t “ready for prime time.” What elements and features can be used right now, with our current browsers?

With a little help from the Modernizr library, HTML5 can be used in current browsers–including previous versions of IE (Internet Explorer).

The main problem is that HTML5 brings new HTML elements for greater semantic richness, if you will. For example, instead of using multiple DIVs and HRs to divide sections of a Web page, we can use new HTML elements like HEADER or FOOTER. The problem is that older versions of IE won’t recognize these elements.

Only through JavaScript can we get old IEs to respect these new elements–and that bit of JavaScript is baked into Modernizr, which has a lot of cool features.

Q: Will HTML5 impact browsers, or can I go on using Firefox, just as I have been?

You can still keep on using [older] browsers, if you want. However, there’s also been a restart in the browser wars of sorts that marked the late ’90s.

Browser vendors like Mozilla and Chrome are speeding up their development cycles, so you will be prompted to upgrade your browser more frequently and get access to the cooler features faster.

Q: Do you think HTML5 will change how Web designers create and design Web sites?

It’s already changing the way people code and design. Web sites are taking advantage of native video and audio support.

With HTML5 and CSS3 support in the iPhone and iPad’s browser Safari, you can make use of Geolocation as just one example.

Q: So HTML5 simplifies embedded multimedia (video/audio). Do you think people will take advantage of its ease, causing a resurgence of audio files on the Web?

I think audio gets a bit discarded too easily for my liking in favor of video when it comes to HTML5.

There are some great things you can do with the AUDIO element–one of them being that since AUDIO element is native, meaning it’s part of the Document Object Model, we can create JavaScript-powered play and pause buttons for audio made with HTML form controls.

And with HTML form controls, we can use CSS to style them. Which, in turn, means we can create custom playback buttons that fit the style of our Web site without resorting to opening Flash.

Q: The combination of HTML5 and CSS3 is powerful. How much design work (backgrounds, corners, and so on) will be created in code, instead of in Photoshop or Illustrator? Will this change the production process for Web designers?

The browser is turning into a lightweight version of Photoshop. We can now create rounded corners, text shadows, drop shadows, animations, skewing, transforms, and so much more with [HTML5 and] CSS3.

With judicious use of type and colors, one could easily mock up a well-designed page without having to open Photoshop.

Q: What current functionality will be replaced by HTML5? Is there any clear obsolescence in the shift from HTML 4 to HTML5 that Web designers should be aware of?

HTML5 is a shift from adding cruft to our pages and sites, to making things easier to manage. The beauty of the Web is that you can still use HTML 4 if you want. The Web won’t collapse if you don’t want to use [HTML5], and your Web pages will still be seen.

Q: Finally, I just have to ask: What is your favorite new feature of HTML5? You may only choose one!

I love Geolocation. I even produced a jQuery plugin for it. This plugin is something I wanted to help me make quick use of Geolocation without having to be a JavaScript whiz.

Sadly, I think I may have made it too hard to use since people have to code addresses with microformats, which is something I wish every Web designer knew about.

As people who use Foursquare or Gowalla will tell you, the ability to determine how close things are to you on your mobile device is an insanely useful idea.

Thanks, Christopher! HTML5, and its companion CSS3, give us Web designers a lot to be excited about. Sessions College students can learn more about it in Web Design certificate and degree programs and in Christopher Schmitt’s books and workshops.

Interview by Clara LaFrance, Sessions College Course Producer