Come pubblicheremo immagini sul web tra 5 anni…
Giovedì 23 Aprile 2009 - 08:18
di Cesare Lamanna
Il titolo non è mio. L’ho preso dalla pagina in cui Daniel Gasienica presenta Inline Multiscale Image Replacement, un concept e al tempo stesso una tecnica che intendono dare risposta ad un problema ben preciso: la pubblicazione di immagini ad alta risoluzione sui siti web. Dal momento che per la loro natura (peso e dimensioni) sono oggi confinate a visualizzazioni fuori dal contesto (lo schema “clicca e ingrandisci in una nuova finestra”, per intenderci), c’è un modo per inglobarle in modo più efficace e proficuo per tutti?
Per quanto riguarda le tecnologie adottate, la soluzione è fondata su un mix di Python, Flash e Javascript (jQuery); prevede poi meccanismi di graceful degradation per quanti non potessero contare sul player di Adobe e/o sul supporto di Javascript.
Per i dettagli, compresi certi problemi di compatibilità o il fatto che il codice HTML necessario all’implementazione fa saltare la validazione, vi rimando all’articolo. È anche possibile scaricare il codice sorgente (tutto è rilasciato con licenza GPLv3).
Il nostro ha preparato ovviamente una dimostrazione. Ha preso tra l’altro questa pagina del New York Times e l’ha rifatta implementando la sua soluzione per l’immagine principale collegata all’articolo. Ecco la demo. Provate a cliccare sull’immagine, con il tasto sinistro e con il destro per verificare le funzionalità offerte. Che ve ne pare?
Categoria: Web Design | Permalink
Commenti
1
molto interessante!!!
…e secondo me non dovremo aspettare 5 anni prima di vedere la diffusione di tale sistema.
Penso che una volta risolte alcune questioni (ad es. la validazione del codice), sarà sicuramente un sistema valido per pubblicare le immagini ad alta risoluzione.
2
Bell’esempio ma sono un po’ stupito che non si sia usato canvas…
# - postato da Mauro Accornero - 23 Aprile 2009 - 09:21
3
Mooooooooolto bello!
# - postato da Daniele - 23 Aprile 2009 - 09:57
4
Se non erro, la stessa cosa si può ottenere con Silverlight + DeepZoom!
# - postato da MarcelloP - 23 Aprile 2009 - 10:14
5
L’esempio è molto bello da vedere, ma molto lento e
a livello di accessibilità, usabilità e seo mi sembra poco performante.Fra 5 anni di sicuro non sarà quella la soluzione adottata generalmente, far passare tutte le immagini del web da flash? pazzia
6
davvero una soluzione molto molto molto interessante. ottimo! potrei pensare di utilizzare il metodo in qulcuno dei mei lavori.
# - postato da Davide Espertini - 23 Aprile 2009 - 11:44
7
Mah … è più che altro un primo esperimento (o uno dei primi) sulla navigazione all’interno di immagini HQ ma non ha molta utilità pratica nel mondo reale a parte limitati contesti (portfolio di fotografi professionisti? … o meglio webapps dedicate)
Perchè dovrei far scaricare all’utente un’immagine da centinaia di KB (o anche MB) se, come nella maggior parte dei casi avviene, non è assolutamente interessato a vederle?
Tralasciando ovviamente gli attuali limiti delle tecnologie usate
8
Hello,
Thank you all for the vivid discussion and sorry for my answer being in English. I’d like to bring forward some clarifications:
Flash is really just a means to an end. If we’ll actually really view high-resolution images something like this in 5 years, I do hope that this functionality does not come from Flash, neither from Silverlight nor from JavaScript/Canvas but rather is directly built-in into the browser given suitable multiscale image formats. For those who are surprised this is was not done in canvas, there already is a great implementation from Microsoft based on JavaScript/canvas called Seadragon AJAX. As soon as the licensing is more clear, I will consider using it for my replacement technique.
As for SEO, accessibility & usability: I kindly ask you to join the discussion on what/how things could be improved instead of simply stating that it doesn’t work. As already mentioned, this is a first iteration of hopefully more to come.
You do not have to download a single byte more than is actually needed to display the image you’re actually looking at. If you do not zoom, you do not have to wait. This is a great misconception that goes around. Please read my Inside Deep Zoom series to understand what multiscale imaging is all about.Once again, thanks for the discussion. I strongly urge you to participate with your doubts/questions/criticism in a meaningful discussion instead of letting your ideas and concerns languish in the depths of the internet.
Cheers,
Daniel# - postato da Daniel Gasienica - 23 Aprile 2009 - 13:21
9
L’effetto è buono ma simili esempi si sono visti anche senza l’utilizzo di Flash.
Tra 5 anni i html + css + javascript permetteranno animazioni paragonabili al flash almeno per quanto riguarda le transizioni quindi non vedo il motivo di legarsi ad una tecnologia proprietaria.
10
@engelium
Il problema del peso dell’immagine HQ si può risolvere bene in questo modo:
1) Si preparano immagini a diverse risoluzioni
2) Si carica di default l’immagine a risoluzione bassa
3) Quando si clicca sull’immagine e parte lo zoom si ingrandisce l’immagine corrente che apparirà un po’ sgranata e ci si carica sopra quella ad alta risoluzione e così via per gli step successivi
4) Come bonus si potrebbe segmentare le immagini a risoluzioni più alte è caricare solo le parti visibili in stile Google MapsA parte il punto 4, mi pare che gli altri siano già implementati nella demo, quindi se uno non clicca sulla foto scarica semplicemente l’immagine a risoluzione base esattamente come accade oggi
# - postato da Riot - 23 Aprile 2009 - 14:16
11
L’obiettivo mi sembra analogo a quello di FlashPix (http://en.wikipedia.org/wiki/FlashPix), un formato multi-risoluzione nato una quindicina di anni fa.
Ho avuto modo di farci qualche esperimento all’epoca per un progetto multimediale, ma poi non ne ho più sentito parlare…
12
Molto molto interessante … un’implentazione con Mootools o Jquery sarebbe il top
13
Molto interessante! a mio parere è ancora un pò da migliorarne l’accessibilità e l’utilizzo, ma senz’altro è una strada su cui si può lavorare.
14
Mi sembra una soluzione estremamente interessante, e anche l’uso di flash non mi sembra poi un dramma visto che ormai la maggior parte dei siti “moderni” lo usa anche per visualizzare il testo (vedi sifr).
Come dice Daniel, sarei curiosa di sapere da Michele quali sono i problemi in termini di accessibilità, usabilità e seo. Per quanto riguarda l’accessibilità e il seo, credo che mettere sempre una didascalia all’immagine risolva il 90% dei problemi. Per quanto riguarda l’usabilità, si può semplicemente prevedere di mettere come sfondo al div la stessa immagine, in questo modo anche chi non ha il flash player vedrà comunque qualcosa.
15
Assolutamente fighissimo!
Oltremodo credo che sia una modalità estremamente intelligente per rendere interattive e, passatemi il termine, “partecipative” le immagini che, di per se, sono sempre state un elemento essenziale ma poco dinamico del web.
Avremo di che divertirci.
Complimenti per la segnalazione, Cesare!