Lets face it, websites have moved on from the plain boring static pages with bright color schemes. Times moved on and so has HTML. If you haven’t already heard if it, you really should check out HTML5 and what it is capable of. This article will dive in at the deep end of some of the most experienced HTML5 developed websites out there.
Lets get started. These websites are in no particular order.
If you’re a fan of Arcade Fire’s song “We used to wait” then you’ll love this website even more than I do. The site asks you to input your address from where you were born and then uses google earth and HTML5 to create a personalized music video.
My personal opinion – This website’s overall look is amazing. It’s smooth and doesn’t require you to download any addition software (HTML at it’s best) Defiantly worth a look. However, if your computer’s processor isn’t too great you will have trouble accessing it smoothly. Loading up can also take a little while.
3 Dreams of Black uses HTML5 to promote Danger Mouse and Daniele Luppi’s album Rome. It creates a 3D interactive world that uses WebGL where all the objects react with user inputs and the music. The site will make you feel as if you’ve EXPERIENCED the song and not simply listened to it.
My personal opinion – Overall, I like the idea of the site.I love how when you move the mouse to angle on which you’re viewing changes. Unlike the above website, it runs smoothly on every PC (update me if I’m wrong) and has great use of colour and music. Again, HTML5 at it’s best!
This website uses HTML5 to allow users to take an interactive stroll down one of the busiest streets in Zurich. A fun experience that allows users a glimpse into what the future of virtual tourism may look like. This also serves as a guide to a more intimate way for small business to advertise their shops.
My personal opinion – One of my Favorite in the top 10! I love how the scrolling moves you along and gives you the effect as if you’re truly there in the car/truck. The only drawback is that it’s a complete different language and the translation doesn’t work too well – nothing major just me being picky. A great site built using HTML5.
A scroll activated digital comic book developed by Saizen Media uses HTML5 to breathe some new live into the presentation of graphic stories. The added motion and pacing makes the static images and story seem to come alive in a way that seems to be a bridge between old comics and video.
My personal opinion – Yet again, another great site built with HTML5. Tells you a story without you doing anything at all. My only two drawbacks are that it’s a one-time visit kind of website, as each visit will be the same. Also, if you are to scroll down yourself, you loose out on the voicing in the background. Never-the-less, still an amazing overall site.
Universeries is a reference site about television producers and the shows they’ve created that illustrates how html5’s data visualization tools can enhance static information presentation. If you love TV and would like to find out more about your favorite shows there is no more entertaining way to do so online.
My personal opinion – Well, it certainly makes a change to a website that could easily be a “normal” website. It’s effects make viewing the website a pleasurable experience and I would be happy to come back anytime. The colour-scheme is great and I think it’s a great website. So far, no drawbacks.
Adobe created the Expressive Web website to highlight the functionality and creative potential offered through the use of HTML5 and CSS3. Through various examples and code snippets this is truly the best “advanced” HTML5 user guide we’ve seen. This site should be bookmarked by all HTML5 developers.
My personal opinion – This byfar one of my Favorite websites, ever! I love how it’s educating and nice to look at. However some drawbacks are: New pages take a while too load and can be a little ‘laggy’ at times.
This site was developed by CNN to chronicle the Global Climate Change conference in Durban. It showcases how HTML5 can be used to create a visual representation of static information. A good example of how news organization can get more creative in their presentation of information.
My personal opinion – I love how the site uses social media integrated within the site and everything is laid very clearly. However, if you have a few running applications up on a pc with a processor that isn’t too great the site may be a little slow when loading pages. Other than that, a great website again!
Art of the Stars uses your IP address to draw a picture of the Star constellation directly above you. What is most interesting about this project is that it uses HTML5 to develop an application on the web in a similar manner to those currently built in mobile applications for the Droid and iPhone.
My personal opinion – I like the overall idea of this site, the colour scheme isn’t the best but it works. It’s great how it uses your IP to locate where you are and then show you the star constellation directly above you. It can be a little hard to control at times though.
This Shell website is an HTML5 experiment created by Legwork Studios that promotes Gamit’s new album “Parts” in a rather fun and rewarding manner. The website presents fans with a video puzzle that if solved, before the music ends, allows them access to a free mp3 download of the song.
My personal opinion – Well, I’d like to give a mini-review on this site and I was excited to. However, I waited 5 minutes and the site failed to load. Anyway, besides that the color scheme looked nice
The Lost World’s Fair site was developed to showcase the HTML5 capabilities inherent in IE9 by creating interactive posters that take users on a journey to three fabled locales. By using your mouse to scroll down each poster visitors are allowed to uncover further mysteries hidden in each location.
My personal opinion – At first glance this site doesn’t look as spectacular as the others in this list. However, once you view a few of the other pages you notice the power of HTML5 kick into action. It’s worth taking a look. After a few times browsing, I fail to notice any major drawbacks.
So, what was your Favorite? Do you have any HTML5 sites of your own? We’d love to hear back from you in the comments below. Thank-you for reading.
If you are considering getting into HTML, take a look at some helpful websites that can help you along the learning path.
- http://www.w3schools.com/html/html5_intro.asp – Good old classic w3, easy way of learning.
- http://www.html5rocks.com/en/ – one of the best sites, resources, tutorials and HTML news all on one website.
- http://html5test.com/ – Test if your browser can support the new modern way of coding
- http://html5boilerplate.com/ – A template purely coded in HTML5, great for starting off using a framework!
Hope to see some of your HTML5 work posted on the forums soon!