Supporto volontario e collaborativo per Joomla!® in italiano

Un nuovo modo di visualizzare le immagini con la Ozio Gallery

Valutazione attuale: 5 / 5

Stella attivaStella attivaStella attivaStella attivaStella attiva
 
FotoHa fatto il debutto da poche settimane la nuova Skin Nano all'interno dell'estensione Ozio Gallery.
Sono quindi disponibili due modelli differenti per visualizzare le foto, entrambi con le proprie caratteristiche e punti forti.

Creazione nuova voce di menuLa Skin Fuerte, oramai abbastanza nota, mostra le immagini attraverso una elegante "maschera" dove scorrono lateralmente sia le miniature che le anteprime selezionate.

Per la Skin Nano si è tornati ad una concezione più classica dove l'apertura della galleria è dedicata all'elenco delle miniature. Differenti animazioni permettono poi al passaggio del mouse di accompagnare l'apertura dell'immagine in stile "lightbox". Questo metodo permette una facile integrazione in ogni tipo di sito e template. La galleria si auto centra all'interno dello spazio a disposizione, mostra le immagini grandi sfruttando tutta l'area della finestra del browser, permettendo una facile visione anche delle verticali.

Qui a fine articolo è già visibile una anteprima (con immagini da Fuerteventura).



Tag OzioOgni immagine può avere la propria descrizione che viene visualizzata correttamente anche se molto ampia.  Riproposta anche la finestra con le informazioni aggiuntive per ogni immagine: è presente un tastino (evidenziato dalla freccia rossa nell'immagine qui a fianco) che apre un box informativo dove sono elencati molti dati letti dal file della foto ed inoltre, se disponibile, anche la posizione geolocalizzata sulla mappa.

L'impaginazione e l'allineamento delle miniature può avvenire in differenti modalità. Quella mostrata in questo articolo permette una fantastica integrazione delle immagini in formato verticale con quelle in formato orizzontale formando un quadro d'insieme dove si fondono e si incastrano perfettamente ed automaticamente. Da notare anche il caricamento dinamico delle miniature (di cui è possibile impostare la dimensione desiderata) che avviene solo allo scorrere verso il basso della pagina, evitando così di caricare le immagini anche se poi non vengono visualizzate. Supportata inoltre pure la più classica modalità con la paginazione.

AdaptiveQualcuno probabilmente aspetterà di sapere se anche questa Skin utilizza le sole immagini caricate su G+ oppure anche quelle presenti nelle cartelle del server.....  ebbene sarete felici di sapere che....  non utilizza le immagini presenti sul server del sito. Alcuni dei motivi secondari che ci hanno convinto dell'utilizzo di G+ sono lo spazio illimitato per ospitare tutte le nostre immagini in alta risoluzione; la possibilità di caricare direttamente i file originali e modificarli comodamente dall'interfaccia con il browser Chrome, per correggere la luminosità, il contrasto, ruotarle, inserire scritte ecc...; comodo inserimento della descrizione ad ogni immagine e l'associazione alla posizione geografica.
Ora provo però a spiegarvi il motivo principale: permette alla galleria sul nostro sito di essere completamente Responsive e Adaptive.
Oramai il concetto di "responsive" è più o meno chiaro a tutti, avere sul proprio sito una galleria fotografica non responsive ad oggi è un punto a sfavore. Da ogni device e ad ogni risoluzione si deve poter apprezzare l'esperienza di navigazione delle immagini presenti nella galleria. Ma c'è responsive e Responsive :)
Questo concetto ho provato a spiegarlo più volte ma non sono mai riuscito a descriverlo in modo semplice e comprensivo. Molte sono le estensioni per Joomla che permettono di realizzare gallerie fotografiche responsive, poche quelle che lo fanno bene e pochissime quelle che lo fanno molto bene risultando Adaptive oltre che Responsive.
Google Plus mette a disposizione in tempo reale ben 2000 versioni per ogni immagine in alta risoluzione che è stata caricata. Della stessa immagine possiamo così richiedere il formato che desideriamo, piexl per pixel.

Proviamo con un esempio pratico. Sotto sono visualizzate 3 immagini apparentemente identiche della stessa foto del Convento di Betancuria (Fuerteventura).
Supponiamo che da un certo device il "navigatore" del nostro sito abbia aperto la nostra galleria per visualizzare le immagini con uno spazio a disposizione sul proprio browser di 526px (perchè non è la risoluzione del device da prendere erroneamente in considerazione, ma lo spazio a disposizione dal browser che mostrerà le immagini, è all'interno del browser che si apre la lightbox).

  Esempio A - "Barbatrucco forzato." (pessima galleria)
601,88 kB
2000px × 1333px (ridimensionata per finta a 526px × 350px) 
     
    Esempio B - "...almeno ci provo." (solo poche gallerie)
99,33 kB
640px × 426px (ridimensionata per finta a 526px × 350px) 
     
  Esempio C - "precisione al pixel." (Ozio Gallery)
71,18 kB
526px × 350px  effettivi!

L'esempio A è quello più comune fra le varie gallerie "responsive", viene passato l'unico file a disposizione dell'immagine, quello caricato sul server dal webmaster che per coprire un poco tutte le varie possibili risoluzioni ha giustamente inserito una immagine da 2000px × 1333px. Così ci ritroviamo in uno spazio disponibile da 526px una immagine gigante interpolata per rientrare forzatamente in quell'area. Il peso è notevole, più di 600Kb magari visualizzata da un tablet o da uno smartphone può risultare pesante ed il passaggio fra tutte le immagini di questo peso potrebbe non rendere al meglio.

L'esempio B è quello proposto da alcune gallerie che provano a ricreare sul server del sito un ventaglio di possibili varianti dell'immagine. Ridimensionando fisicamente il file in varie fasce di risoluzione che solitamente sono queste: 100,240,320,500,640,800,1024,2000 pixel.
Ci ritroveremo quindi sul server le copie per ogni immagine a queste risoluzioni base. Ma il valore 526 che abbiamo preso di esempio non è ovviamente presente in questo elenco e viene così inviato al browser del nostro navigatore il file che più si avvicina senza degradarne troppo la visualizzazione.

L'esempio C è quello proposto da pochissime gallerie che si possono permettere di inviare al browser del navigatore il file ridimensionato fisicamente alle dimensioni esatte dello spazio a disposizione. Ottimizzando così al massimo il tempo di caricamento, la banda utilizzata, la qualità dell'immagine mostrata ecc..
Se poi il navigatore dispettoso amplia la finestra del browser, perchè vede delle belle immagini e vuole una migliore esperienza, portando lo spazio a disposizione a 1067 o a 1233 o a qualsiasi altro valore la Ozio Gallery gli mostrerà la foto seguente o la precedente ridimensionata perfettamente al nuovo spazio a disposizione.

Capite che sarebbe impensabile riprodurre sul proprio server 2000 file per ogni immagine presente nelle gallerie, una per ogni singolo formato in pixel che potrebbe essere richiamato. Ecco il motivo principale che ci ha fatto scegliere di appoggiarci a Google Plus, l'unica piattaforma gratuita ad offrire un servizio di tale livello.
Provate a giocare un poco con la galleria presente in questa pagina, stringete un poco la finestra del vostro browser, selezionate una immagine che viene aperta nella lightbox. Verificate con il tasto destro sull'immagine che dimensioni e che peso ha l'immagine. Poi tornate ad allargare o restringere ancora la finestra aggiornate la pagina (tasto F5) e tornate a verificare le informazioni sull'immagine. Le dimensioni variano a seconda delle dimensioni della finestra. Questo vuol dire essere veramente Responsive ed Adaptive.

Interfaccia Google PhotoUn secondo appunto che viene mosso contro l'utilizzo di Google Plus per la Ozio Gallery riguarda la possibilità di far caricare direttamente le immagini al cliente del sito. Niente di più semplice, è necessario aggiungere l'account Google del cliente come "Gestore" o "Amministratore delle comunicazioni" della relativa pagina di G+ dove sono presenti gli album del sito ed il gioco è fatto. Il cliente non si dovrà loggare sul sito e capire come caricare file magari dovendoli anche preparare prima ridimensionandoli ecc...  ma gli basterà aggiungere un nuovo file originale all'album su G+ (che ha una interfaccia semplice e tutta in italiano) e la foto sarà già disponibile alla giusta risoluzione dalla galleria del sito.
Inoltre questa nuova Skin Nano permette la visualizzazione diretta di tutti gli album presenti sulla pagina G+, quindi il cliente può anche creare autonomamente nuovi album e questi saranno visibili in tempo reale sul sito. Può scattare ed inviare le foto direttamente dal proprio smartphone, inserire la descrizione all'album ed alle foto, tornare a modificarle, eliminarle, ordinarle ecc...  tutto in autonomia senza passare dalla gestione del sito Joomla con tutte le complicazioni che comporta per un non addetto ai lavori....

Non voglio convincervi ad utilizzare la Ozio Gallery sui vostri siti Joomla, voglio solo provare a farvi capire come funziona ed i motivi che ci hanno portato nel tempo a cambiare tipologia di galleria.

CreditiLa Skin Nano utilizza il JavaScript della nanoGALLERY sviluppata dal francese Christophe Brisbois. Un nuovo progetto open source che abbiamo visto nascere ed al quale abbiamo partecipato attivamente e continuiamo a supportare. Christophe ci ha ovviamente dato il consenso all'utilizzo del JavaScript per la Ozio Gallery e pubblicamente ci ha ringraziato anche in un recente commit sul GitHub del suo progetto.

Attenzione: questa nuova Skin Nano è presente solo nella versione 4.x della Ozio Gallery dedicata a Joomla 3


Vi invito a scaricare e provare tutte le varie possibilità offerte dalla Ozio Gallery. smile


Ozio Gallery è nata nel 2008, è sviluppata dal team di Joomla.it ed attualmente è all'4° posto nella classifica delle estensioni per Joomla più popolari della JED. Oltre ad essere anche gratuita è completamente open source e GPL, se questa galleria ti sembra interessante o ti ha aiutato nella realizzazione di un sito, metti un commento e dai un buon voto alla scheda della Ozio Gallery. Il link sotto la galleria nella versione gratuita è diretto a Joomla.it, quindi a supporto di questa fantastica community.

Versione commerciale Versione commercialeAl fine di accontentare coloro che desiderano utilizzare questa estensione a livello professionale, abbiamo deciso di distribuire anche la versione commerciale, il costo è puramente simbolico. Chi acquista può usufruire del supporto (in lingua italiana e inglese) e nella versione commerciale non è presente la firma con link sotto la galleria.
Le istruzioni su come ottenere la versione commerciale sono presenti nella pagina del componente una volta installato nel proprio sito in Joomla.

CommentaCommenta questo articolo sul forum


ozio_gallery_nano




Ultima versione di Joomla!®

downloadVer. 3.8.1 Stabile Italiana
Data di rilascio: 04 Ottobre 2017
(leggi la notizia Demo online

Le migliori estensioni gratuite

Un elenco aggiornato con i link a più di 100 estensioni fra componenti, moduli e plugin gratuiti per Joomla! 3

Manuale in italiano

Manuale in italianoPer conoscere meglio Joomla!, le sue caratteristiche ed il metodo di utilizzo leggi il manuale tradotto in italiano.

Molto utili anche le risposte alle domande più frequenti: FAQ

Sicurezza del proprio sito Joomla!Leggi anche: Nozioni sulla sicurezza del proprio sito

Autori di articoli recenti

Invia un articolo!Scrivi un articolo su Joomla.it e ricevi i ricavi dalle pubblicità di Google Adsense!
Segui queste istruzioni, condividi e collabora con la community. L'elenco degli autori attivi sul sito.

Libri consigliati

Torna su

Joomla.it sui Social Network

JoomlaDay Italia

JoomlaDay

Newsletter

Inserisci qui la tua e.mail: