15 Sites That Do Amazing Things With HTML5

html5 title   15 Sites That Do Amazing Things With HTML5The forthcoming HTML5 update to the 20 year old HyperText Markup Language promises to bring the “web” experience to a whole new level, allowing the browser to do more from both a visual and data perspective. Even though HTML5 is still a good distance away from being fully deployed, that hasn’t stopped many developers from pushing it to the limits.

Check out these amazing websites which really give you a good idea as to the capabilities of HTML5 as a programming language, doing things in your web browser that were once only possible in an external program or plugin. I’ve tested them in Chrome and they should all work in an HTML5 compliant browser such as Chrome, Firefox 4, Safari or IE9. They are demos and HTML5 is still a work in progress, so if you have problems viewing them you might want to try in another browser. Enjoy!

Arcade Fire – The Wilderness Downtown

arcadefire   15 Sites That Do Amazing Things With HTML5

This is a great demo done by Arcade Fire and Google which feature different HTML5 Canvas tricks. I don’t want to spoil the surprise for you – enter your childhood address and enjoy the video and technical wizardry.

WebVenture

webventure   15 Sites That Do Amazing Things With HTML5

WebVenture is an HTML5 and Javascript implementation of the MacVenture gaming platform. You can now play Deja Vu 1 & 2, Shadowgate and Uninvited right in your browser! Other game implementations such as Wolfenstein 3D are being worked on, bringing gaming into your browser.

20 Things I Learned About Browsers And The Web

20things   15 Sites That Do Amazing Things With HTML5

This site from Google demos a “book” styled approach to a description about how web browsers work and how many of the underlying technologies work. Impressive from a technical standpoint, it also is a good primer for readers who would like to know more about how the web works.

Collaborative Drawing

draw2x websocket   15 Sites That Do Amazing Things With HTML5

This demo uses the HTML5 websockets feature to allow viewers to collaboratively – at the same time – draw on the canvas.

[NO LONGER WORKS] SketchPad

sketchpad   15 Sites That Do Amazing Things With HTML5

SketchPad is a “paint” program for the web. It supports rudimentary drawing instruments and is done only in HTML5 and JavaScript.

Galactic Plunder

galactic plunder   15 Sites That Do Amazing Things With HTML5

Galactic Plunder is a 2D Space Shooter implemented in HTML5. Not quite as feature filled as a normal side scrolling shooter, it is done entirely in HTML5 which is impressive in itself.

Video Effects

explodevideo   15 Sites That Do Amazing Things With HTML5

HTML5 allows you to to much with video on the web. In addition to letting you play it without your web browser, with no plugin, it allows you to manipulate that video. This demo shows how you can “Blow up” the pixels of a video while playing.

Multiple Window Ball

ballwindow   15 Sites That Do Amazing Things With HTML5

This demonstrates and effect also seen in the Arcade Fire video. HTML5 allows you to open multiple windows and have objects move between them.

HTML5Rocks (Google)

html5rocks   15 Sites That Do Amazing Things With HTML5

HTML5 Rocks is a slideshow which demonstrates many of the special features of the HTML5 language. If you are a developer it gives you sample code and lets you see the possibilities of HTML5.

8-bit Color Cycling (Like Old School Games)

cycle   15 Sites That Do Amazing Things With HTML5

If you were a gamer in the early 90s you will remember this effect fondly. Since computational power was limited, graphic designers used ‘tricks’ to emulate video in a static image. This canvas effect will show you how it was done and also includes many examples which are beautiful as well.

HTML5 Experiments from Hakim.se

corecanvas   15 Sites That Do Amazing Things With HTML5

This site lists many demos of games and other neat little gadgets to show off what you can do with HTML5. Good for inspiration and maybe a little time diversion.

Harmony

harmony   15 Sites That Do Amazing Things With HTML5

Harmony is a neat little drawing program that lets you use cool brushes to paint a picture. You can create things such as “fur” and “web” which are just cool to see in creation.

Twitter/Music Mashup

9elements   15 Sites That Do Amazing Things With HTML5

This neat mashup from @9elements pits music and rotating dots with twitter posts about HTML5. Hard to describe in practice, must be seen to understand!

Radiohead/HTML5 Mashup

radiohead   15 Sites That Do Amazing Things With HTML5

Another neat mashup which pits Radiohead’s Idioteque with a drawing of Thom Yorke which is drawn as the song progresses. Another “seen to be believed” effect.

Want More?

HTML5Demos / CanvasDemos

canvasdemos   15 Sites That Do Amazing Things With HTML5

These two websites are set up to give views a wide variety of demos of HTML5 and the HTML5 Canvas effects. Ranging from the mundane to the “cool”, if you are thirsty for more these are the places to go.

There are many demos of HTML5 out there on the internet now – and it is well on its way to becoming the new standard of the web. Do you have awesome demos you would like to share? Please post in the comments below!

The comments were closed because the article is more than 180 days old.

If you have any questions related to what's mentioned in the article or need help with any computer issue, ask it on MakeUseOf Answers—We and our community will be more than happy to help.

8 Comments -

Harp B

HTML5 is a markup language, NOT a programming language.
Here is another HTML5 site that works in Chrome: http://peri.me/slidio

Harp B

HTML5 is a markup language, NOT a programming language.
Here is another HTML5 site that works in Chrome: http://peri.me/slidio

ResQBrett

Markup, programming..whatever! Great list and thanks for sharing.

PTEC

I Love HTML5

cybeleproducts

I’m sure that HTML5 will bring us new standards.

Here you have a link to check a new pure-web solution for remote desktop access, already reviewed at MakeUseOf: http://www.makeuseof.com/tag/c

You can install ThinVNC on your PC to access it from any computer using just an HTML5 capable browser:

http://www.supportsmith.com/Th

:)

cybeleproducts

I’m sure that HTML5 will bring us new standards.

Here you have a link to check a new pure-web solution for remote desktop access, already reviewed at MakeUseOf: http://www.makeuseof.com/tag/control-computer-remotely-html5-thinvnc/

You can install ThinVNC on your PC to access it from any computer using just an HTML5 capable browser:

http://www.supportsmith.com/ThinVNC/HTML5-VNC.Aspx

:)

marionjoy

great list .. love the site …

Hermitbiker

…. just to get the ball rolling here are some very cool tutorials for HTML5 !! :-)