HTML5, Meet Drupal 8!
HTML5, Meet Drupal 8!
HTML5. If you haven't heard of it, perhaps you've seen the 50's superhero inspired logo (left) which is popping up all over? On May 18, 2011, Drupal creator, Dries Buytaert, announced that HTML5 is not only going to be one of the top five initiatives for Drupal 8, but that the default doctype for Drupal will switch from XHTML to HTML5. What's this mean to you, a Drupal dev or Drupul user? Let's find out.
1. First of All, What is HTML5?
Basically, HTML5 allows website builders – or perhaps, “web builders” since with HTML5, a single site will become much more hooked into the larger World Wide Web network of sites, interfaces and functions – to embed and manipulate video and audio elements, as well as to draw and/or create graphics through scripts (or “code”), that they will then be able to animate, through scripts. The “hook” into the WWW comes through structural tags being added to the language. Tags like “<header>”, “<nav>” and “<article>” will connect your web page elements to similar elements on other sites. This will allow for more intelligent linking via search engines, and will open up new possibilities for cataloguing the World Wide Web and for communication and/or interfacing across sites. These tags are part of the Semantic Web initiative.
APIs and DOMs
In essence, a whole bunch more tools just got dumped into the web developer's toolbox; tools that will allow you to make browser-based games, interactions and animations – or web sites that behave like games, interactions and animations. Using a Chrome browser, check out Angry Birds in the browser, and RO.ME, music video-game-website hybrid, for examples of what's possible.
2. Why HTML5?
Take it away, Dries: “simply put, (HTML5) can provide a much better user experience on both desktop and mobile devices, and could lead to a convergence between native applications and the mobile web.”
In other words, lots more interaction, animation, video and audio on web sites, as they evolve into much more fluid entities, morphing in size and functionality to display and be used across a plethora of screens and devices, while simultaneously becoming more integrated with other sites, libraries and functions, across the World Wide Web. Think of a tree, pushing down roots and pushing out branches; flowering, bearing the fruit of rich media, and cross-pollinating.
3. How HTML5?
"Ohhhh, no. Oh, no, oh, no, oh, no. I have to learn a whole bunch more tags and processes now, right?" Sort of – but not really.
Firstly, HTML5 is not difficult to learn. You're probably already using CSS3 to add dropshadows to images and round corners on your boxes. Using HTML5 is not going to be anymore difficult than that. One day, you are using “<embed>” to add your video; next, BAM! You are using “<video>” (and of course, stretching, colouring and enhancing your video through HTML5, just because you can).
Drupal? Drupal, a GUI for HTML, PHP and JS, is not going to stop being that. Imagine HTML5 goodness rolled into the Drupal CMS, with added functionality to allow you to add your own HTML5 tags when and where you wish. You will, in fact, be HTML5'ing before you know you are HTML5'ing.
Drupal Integration, High Level
- implement HTML5 elements that will offer the most benefits to end users,
- help contributed modules and themes, both existing and new, incorporate HTML5 elements, and
- allow theme developers to use, or opt out of use of, HTML5's semantic elements,
These goals will be implemented by:
- ensuring HTML5's form elements can be used via Drupal’s Form API,
- adding HTML5's semantic elements to core templates,
- integrating ARIA (Accessible Rich Internet Applications) roles into markup,
- simplifying style and script elements, and
- ensuring that input filters and functions accept HTML5 elements.
Many HTML5 APIs, she cautions, “including audio, video, drag and drop, offline web applications, storage, (and) geolocation” will not be implemented in core by default, but will be considered on a case by case basis.
Drupal Integration, Mid-Level
If you'd like to get involved in integrating HTML5 into Drupal 8, your help is not only welcome, but requested! Here are the main pages to visit, to see what's happening and where you can help:
Remember, you don't need to code. Documentation, marketing, testing and user interface are just some of the areas in which you can contribute, aside from code.
The HTML5 Issue queue is a list of tasks that need to be addressed to implement HTML5 in Drupal 8's core.
At the HTML5 Working Group page you will find discussions, projects, documentation, events and even a job board.
- implementing HTML5 markup and APIs in Drupal
- adding HTML5 support to Drupal 7
- getting HTML5 native markup and form elements into Drupal 8 core.
- HTML5 Tools, a module to override core functions,
- Elements module, a “repository for advanced form elements,” which works with HTML5 Tools,
- HTML5 Base, a base theme for working with HTML5, and
- Semantic Views, to help you control Views markup.
Documentation includes HTML5 Myths and the wiki.
I highly encourage you to read the myths. Here's an example:
“Myth: HTML5 is not done, we should wait until it's done before implementing it in Drupal.
Fact: Most of HTML5 is dividable in 3 different groups: "it just works", "degrades by default", and "some effort required". See http://mathiasbynens.be/notes/html5-levels for additional information.
Also, the WHATWG, the driving force behind HTML5, has dubbed it a "living standard" that is constantly evolving. As such, the version number is less of an issue. The "2022" release date is nullified, and they instead will measure progress in feature milestones. HTML5 will still be documented by the W3C as an official spec, but the WHATWG will keep driving forward progress, simply calling it "HTML". More here...
Events include many IRC meetings, that you can attend without leaving your computer.
Lastly, here's a list of resources, largely courtesy of Jacine, to help you get started with HTML5:
- Dive into HTML5
- HTML5 Doctor
- When can I use…
- HTML5 Spec for Web Developers | Full spec
- http://caniuse.com/ - table of browser support
- Drupal HTML5 initiative on twitter: http://twitter.com/drupalhtml5
That's it in a nutshell. HTML5 is going to make the web come alive with graphics, movement and communication. Drupal 8 is gearing up to seamlessly bring all of this life into the world's best CMS. Dig in, folks – and get involved!