5 Exciting Things to Look Forward to in HTML 5
HTML 5 is the upcoming major revision of the HyperText Markup Language (HTML), the main method of marking up content for sharing on the World Wide Web. HTML's development stopped at HTML 4.01 in 1999, and since then web content has evolved so much that current HTML specifications are inadequate for today's requirements.
HTML 5 aims to improve HTML's interoperability and address the growing demand for more diverse and complex web content. It also addresses HTML 4's lacking features for web applications. In this post, we'll look at 5 exciting new features in HTML 5.
This is a guest post by Jacob Gube, a web developer/designer and author of Six Revisions, a blog on web development and design.
A bit of history
The conceptual thinking for HTML 5 began in late 2003. The World Wide Web Consortium (W3C), the organization that oversees the web's standard protocols and guidelines, expressed interest in the HTML 5 draft originally developed by the Web Hypertext Application Technology Working Group (WHATWG), a group formed in 2004 consisting of representatives of Apple, the Mozilla Foundation, and Opera Software. As a result, the W3C HTML Working Group was formed in 2007 to develop the specifications of HTML 5.
Development is underway, and HTML 5 is anticipated to reach W3C Candidate Recommendation status in 2012, though many modern browsers already have partial support for HTML 5 specifications.
Exciting new features
1. New HTML elements that improve our ability to describe content
HTML's primary task is to describe the structure of a web page. For example, by enclosing text between <p></p> elements, HTML tells the browser that the text between those elements is a paragraph.
Increasingly, diverse web content has outgrown HTML 4's ability to accurately describe the content of a web page. Streaming video and audio is now commonplace. Website regions such as navigation menus and branding areas (commonly located in the header) are now staples of most web pages. More importantly, advancements in JavaScript, Flash, and server-side technologies have allowed for the proliferation of rich Internet applications (responsive, user-driven, browser-based applications), despite current HTML specifications.
By adding more HTML elements, HTML 5 aims to give developers a better and more precise way of describing data.
For example, under current HTML specifications, this is how we would describe the structure of a typical web page:
The problem with this layout is that, to the browser, everything is a <div> element. The browser treats everything inside the <div> elements equally because it can't tell the difference between them, and "classes" and "ids," such as content, sidebar, and footer, change from website to website.
In HTML 5, this is how you might describe the layout of the same web page:
In this markup, the browser now knows what each part is. It knows that the web page's main content is inside the <article> element, that the website's navigation is inside the <nav> element, and so on.
Besides prettier-looking and more semantic markup, the practical implications are endless. It increases our markup's interoperability. For example, an external system, such as a search engine spider, would be able to more accurately determine what content on a web page is important. It can skip crawling the <nav> element and the <footer> element because they probably do not contain the main content of the web page. A well-formed HTML 5 document would therefore give search engines a better understanding of the content being displayed.
A crafty developer could create an application that pulls out just the <article> section of a group of websites, say, to aggregate it in a database, or generate a list of all the videos on a web page by finding all the <video> elements.
Screen-reading software could give vision-impaired users a quicker way to traverse content sections. They could go to the <article> element directly if they wanted to read the main content of the web page, or go directly to the <nav> element if they wanted to navigate away from the page.
1 TrackBacks
TrackBack URL for this entry: http://www.readwriteweb.com/cgi-bin/mt/mt-tb.cgi/9405
Comments
Subscribe to comments for this post OR Subscribe to comments for all ReadWriteWeb posts
As someone who is an essentially inactive member of this team, let me say that I am also excited about the prospects of HTML 5, if we can figure out what to do with the q tag.
-JAK
Posted by: Justin Anthony Knapp | December 18, 2008 7:17 PM
Glad that good old HTML is changing. Now working with HTML5 should be akin to sprinting rather than jogging with previous versions! Looking forward to using it...
http://www.vantrix.net
Posted by: Anita CM | December 18, 2008 7:18 PM
Check out this podcast w/ Anne van Kesteren from Opera which talks about HTML5 and other coming web standards.
http://knowledgecaps.com/2008/09/19/fos-fresh-online-servicesopera/
Posted by: Ant Bryan | December 18, 2008 8:05 PM
Looks like the table and pie chart in #4 don't match.
Posted by: Jmartens | December 18, 2008 10:18 PM
Ah nothing like poorly formed markup that HTML brings... What a great way to keep web browsers complicated and slow. I really hope that is solved with 5. The extra CPU usage to handle error handling really puts a burden on hand held devices.
Posted by: Bon Jovee | December 18, 2008 10:32 PM
2012? bwahahahahahaha
Posted by: asdf | December 18, 2008 11:33 PM
great idea, do less writing script HTML but give a lot of functionality....
Posted by: redjaal | December 18, 2008 11:34 PM
Thanks ur information
Posted by: Tingu | December 18, 2008 11:36 PM
"as well as other types of 2D visuals (even a cat, if you're so inclined)"
...a cat is fine too?
Posted by: steppres | December 19, 2008 1:38 AM
The forms example currently says <input name="email" required email type="text"> but that ought to be <input name="email" required type="email">
Posted by: Philip | December 19, 2008 2:06 AM
It's possible to write in HTML5 now if you ignore IE's inabilty to render XML properly. I've wrote 3 sites in it now, http://ortatherox.com is a pretty good example.
If you want to know more about actually using it check out this guy : http://camendesign.com/
Posted by: Orta Therox | December 19, 2008 2:48 AM
This is what I like the least about html5. Calling an element an article, an aside, a header... totally inflexible, totally context ridden. If we have a totally different mindset in 10 years time (fair chance we will), those descriptions could mean nothing, or as much as typewriter, betamax or newspaper. STOP it now. classes and id's are flexible. I can use different id's and class names in 10 years time. Element names are written in stone. Just my 3 cents.
Posted by: DC Crowley | December 19, 2008 6:24 AM
Another really great part of the form validation is the inclusion of regular expressions. Regular expressions are very powerful for analyzing and manipulating text. Being able to include them as part of form validation is a godsend.
Posted by: GeekLad
|
December 19, 2008 6:31 AM
I'm waiting for the day that the HTML spec will fix something as simple as a scrollable table with static header. Right now you have to use a bunch of hacks, none of which work well.
Posted by: NBW | December 19, 2008 7:49 AM
Can't wait until 2012..
Posted by: Gercek | December 19, 2008 8:08 AM
Wow, finally the long awaited HTML 5 will be a reality. This news really make my day. Thank you!
Posted by: Fairings | December 19, 2008 8:29 AM
Isn't this invalid XHTML?
<input name="username" required type="text"/>
Posted by: Steve | December 19, 2008 8:36 AM
All of this sounds great and I can't wait to use them, but what about older browsers? To even attempt to use these tags before 2012 is asking for trouble. And maybe even 2012 is too soon . .who knows.
Posted by: FSP | December 19, 2008 10:03 AM
I'm with DC Crowley on this - HTML 5 is really oriented towards blogs and the like. I don't see it being nearly as flexible as HTML 4, and I'm sure that with HTML 5, we'll still be stuck with cheap and nasty workarounds.
There's nothing wrong with HTML 4 - it's powerful, flexible, and if people invested more time in screenreaders and the like, very accessible, too. I can't imagine that HTML 5 will have the same widespread appeal.
~ Wogan
Posted by: Wogan | December 19, 2008 11:09 AM
? ? That's just garbage. "Required" would be invalid as xhtml. Pie charts? Jeez, what bright spark thought that one up? Sounds like this needs a lot more thought and a lot less nonsense.
Posted by: aljuk | December 19, 2008 11:46 AM
I'm really concerned sometimes that some of the bodies are possibly thinking too much about the current use of HTML and not enough about how design and layouts may change in the future.
Maybe it wont... but what I like about the current state, is that it's open to being more than just specific elements.
I believe a more open and undefined list of elements would be better than confining this, human language is far too open to change... look how the word 'gay' has evolved. From being happy to defining people's sexual orientation.
I think it's an improvement, don't get me wrong. It's just we need to try and think as much for the future and let the people define the standard as opposed to a select group of people who think they know best.
Posted by: Kai Chan Vong | December 19, 2008 12:54 PM
The example:
<input name="email" required type="email">
has generated several "this is invalid XHTML" comments.
The example is valid HTML5. There are several attributes in HTML4 that don't require a value, just the presence of the attribute sets it to true, "checked" for instance.
In XHTML5, much like XHTML 1, the syntax for these attributes changes to:
<input name="email" required="required" type="email">
If you're ever curious, the W3C Markup Validator is capable of handling HTML5: http://validator.w3.org/
Posted by: Shawn Medero | December 20, 2008 5:41 AM
Kai: HTML4 provided open elements like <div>; HTML5 still allows those elements, so how is it more confining?
The new structural elements in HTML5 have largely come from "the people", not just a group claiming to be experts – that group looked at evidence of how people use HTML and designed the new elements to match what people are already doing.
(The main benefit of adding elements for these cases, instead of sticking with <div class="...">, is that it allows tools to understand the meaning of the elements and apply special processing rules. E.g. <section> can control the scope of <h1> headers, letting tools generate more accurate outline views of the document, and <header> could let small-screen browsers provide a "skip to content" feature without requiring authors to manually insert skip links into their page.)
Posted by: Philip | December 20, 2008 11:56 AM
I've been hearing a lot about HTML5. It's sad that we have to wait until 2012 for these updates. The Internet, all standards included, evolves in a very slow process. E.g. browsers; Internet Explorer bottlenecks browser evolution just as Netscape did back in the day...
Posted by: Timothy | December 22, 2008 7:12 AM
HTML 5 does not appear to be the mind-blowing quantum leap I had expected it to be. I hope there will be more to it than this, because all this will do is add features that developers have been working around for years.
1) Better page element identification for SEO: so what? Just make a sitemap and submit it to Googlebot. Problem solved.
2) Improved form handling: if you don't know how to use PHP, ASP, CGI, or JavaScript to set up a form by now, your site probably does not need one at all.
3) Embedded API's: what can you embed using HTML 5 that you cannot already embed with Flash or Google Maps?
4) Canvas element: while the idea of on-the-fly image generation seems cool, the sample shot looks primitive. I could make a better chart or graph in Office 97.
5) User editable content: well somehow Wikipedia and a thousand other wiki sites are up and running right now without a "contenteditable" tag. Do we really need this?
I think it's a great idea to update the HTML spec and I don't mean to come off as too negative, but I'm disappointed there aren't more whiz-bang features and that the spec won't be finished before the end of the decade.
What I would like to see is improved positioning, padding, and spacing for DIV elements so we don't have to nest them inside each other just to get something centered on the page. Y'know, stuff people might actually use instead of solving problems we've been working around for years. Just my two cents.
Posted by: North Phoenix Blogger | December 22, 2008 6:38 PM
What a post!! Very informative and easy to undesrtand.looking for more such posts.
Posted by: webform | December 25, 2008 12:34 PM
What a post!! Very informative and easy to understand.looking for more such posts..Lets share some information regarding the technology.
Posted by: webform | December 25, 2008 12:59 PM
The required field seems like the best yet. But I must say that I do not expect to see any of these things for a very long time. Not only do they need to keep revising things but also it takes a long time for browsers to get used to it and even more for users to actually start implementing it. For now css does a great work with the placement stuff.
Posted by: Yasser | December 25, 2008 1:57 PM
Do you really mean sendinging in page 2?
Posted by: Francis Hemingway
|
December 26, 2008 2:38 PM
I'm in favor of the less rigid elements like also - but we will still be able to use these in html5, won't we?
Is this move towards highly defined elements geared more towards search engines or humans?
Posted by: Chopin Liszt | December 29, 2008 12:34 AM
This is the first time I have seen this website, very useful and informative.
Posted by: de dietrich | January 4, 2009 5:45 AM