Jag tar det här inlägget för att lösa en fråga du nyligen ställde i kommentarerna till en artikel:
När är det bra att börja designa helt med HTML5?
Ärligt talat beror det på det mål du riktar dig till. Om du inte planerar att dina besökare ska använda Internet Explorer (t.ex.: Mac-mjukvarusida) börja du genast med HTML5, men om du behöver personer med IE för att se din webbplats, vänta ...
Om ingången, långt efter hoppet, 48 demos av HTML5 som är fantastiska och förtjänar att ses. Stor är liten.
Källa | HongKiat
audioburst animation
En bekväm och fantastisk animation skapad med HTML5s duk och ljudtagg.
Bollhav
Att visas i den senaste Google I / O-händelsen, visar denna demo dig hur dynamisk HTML5 kan vara.
Blob sallad
En HTML5-skapad varelse som skulle glädja dig.
bomomo
Med Bomomo kan du observera olika atomrörelser simulerade med HTML5.
Webbläsarboll
Bli förvånad över denna HTML5-boll med "webbläsare".
Bubbles
Ha kul genom att skapa oändliga flytande bubblor med olika färger.
Canvas tecknad filmanimering
En enkel och rolig HTML5-tecknad film som hjälper dig att förstå vad HTML5s dukelement kan göra.
Coolklocka
En fin, anpassningsbar analog klocka byggd av HTML5 och JavaScript.
Flickr PS3 Bildspel
Se dina Flickrs foton med PS3-stil bildspel i webbläsaren.
Interaktiv Polaroid
En interaktiv demo som fungerar ganska likt multi touch-gränssnittet.
JS Fireworks
Njut av fyrverkerimomentet med din önskade tyngdkraft och hastighet, drivs av HTML5 och Javascript.
Kalejdoskop
Ett mycket vackert och futuristiskt HTML5-kalejdoskop.
Flytande partiklar
Känslig partikelanimering som reagerar baserat på din musrörelse.
mesmerizer
En annan känslig och enastående HTML5-demo som visar hur element i närheten reagerar med din musrörelse.
Nebulosa moln
Gå vilse med den här underbara HTML5-nebulosan.
Parallax
Visa alla 2D-former i parallellt perspektiv.
Partikelanimering
En elegant HTML5-partikelanimering som kan bildas till ditt önskade meddelande.
Sprid
Gå vilse med den oändliga spridningsanimationen.
Starfield field~~POS=HEADCOMP
En väldigt cool HTML5-starfield-animation som skulle ändra riktning och hastighet baserat på din musrörelse.
Video förstörelse
Ett klick för att lyssna på en spelande video.
Waveform
Lägg märke till hur HTML5s kanvasvåg rör sig genom att ändra dess amplitud, våglängd, bredd etc.
3D-effekt
Imponerad av canvasanimation? Det är mer HTML5s canvaselement kan göra, och det kallas 3D-effekt. Utvecklare kan lita på canvas-element, DOM och JavaScript för att skapa 3D-effekt, som senare kan utvecklas till 3D-animering eller spel.
Canvas3D och Flickr
Få en helt ny 3D-upplevelse med Flickrs fotoström.
Tygsimulering
En realistisk, HTML5-baserad tygsimulering.
Utvecklande monster
Observera ett monster som utvecklas till en komplicerad varelse, en av dess skapare är HTML5.
Google Presentlåda
Jätte sökmotor Google presenteras i 3D, spelbar vy.
J.S. Touch
En högkvalitativ och realistisk '3D on 2D Canvas' utställning.
Data Presentation
Medan HTML5s canvaselement kan användas för att skapa animering och 3D-effekt kan det också implementeras för att presentera matematiska data.
gnuplot
Gnuplot, en dataplotningsprogram i HTML5-version.
RGraph
RGraph erbjuder ett brett utbud av datapresentationer som stapeldiagram, förloppsindikator och traditionellt radardiagram.
Webbapplikation
I slutändan kan man använda alla möjligheter kombinerade med HTML5 och andra språk, skapa interaktiva applikationer eller spel som ligger nära Flash-applikationen.
CanvasPaint
Vittne om bror till Microsoft Paint kommer in i din webbläsare, och hans far är HTML5.
CanvasMol
En vetenskaplig applikation som är byggd för att hjälpa dig att förstå en viss jordelements struktur.
Tecknad filmbyggare
Rita intressant tecknad bild med denna minimala och interaktiva tecknad filmbyggare.
Dra allt hit
Dra allt du kan dra i demo för att visa detaljer.
Gartisk skiss
En original HTML5-applikation som låter dig göra några grundläggande ritningar som kan sparas i olika bildformat som jpeg eller png.
PhysicalSketch
Rita vad du vill och se hur de reagerar med simulerad gravitation.
skiss
En kraftfull HTML5-ritapplikation som gör att du kan rita och redigera din bild på exakt sätt.
Småprat
En webbapplikation som bekräftar den geografiska positionen för väderrelaterat meddelande som förvärvats från Twitter och därmed bildar dem till en dukbaserad 'social väderkarta', ganska trivial (som författaren säger) men intressant.
Spel
3Borrad
Du skulle aldrig bli uttråkad om du kan fortsätta att undvika hundratals HTML5-kulor under nästa sekund.
Bryta ut
Slå tillbaka bollen för att bryta alla tegelstenar.
duklandskap
Inte riktigt ett spel, men det visar hur HTML5 kan användas för att utveckla webbläsarspel First Person Shooting.
Fånga den
Hur många bollar kan du undvika för att få ditt vinnande HTML5-kvadrat?
Chain Reaction
Kedja explosionen för att uppnå målet, bli inte beroende.
kub ut
Spela Tetris i 3D, uppifrån och ner.
etchaFysics
Rita objekt för att flytta bollen till stjärnan, glöm inte allvaret.
Jigsaw Puzzle
Klicka, rotera och släpp pusselbitar för att lösa detta HTML5-baserade pussel.
Slide Puzzle
Skjut till segern, ett annat HTML5-spel som är byggt för att pressa din hjärnsaft.
Samma spel
Ta bort vissa grupper för att få en annan grupp i samma färg och så småningom tilldelas du en seger.
Tetris
Ett av de mest klassiska spel som återupplivats av HTML5.
Torus
Ännu ett Tetris-spel i pseudo-3D-version.
TETRIS GÅR INTE, JAG SÄTT TVÅ STYCKAR OCH STÅND, MEN RESTEN ÄR MYCKET KYLA CHAVALES
Jag älskar den här sidan ... förutom det första spelet. Jag älskar dig Fran =)
Hej en kyss till världen toooodooooooo
Otroligt, spektakulärt. Jag kan inte tro hur långt webbutveckling har kommit!
Jag vet inte varför dessa resurser tillskrivs HTML5, det här är rent Javascript, innan Flash uppstod, med Javascript kunde du göra alla dessa saker, det fanns en studie i Barcelona som gjorde några webbplatser som vid den tiden slog mig, allt i javascript så mycket att jag lärde mig av dem och designade ett par med studsande bollar och allt, jag tappade dem helt och jag ångrar det fortfarande. Jag kommer inte ihåg namnet på studion, det var något som du2 eller 2you2 som var '98 eller så.
Joe Vega ... det visar att du inte har någon jävla idé om HTML5 ... .lol
Du kanske inte har någon blodig html5-idé, det är sant, men du förväxlar tupp med kycklinghuset och skiljer inte ett språk från en miljö. Jag utmanar dig att göra ett exempel som de här utan att använda Javascript, bara med html5, och du kommer att förstå vad jag menade i inlägget som jag raderade. Dessutom har jag tittat på källkoden för exemplen och det finns flera som enkelt kan göras utan att montera den över html5.
Att html5 ger många förbättringar och saker som underlättar mycket är sant, men lagren av det fantastiska som visas på denna sida är Javascript.
Jag är intresserad av att göra presentationer av denna typ ... har du en handledning eller sida med resurser ??? Tack!!!