Your browser does not support javascript or it has been switched off. The interactive functionalities of this site will not function without javascript.

Top of this document
Go directly to navigation
Go directly to page content

Willem Velthoven 6

html5 research summer 2010

What relevant issues can we improve and simplify with html5?

HTML 5 allows us to implement design and interfaces of our websites better and more simple. It also gives us whole new possibilities for interaction. In the summer of 2010 we're researching these possibilities and learning about them.

This page lists all the things that front end developers and designers identify as interesting areas to improve by using html5.

One important issue is that some older browsers and Microsoft IE do not support all of these features. So we'll have to learn how to use so that our interfaces will "gracefully degrade" when used in older browsers.

general design possibilities

form elements

form validation

font issues e.g. with typekit and .woff

better ways of ajaxing with our api

Contributions

Andreas Conradi,

Evelyn Grooten

Comments (6)

Form Elements

I'd love to look into HTML5 form elements to first broaden my own understanding of the concepts and later on train other frontenders on the proper use.

Kerim Satirli

29 Jun 2010, 12:26

Fonts with CSS3

Some time ago, I did some research on CSS3 fonts. This blog post is a really good examination of its status: http://blog.themeforest.net/tutorials/how-to-achieve-cross-browser-font-face-support

Tools to convert fonts:

Blaise Kal

29 Jun 2010, 12:51

Drag and drop

Clients and other people (like users) love drag and drop interfaces. It seems that html5 can handle this too.

Ino Paap

29 Jun 2010, 13:11

Browser issues

We have to be aware of browser issues. For some interfaces the advantages of techniques like html5 can prefer the lack of support for that technique in certain browsers. To make the right decisions in projects we need to have knowledge about the support of html5 in different browsers.

Ino Paap

29 Jun 2010, 13:13

Good starting points and a list of "nice to know more about"

http://html5readiness.com/
http://caniuse.com/#cats=HTML5&statuses=rec,pr,cr,wd,ietf
http://www.html5rocks.com/
http://html5doctor.com/
http://diveintohtml5.org/

As you see lots of the html5 features are not available for IE and when they are it is is mainly IE8.
But IE9 is on his way with a way better implementation of webstandards.
We could give certain features to users with modern browsers
( Modernizr: http://www.modernizr.com/ )

Good to check out:

Contenteditable: http://html5demos.com/contenteditable

Drag and drop: http://ljouanneau.com/lab/html5/demodragdrop.html

Video / audio tag ( with fallback )

Webstorage / local storage: http://boldr.net/faster-ajax-html5-localstorage http://www.html5rocks.com/tutorials/speed/quick/#toc-webstorage

The use of data attributes (as we do already in our forum library) an example could be tooltips: http://www.frequency-decoder.com/demo/css-tooltips/

Messaging: http://ejohn.org/blog/cross-window-messaging/

@Font-face

Web sql database: http://www.html5rocks.com/tutorials/webdatabase/todo/