Il responsive design, come abbiamo avuto modo di puntualizzare anche di recente, è un aspetto fondamentale delle attuali tecniche di web design e serve a garantire una corretta visualizzazione su tutti i tipi di dispositivo per la navigazione in Rete (deskop pc, tablet, smartphone, smartTV, smartWatch, ecc.). Anche le foto e le immagini pubblicate online devono rispondere a questo tipo di esigenza: in tal senso non è affatto semplice realizzare una galleria di immagini responsive capaci di adattarsi a qualsiasi tipologia di schermo. In questo post cerchiamo dunque di capire in che modo è possibile ottenere gallery di questo tipo.
7 suggerimenti per realizzare slideshow di immagini responsive
Per quel che riguarda le slideshow vi consigliamo innanzitutto di nascondere gli elementi di navigazione (come ad esempio le classiche frecce a destra e a sinistra) che potrebbero entrare in conflitto con il contenuto, le immagini appunto. Su smartphone e tablet tali elementi non sono indispensabili (c’è il touchscreen), mentre per i desktop pc è sufficiente implementare la funzione di mouse hover per farli apparire quando servono.
- Se state cercando di realizzare una galleria di immagini responsive con foto ritratto e vi trovate in difficoltà, sappiate che questo è abbastanza normale in quanto la visualizzazione per questo tipo di immagini non sempre risulta ottimale sui dispositivi mobile.
- Su desktop pc la modalità lightbox consente di ottenere una visuale dettagliata della foto selezionata. Sui dispositivi mobile questa opzione oltre ad essere totalmente inutile, può anche creare dei problemi di compatibilità ed è quindi preferibile disabilitarla.
- Per realizzare una galleria di immagini responsive abbastanza corposa può essere utile implementare alcuni elementi aggiuntivi per la navigazione in modo da permettere all’utente di selezionare direttamente l’immagine desiderata senza dover per forza “scorrere” tutta la gallery.
- È preferibile non includere video all’interno di una slideshow di immagini responsive in quanto potrebbero causare seri problemi di visualizzazione sui dispositivi mobile. Cercate dunque di tenere sempre separati i due tipi di contenuto.
- Fate attenzione inoltre alla dimensione e alla risoluzione delle immagini: assicuratevi che queste non siano troppo piccole e di scarsa qualità in quanto potreste incontrare seri problemi di visualizzazione sugli schermi più grandi (le classiche immagini “pixelate”).
- Evitate infine di includere didascalie o altri tipi di contenuti testuali che possono destabilizzare la vostra gallery: i testi infatti dovranno anch’essi adattarsi alle dimensioni dello schermo creando non pochi problemi. Una variabile in più di cui è preferibile dare a meno.
