Velike in “težke” slike so glaven krivec, da so naše odzivne spletne strani prevelike. To težavo pa lahko z najnovejšimi HTML elemeti, kot sta <picture> in srcset/sizes odpravimo. Video z naslovom “Responsive Images using <picture> and srcset/sizes” nam na kratko predstavi uporabe obeh metod.
Najnovejši HTML elementi, kot sta in srcset/sizes nam omogočajo, da uporabnikom ponudimo “pravo” sliko, ki je optimizirana tako po velikosti, kot po vsebinski strani. Tak način uporabe oz. prikazovanja slik pa je pri izdelavi odzivnih spletnih strani in vsebinski strategiji idealen. Slaba stran priprave je le ta, da potrebujemo več slik.
Podpora novima elementoma za prikazovanje slik je precej različna, medtem, ko srcset/sizes podpirajo vsi brskalniki razen IE brskalniki je slika pri elementu <picture> precej slabša, trenutno ga podpirajo le Opera in razvojne verzije Firefoxa in Chroma. Zaradi tega je v tem primeru potrebno uporabiti Javasript polyfill – Picturefill. http://scottjehl.github.io/picturefill/
Z uporabo HTML elementov <picture> in srcset/sizes bodo naše vsebine bolj prilagojene napravam in samim postavitvam strani, naše odzivne spletne strani pa bodo tako postale vitke in hitrejše.