Web site tasarımı yaparken dikkat edilecek temel kriterlerden birisi şık ve estetik bir görünümün yanında iyi bir performansa sahip olmasıdır. Bunun için de sitede ki görüntülerin optimizasyonunun iyi sağlanması gerekmektedir.Bu sayede daha estetik görünümler daha performanslı bir şekilde olacaktır. Css , javascript gibi öğelerin kullanımı ile beraber bu süreç daha iyi bir şekilde ilerleyecektir.
Svg vektör görünümler bir Xml işaretleme dili olmaktadır. Bu yapı ile beraber daha performanslı bir görüntü seçeneğine ulaşılacaktır. Bu sayede sayfa yapısı daha estetik bir hale getirilebilir. Bu yapıyı kullanmak için tercih edilebilecek en iyi platformlardan birisi Adobe Illustrator olmaktadır. Bu platformun vektörel çizimleri ile vektörel grafikler oluşturulabilir. Bu vektörle iki boyutlu olarak tasarlanmaktadır.
Grafiksel öğeler boyut olarak yüksek boyutlara sahip olmaktadırlar. Bu grafiklerin web sitesin de aşırı kullanmaları da performansı olumsuz yönde etkileyecektir. İnternet hızı yavaş olan kullanıcılar bu grafiksel öğeleri web sayfasında görüntülemeye çalışırken yavaş bir yapı ile karşılaşacaklardır. Buda kullanıcılar hiç sevmedikleri yapılardan biri olmaktadır. Aşırı grafiksel öğe kullanımı web sayfasında donmalara ve kasmalara neden olabilir. Bu da web sayfasının performanssız çalışması demektir. Svg grafikler ile buna bir çözüm getirilmiştir. Svg öğeleri grafiklerin sıkıştırılarak daha küçük bir boyuta getirilmesini ifade eder. Bu sayede grafiksel öğeler daha verimli ve daha hızlı çalışır bir hale gelmektedir.
Web sayfası tasarımı yapılırken sayfaya ait grafiklerin tüm tarayıcılar ile uyumlu bir şekilde çalışması çok büyük bir önem teşkil edecektir. Svg yapılarında böyle bir sorun oluşmayacaktır. Svg grafikler her tarayıcı ile uyumlu olarak sorunsuz bir şekilde çalışmaktadır. Bu sayede her grafiksel öğe tarayıcılarda sorunsuz bir şekilde görüntülenebilmektedir. Görüntü yapısında herhangi bir sorun oluşmayacaktır.
Bir diğer yandan sayfaya eklenecek gif grafikler de büyük boyutlara sahip olmaktadırlar. Aşırı gif kullanımı sayfa performansını olumsuz yönde etkileyecektir. Buda web sayfasının verimsiz bir hal almasına neden olacaktır.
İyi bir performansa sahip olmak için png uzantılı dosyaların kullanımı daha akılcı ve mantıksal olacaktır. Bu durumda en iyi png öğeleri PNG-8 ve PNG-24 olarak değerlendirilebilir.
Iphone’un ekran teknolojilerinden biri olan retina ekranlar sayesinde daha canlı ve daha kaliteli görüntüler almak mümkün bir hale gelmiştir. Iphone piyasaya sürdüğü 4S modeli ile birlikte retina teknolojisine de geçiş yapmıştır. Retina ekranlardan yüksek görüntü kalitesine sahip olmak için web sitelerinde bu yapı ile uyumlu olması gerekmektedir. Aksi halde retina görünüm ile normal görünüm arasında bir fark olmayacaktır. Burada işin içine javascript girmektedir. Javascriptin zengin kütüphanesine ait bir script olan retina.js sayesinde telefondan girilen web sitelerde daha canlı bir şekilde olmaktadır. Yapılan kod düzenlemeleri ile daha canlı ve kaliteli bir görüntü optimizasyonu sağlanmış olacaktır.