Site içi görseli iyi kullanmak gerekir. Resimsiz düz yazıdan oluşan içerikler okuyucuyu yorduğu gibi sıkıcı da gelebilir. Yazılarınıza konuyla alakalı resimler iliştirin , böylelikle siteniz daha görsel ve daha çekici bir hal alır.Bazı hususlara deyinmek istiyorum.

Resmin Kalitesi

Buraya kadar iyi güzel de resim boyutları düz yazılardan yüksektir, sayfanın açılma hızını düşürebilir. Burada iş size düşüyor, siteye koymadan önce gerekiyorsa resimler üzerinde oynamanızı tavsiye ederim. Adobe Photoshop gibi yüksek fiyatlı bir pragrama sahip değilseniz daha uygun örneğin bedava programlardan yararlanabilirsiniz. Fast Stone Photo Resizer oldukça kullanışlı, bir klasördeki tüm resimleri isterseniz belli bir boyuta çekebiliyor, çerçeve atabiliyor veya boyutlarıyla ellemeden kalitesiyle oynayabiliyor. Ben resmin kalitesinden çok fazla fedakarlık etmek istemediğim için kaliteyi 80′ e ayarlayarak farklı bir klasöre kaydettiriyorum, böylece beğenmezsem tekrar deneme şansım oluyor.

Resmin Özellikleri

Site üzerinde kullanacağınız resmi o alana göre boyutlandırmaya özen gösterin, 90 piksel kullanacağınız yerde 400 piksellik resmi koyup ayarlarından küçük gösterirseniz gereksiz yere sayfayı yavaşlatmış olursunuz.

Resmi tanıtırken mutlaka en ve boyunu belirtin.
width=”90″ height=”90″

Her resmin mutlaka alt etiketi olsun, özellikle arama motorları için önemlidir.
alt=”Site Tanıtım Logo”

Resme bağlantı verdiğinizde çevresinde mavi bir  kontür olmasın istiyorsanız, kenar kalınlığını 0 verin.
border=”0″

Dilerseniz resim çevresine (kendisine değil) stil özellikleri verebilirsiniz.
style=”background:#E3E3E3;  padding:2px;  border:1px solid #FF0099″

Yer Tanımı

Resim sayfa ile aynı klasörde duruyorsa sadece ismini yazmanız yeterlidir, klasör altına koyduysanız,resim/ demeniz lazım ki onun yerinin bir alt klasörde olduğunu bilsin ../ ise resmin bir üst klasörde olduğunu gösterir.  En başına / işaretini koyarsanız  sitenin ana klasöründen başla demektir, 4 klasör aşağıda bile olsa yerini bulacaktır.

Klasör yapınızın

Deneme / kitaplar / 2010
resimler

olduğunu varsayalım, 2010 klasöründeki index.html dosyasından resimler klasöründeki resmi okutmak için 2 farklı yönteminiz var birincisi;

../../../../resimler/deneme.jpg

ikincisi ise;

/resim/deneme.jpg

gördüğünüz 2 farklı yöntem ve birisi diğerine göre ne kadar basit.

Buraya kadar öğrendiklerimizi toparlayacak olursak şöyle bir sonuç alacağız.

<img src=”/resimler/deneme.jpg” width=”90″ height=”90″ alt=”Site tanıtım Logosu”>

Stil kullanılmış

<img src=”/resimler/deneme.jpg” width=”90″ height=”90″ alt=”Site tanıtım Logosu” style=”background:#E3E3E3;  padding:2px;  border:1px solid #FF0099″>