HTML5 Gallery » charset

Terjin

Ian Devlin — Wed, 16 May 2012 09:00:17 +0000

Personal website of interaction designer, Terjin.

Copious use of the new HTML5 structural element, although the section element has been overused, with our old friend the div being more appropriate in certain places. The “sidebar” div that contains numerous aside elements probably could have been an aside itself with sections.

URL: http://terj.in/

Blacktie

Richard Clark — Thu, 10 May 2012 15:00:32 +0000

Blacktie is a digital agency based in Spain. The site uses several new sectioning elements from HTML5. There is an opportunity to improve the document outline by adding some nested section elements within other areas where the section element has been used.

URL: http://www.blacktie.es

Zeneye

Richard Clark — Wed, 09 May 2012 19:49:16 +0000

Zeneye is the personal website of Robert Fyffe, a freelance developer from Scotland. The site uses several new HTML5 structural elements including nav, footer, section and aside. nav is arguably overused and the way sections have been used could be more well thought out.

URL: http://www.zeneye.co.uk

Edgar Leijs

Derek Johnson — Wed, 11 Apr 2012 21:05:38 +0000

Edgar Leijs is a web designer and web editor from Amsterdam.

It’s nice to see Edgar’s portfolio items marked up using the article element rather than div or li, both of which are very common. The article is much more semantic and Edgar shows a good understanding of when it can be used.

Edgar’s use of the header element is unnecessary when it’s only content is a heading, but it’s not wrong by any means. Similarly the nested section in the portfolio items would probably be better as a div, or else given a heading.

URL: http://www.edgarleijs.com/

Doubleleft

Derek Johnson — Thu, 05 Apr 2012 21:51:58 +0000

The website of Brazilian iOS app developers Doubleleft.

Some of the new HTML5 elements get a good showing in this site, and the author has taken care to use the shorter doctype and meta charset declaration. The type attribute has also been removed from all the script elements, although not the stylesheet link element where it is also unnecessary.

URL: http://doubleleft.com/

Tatiana Bileski

Derek Johnson — Fri, 30 Mar 2012 11:50:45 +0000

The personal site of designer Tatiana Bileski.

HTML5 structural elements are used in the site, although there are too many untitled sections being used where div would be better. However it’s nice to see native video in use, and with the poster attribute.

in use, and with the

URL: http://www.tatianabileski.com/

I Like Taking Photos

Derek Johnson — Thu, 29 Mar 2012 21:30:46 +0000

A selection of photographs by Rhainon Farrow.

This is a very simple site that uses the HTML5 doctype, shortened charset declaration and a couple of new elements. The photos don’t need to be in a section as they are not a sub-section of the document, they are the main content. However, kudos for usingsmall in the footer, and a nice reminder that you don’t need to do much to start using HTML5 today.

URL: http://iliketakingphotos.co.uk/

Gethu Games

Derek Johnson — Tue, 27 Mar 2012 22:13:08 +0000

Two canvas based games – one a spirograph maker with adjustable parameters to allow users to create different shapes and colours. The other is a 9×9 versions of tic-tac-toe that has an audio track playing. Both games will run offline thanks to appcache.

Clever and fun!

URL: http://www.gethugames.in/

Picozu Image Editor

Derek Johnson — Sun, 25 Mar 2012 23:01:04 +0000

Picozu is an online image editor that uses the canvas element and other HTML5 technologies. Appcache is used to store images used in the app’s skin for offline use, and localStorage is used as part of the Facebook integration.

In the markup the menu element would be a good choice for the list of commands used, possibly with toolbar set as the type. There are also a couple of type attributes in the script tags, but other than that a very smart piece of web development.

URL: http://www.picozu.com/editor

Wild Rhody

Derek Johnson — Fri, 23 Mar 2012 13:22:49 +0000

A website for a company started by two fishermen that supplies local seafood in Rhode Island.

The site has a nice outline and makes good use of some of the new HTML5 elements. I would probably change the “Did you know” section on the home page to an aside as it is tangentially related to the main content, and I would use input type="tel" in the contact form.

URL: http://www.wildrhodyseafood.com/