Together At Last: HTML5 & Drupal



March 04, 2011

OpenConcept Consulting takes a step into the future of the web with HTML5. Witness the power of lightning fast and super stable in-page video with the stunning effects of jQuery. Accessible, mobile friendly, sleek and flexible: HTML5 is where our heart is.

We are early adopters of many new technologies so that we can test/evaluate them before implementing them for our clients. We pushed forward with an early Drupal 7 install so that we could dedicate some time to working out the remaining kinks that are holding back implementation of this great new version. We've been using social media to extend our network with others & continue to explore how it can be used to improve our services. With so many new technologies you really do need to dive into them before you know how they can be used.

Although the standards for HTML5 are still in draft form, there really isn't any debate about the core aspects of this new standard. Yes, if you want to use some of the really cutting edge pieces of this new standard, you're going to have to pick and choose very carefully. There are great tools like the When Can I use site which gives a summary of what functions are supported by which browsers. We've clearly stated that we're not supporting IE6. Eliminating support for IE6 allows us to build sites based on W3C standards rather then specific browsers. IE support is still generally lagging behind other browsers, but both IE7 & IE8 support most of what we are likely going to want to implement.

There are great tools to see how well your browser supports HTML5. There are a bunch of HTML5 elements for instance that we aren't going to be implementing until there is better support for them (I use Firefox 3.6 and it only scores 155/400 points). However, we can already start to take advantage of the new elements that are part of this new standard.

There is a nice list of Accessibility enhancements that are now available through HTML5. They seem to be best supported now in Firefox 4.0 b10, but but this will be better supported by both AT & the browsers in the future. This list shows that many browsers do not take advantage of the improvements in accessibility for HTML5, but it doesn't degrade the experience.

We can't really claim to be blazing trails here however. It was great to meet with John Foliot at DrupalCon SF, he's been contributing to the W3C guidelines, especially with regard to accessibility. He's been a great resource for questions about best practices, because it isn't always easy to convert a standard into a site. We worked a lot with Jeff Burnz on Drupal 7 accessibility work and we have adopted his Genesis theme as the foundation of our new site. He did the initial work of porting this theme to HTML5 and we are contributing to it. Jen Simmons has also been providing lots of resources about HTML5 & Drupal and I look forward to hearing her presentation at DrupalCon Chicago. We did a presentation at DrupalCamp Montreal using HTML5 in the fall using some tools available from HTML5 Rocks (Now in Google's Web Fundamentals). There is just so much good stuff out there!

We know that by moving our site to HTML5 now we will provide better support for mobile browsers. We know that by including WAI-ARIA into our HTML5 site that we will provide better support for Assistive Technology users, even before their browsers make full use of HTML5. There are enough users (90%) out there who use a browser that supports the HTML5 we are using, and it's time to focus on the experience of those users.

About The Author

Mike Gifford is the founder of OpenConcept Consulting Inc, which he started in 1999. Since then, he has been particularly active in developing and extending open source content management systems to allow people to get closer to their content. Before starting OpenConcept, Mike had worked for a number of national NGOs including Oxfam Canada and Friends of the Earth.