15 webbplatser som gör fantastiska saker med HTML5

De kommande HTML5 10-sidorna för att se vilken HTML5 handlar om 10 webbplatser om vad som händer Vad HTML5 handlar om Läs Mer uppdatering till 20-åriga HyperText Markup Language lovar att ta med “webb” uppleva till en helt ny nivå, så att webbläsaren kan göra mer från både ett visuellt och dataperspektiv. Även om HTML5 fortfarande är ett bra avstånd från att vara fullt utplacerat, har det inte hindrat många utvecklare från att trycka det på gränserna.

Kolla in dessa fantastiska webbplatser som verkligen ger dig en bra uppfattning om egenskaperna hos HTML5 som ett programmeringsspråk, gör saker i din webbläsare som enbart var möjliga i ett externt program eller plugin. Jag har testat dem i Chrome och de ska alla fungera i en HTML5-kompatibel webbläsare som Chrome, Firefox 4, Safari eller IE9. Det är demos och HTML5 är fortfarande ett pågående arbete, så om du har problem med att visa dem kanske du vill försöka i en annan webbläsare. Njut av!

Arcade Fire - The Wilderness Downtown

Detta är en bra demonstration gjord av Arcade Fire och Google, som har olika HTML5 Canvas tricks. Jag vill inte förstöra överraskningen för dig - skriv in din barndomsadress och njut av videon och den tekniska trollkarlen.

WebVenture

WebVenture är en HTML5 och Javascript-implementering av MacVentures spelplattform. Du kan nu spela Deja Vu 1 & 2, Shadowgate och Uninvited direkt i din webbläsare! Andra spelimplementeringar som Wolfenstein 3D bearbetas och spelar spel i din webbläsare.

20 saker jag lärde mig om webbläsare och webben

Den här webbplatsen från Google-demos a “bok” stilad inställning till en beskrivning om hur webbläsare arbetar och hur många av de bakomliggande teknikerna som fungerar. Imponerande från en teknisk synpunkt är det också en bra grund för läsare som vill veta mer om hur webben fungerar.

Collaborative Drawing

Denna demo använder HTML5 websockets-funktionen för att tillåta tittare att samarbeta - samtidigt - dra på duken.

[NO LONGER WORKS] SketchPad

SketchPad är en “måla” program för webben. Den stöder rudimentära ritningsinstrument och görs endast i HTML5 och JavaScript.

Galaktisk plundring

Galactic Plunder är en 2D Space Shooter implementerad i HTML5. Inte helt som funktion fylld som en vanlig sidrullningsskytte, det görs helt i HTML5 vilket är imponerande i sig.

Videoeffekter

HTML5 kan du göra för mycket med video på webben. Förutom att du låter dig spela den utan din webbläsare, utan plugin, kan du manipulera den videon. Denna demo visar hur du kan “Spränga” pixlarna i en video medan du spelar.

Flera fönsterboll

Detta demonstrerar och verkar också ses i Arcade Fire-videon. HTML5 låter dig öppna flera fönster och få objekt att flytta mellan dem.

HTML5Rocks (Google)

HTML5 Rocks är ett bildspel som visar många av de speciella funktionerna i HTML5-språket. Om du är en utvecklare ger den dig provkod och låter dig se möjligheterna till HTML5.

8-bitars färgcykling (som gamla skolspel)

Om du var en spelare i början av 90-talet kommer du att minnas denna effekt fondly. Eftersom beräkningskraften var begränsad, använde grafiska designers "tricks" för att emulera video i en statisk bild. Denna kanfasffekt visar dig hur det gjordes och innehåller också många exempel som också är vackra.

HTML5 Experiment från Hakim.se

Den här webbplatsen innehåller många demos av spel och andra snygga små prylar för att visa vad du kan göra med HTML5. Bra för inspiration och kanske lite tidavledning.

Harmoni

Harmony är ett snyggt lite ritprogram som låter dig använda snygga penslar för att måla en bild. Du kan skapa saker som “päls” och “webb” som är bara coola att se i skapandet.

Twitter / Music Mashup

Denna snygga mashup från @ 9elements pitar musik och roterande prickar med twitter inlägg om HTML5. Svårt att beskriva i praktiken måste ses för att förstå!

Radiohead / HTML5 Mashup

En annan snygg mashup som pussar Radiohead's Idioteque med en teckning av Thom Yorke som ritas som sången fortskrider. Annan “ses att bli trodde” effekt.

Vill ha mer?

HTML5Demos / CanvasDemos

Dessa två webbplatser är utformade för att ge synpunkter en mängd olika demos av HTML5 och HTML5 Canvas effekter. Räcker från det vardagliga till “Häftigt”, om du är törstig efter mer är det platserna att gå.

Det finns många demos av HTML5 där ute på internet nu - och det går bra på att bli den nya standarden på webben. Har du fantastiska demos du vill dela med dig? Vänligen posta i kommentarerna nedan!