SRCSET tagı ekleyerek oluşturduğunuz resimler, sitenizi fiziksel manada responsive hale getirecektir. srcset tarayıcılara birden fazla ölçüde resim seçeneği sunmamızı sağlıyor. Ekran çözünürlüğüne göre eklediğimiz resimlerden en uygun olan ölçüdeki resmi kullanıyor.
1. Kullanım Şekli (İstediğiniz sayı ve ebatta resim kullanabilirsiniz.)
< img src="/resmim.jpg" srcset="/resmim-360.jpg 360w, /resmim-480.jpg 480w, /resmim-760.jpg 760w, /resmim-1000.jpg 1000w" alt="Resim İçeriği"/ >
2. Kullanım Şekli (Bu yöntem ile orjinal resmi küçük kullanıp diğerlerini 2 katı, 3 katı şeklinde kullanırız)
< img src="/resmim80px.jpg" srcset="/resmim160px.jpg 2x, /resmim240px.jpg 3x, /resmim320px.jpg 4x, /resmim800px.jpg 10x" alt="Resim İçeriği"/ >
Ben 2. yöntemi tercih ediyorum.