Sembra che il problema maggiore nell’approccio responsive sia gestire le immagini e il loro peso. Soprattutto nei moderni design diamo molto spazio ad immagini grandi e con buona risoluzione. Questo ovviamente è un problema quando le nostre pagine web vengono visualizzate in modalità responive su un device mobile con connessione 3G.
Ci sono vari metodi per servire immagini con risoluzione e peso inferiori rispetto alla versione originale per desktop ma ancora nessuna risolve il problema in modo definitivo anche perchè alcune richiedeno codice server side, quindi non di immediato approccio.
Una tecnica che mi ha fatto molto riflettere però è stata quella che prevee di gestire le immagini tramite Css. E non parlo solo di dimensioni e posizionamento, ma anche di sorgente.
Nell’articolo seguente http://mobile.smashingmagazine.com/2013/07/22/simple-responsive-images-with-css-backgrounds/ vengono illustrate delle ottime tecniche per indicare via css quale immagine caricare in base alle media-query. La tecnica funziona, ma ha un problema fondamentale: le immagini vengono eliminate dal contenuto (quindi dal markup) ed inserite via css quindi lato presentation.
Nell’articolo si fà proprio riferimento a questo limite e si parla di come per anni la comunità web abbia lottato per dividere contenuto da presentazione.
La discussione è corretta, ma mi chiedo (stimolato da questo articolo): quando le immagini sono davvero un contenuto e quando possiamo considerarle pura presentazione?
Immagino che per un portfolio di un fotografo o per un ecommerce le immagini siano fondamentali e devono essere inserite nel flusso del markup quindi visualizzate anche senza Css. Ma per un sito corporate molte volte inseriamo delle immagini (in header o nel corpo testo) per dare dinamismo alle pagine e renderle meno statiche e monotone.
Allora perchè questo tipo di immagini non considerle alla stessa stregua di un’icona o un background di pagina? Quindi perchè non considerarle solamente presentation?