Prendo questo post per risolvere una domanda che hai posto di recente nei commenti di un articolo:
Quando è un buon momento per iniziare a progettare completamente con HTML5?
Bene, onestamente, dipende dal target a cui ti rivolgi. Se non prevedi che i tuoi visitatori utilizzino Internet Explorer (es: pagina del software Mac), inizia subito con HTML5, ma se hai bisogno di persone con IE per vedere il tuo sito web, faresti meglio ad aspettare ...
All'ingresso, ben dopo il salto, 48 demo di HTML5 che sono sorprendenti e meritano di essere viste. Grande è piccolo.
Fonte | Hong Kiat
aAnimazione audioburst
Un'animazione comoda e fantastica creata con il canvas e il tag audio di HTML5.
Piscina di palline
Presentata nell'ultimo evento I / O di Google, questa demo mostra quanto può essere dinamico HTML5.
salata blob
Una creatura generata da HTML5 che ti piacerebbe.
bomomo
Con Bomomo puoi osservare diversi movimenti atomici simulati con HTML5.
Sfera del browser
Lasciati stupire con questa sfera HTML5 "cross-browser".
Bubbles
Divertiti creando infinite bolle galleggianti con colori diversi.
Animazione di cartoni animati su tela
Un fumetto HTML5 semplice e divertente che ti aiuta a capire cosa può fare l'elemento canvas di HTML5.
coolclock
Un bell'orologio analogico personalizzabile costruito da HTML5 e JavaScript.
Presentazione di Flickr PS3
Visualizza le foto di Flickr con la presentazione in stile PS3 nel browser web.
Polaroid interattiva
Una demo interattiva che funziona in modo abbastanza simile all'interfaccia multi touch.
Fuochi d'artificio JS
Goditi il momento dei fuochi d'artificio con la gravità e la velocità che preferisci, grazie a HTML5 e Javascript.
Kaleidoscope
Un caleidoscopio HTML5 molto bello e futuristico.
Particelle liquide
Animazione di particelle sensibili che reagisce in base al movimento del mouse.
Ipnotizzatore
Un'altra demo HTML5 sensibile ed eccezionale che mostra come gli elementi vicini reagiscono al movimento del mouse.
Nebulosa Cloud
Perditi con questa meravigliosa nebulosa HTML5.
Parallasse
Visualizza tutte le forme 2D in prospettiva parallela.
Animazione delle particelle
Un'elegante animazione di particelle HTML5 che può formarsi nel tuo messaggio preferito.
Spread
Perditi con questa animazione a diffusione infinita.
Starfield
Un'animazione starfield HTML5 molto interessante che cambierebbe direzione e velocità in base al movimento del mouse.
Distruzione video
Un clic per eseguire il boom di un video in riproduzione.
Waveform
Nota come l'onda della tela di HTML5 si sposta alterando la sua ampiezza, lunghezza d'onda, larghezza, ecc.
3D Effetto
Impressionato dall'animazione su tela? Questo è molto di più che l'elemento canvas di HTML5 può fare e si chiama effetto 3D. Lo sviluppatore può fare affidamento su elementi canvas, DOM e JavaScript per creare effetti 3D, che possono essere successivamente sviluppati in animazioni 3D o giochi.
Canvas3D e Flickr
Vivi un'esperienza 3D completamente nuova con il flusso di foto di Flickr.
Simulazione di stoffa
Una simulazione realistica del tessuto basata su HTML5.
Mostro in evoluzione
Osserva un mostro che si evolve in una creatura complicata, uno dei suoi creatori è HTML5.
Giftbox di Google
Il gigantesco motore di ricerca Google è presentato in 3D, vista riproducibile.
JSTouch
Una vetrina realistica e di alta qualità "3D su tela 2D".
Presentazione dei dati
Sebbene l'elemento canvas di HTML5 possa essere utilizzato per creare animazioni ed effetti 3D, può anche essere implementato per presentare dati matematici.
gnuplot
Gnuplot, un'applicazione per il tracciamento dei dati nella versione HTML5.
RGraph
RGraph fornisce un'ampia gamma di presentazioni di dati come grafico a barre, barra di avanzamento e grafico radar tradizionale.
Applicazione web
Infine, utilizzando tutte le possibilità combinate da HTML5 e altri linguaggi, è possibile creare un'applicazione o un gioco interattivo vicino all'applicazione Flash.
TelaPaint
Guarda il fratello di Microsoft Paint che entra nel tuo browser web e suo padre è HTML5.
TelaMol
Un'applicazione scientifica creata per aiutarti a comprendere la struttura di determinati elementi della terra.
Generatore di cartoni animati
Disegna un'immagine del fumetto interessante con questo generatore di cartoni animati minimale e interattivo.
Trascina qualsiasi cosa qui
Trascina tutto ciò che puoi trascinare nella demo per mostrare i dettagli.
Schizzo di Gartic
Un'originale applicazione HTML5 che ti permette di realizzare alcuni disegni di base che possono essere salvati in diversi formati di immagine come jpeg o png.
FisicaSchizzo
Disegna quello che vuoi e guarda come reagiscono con la gravità simulata.
album per schizzi
Una potente applicazione di disegno HTML5 che ti consente di disegnare e modificare la tua immagine in modo preciso.
Smalltalk
Un'applicazione web che conferma la posizione geografica dei messaggi meteorologici acquisiti da Twitter, formandoli così in una mappa 'meteo sociale' su tela, abbastanza banale (come affermato dall'autore) ma interessante.
Gioco
3 Annoiato
Non ti annoierai mai se riesci a evitare centinaia di proiettili HTML5 nel secondo successivo.
Scoppiare
Rimbalza la palla per rompere tutti i mattoni.
Canvasscape
Non proprio un gioco, ma dimostra come HTML5 possa essere utilizzato per sviluppare il browser game di sparatorie in prima persona.
Prenderla
Quante palline riesci a schivare per ottenere il tuo quadrato HTML5 vincente?
Reazione a catena
Concatena l'esplosione per raggiungere l'obiettivo, non diventare dipendente.
Cubo
Gioca a Tetris in 3D, vista dall'alto verso il basso.
etchFisica
Disegna l'oggetto per spostare la palla sulla stella, non dimenticare la gravità.
Gioco di pazienza
Fai clic, ruota e rilascia i pezzi del puzzle per risolvere questo puzzle basato su HTML5.
slide Puzzle
Scivola verso la vittoria, un altro gioco HTML5 creato per spremere la tua mente.
Stesso gioco
Rimuovi un determinato gruppo per abbinare un altro gruppo dello stesso colore e alla fine ti verrà assegnata una vittoria.
Tetris
Uno dei giochi più classici riportati in vita da HTML5.
Torus
Ancora un altro gioco di Tetris in versione pseudo-3D.
IL TETRIS NON VA, METTO DUE PEZZI E STA IN PIEDI MA IL RESTO È MOLTO FREDDO CHAVALES
Amo questa pagina ... tranne il primo gioco. Ti amo Fran =)
Ciao un bacio anche al mondo
Incredibile, spettacolare. Non riesco a credere a quanto sia arrivato lo sviluppo web!
Non so perché queste risorse siano attribuite a HTML5, questo è puro Javascript, prima dell'avvento di Flash, con Javascript si potevano fare tutte queste cose, c'era uno studio a Barcellona che ha realizzato alcuni siti che all'epoca mi hanno fatto saltare la testa tutto in javascript così tanto che ho imparato da loro e ho progettato un paio con palle che rimbalzano e tutto il resto, le ho completamente perse e ancora me ne pento. Non ricordo il nome dello studio, era qualcosa come you2 o 2you2 che era nel 98 o giù di lì.
Joe Vega …… mostra che non hai idea di HTML5… .lol
Potreste non avere una maledetta idea di HTML5, è vero, ma voi ragazzi scambiate il gallo per il pollaio e non differenziate una lingua da un ambiente. Ti sfido a fare un esempio come quelli qui senza usare Javascript, solo con html5, e capirai cosa intendevo nel post che ho cancellato. Inoltre, ho esaminato il codice sorgente degli esempi e ce ne sono diversi che possono essere facilmente eseguiti senza doverlo montare su html5.
Che html5 apporti molti miglioramenti e cose che facilitano molto è vero, ma gli allori della cosa fantastica che viene mostrata in questa pagina è Javascript.
Mi interessa fare presentazioni di questo tipo ... hai un tutorial o una pagina con le risorse ??? Grazie!!!