Web Sitesine Fotoğraf Ekleme
Web Sitesine Fotoğraf Ekleme : Web tasarım yaparken içeriğe fotoğraf ekleme genel olarak yapılan ve güzel fotoğraf kullanımlarında siteyi güzelleştiren bir durumdur. Fotoğraf kullanımlarında dikkat edilmesi gereken durumlar ve fotoğrafların daha önceden birisi tarafından kullanılmamış veya telif hakkı içermemesine göz atılmalıdır. Fotoğrafın özellikleri bölümünden bakılmalı ve bu bölüm içine de kendi bilgilerinizi yazmanız size artı puan kazandıracaktır.
Fotoğraf eklemeyi sizlere örnekli olarak göstereceğim ancak bundan önce sizlere ufak bir hatırlatma yapmak istiyorum. Site içinde kullanacağınız fotoğraflar daha önceden bir sitede kullanılmamış ve telifsiz olmalıdır. Aynı zamanda fotoğraf boyutları site açılış ve sayfa yüklenme hızını etkileyeceğinden fotoğraf boyutlarına da dikkat edilmelidir.
Önemli Not: Web sitenize yüksek boyutlu fotoğraflar yüklemeyi tercih etmeyin. Bunun yerine yüksek boyutlu fotoğrafları ilk önce fotoğraf programı ile boyutunu düşürme işleminin ardından sitenize ekleyin.
HTML Fotoğraf Ekleme
Aşağıdaki örnek üzerinden gidecek olursam fotoğrafı HTML kodunuzun içine direk olarak yapıştırıp fotoğraf yolunu, uzunluğunu, genişliğini vb özelliklerini ayarlayarak rahatça kullanabilirsiniz.
Önerilen Fotoğraf Boyutu : 600px genişlik / 400px uzunluk (katları şeklinde orantılı arttırabilirsiniz.)
Kod:
... <img src="dosya/fotograf.jpg" alt="fotoğraf adı" width="600" height="400" /> ...
Açıklama: Eklediğimiz kod size sola yaslı olacak şekilde src bölümünde seçtiğiniz fotoğrafı gösterecektir.
Fotoğrafları Nereye Saklarım?
Fotoğrafları saklamak için özellikle bir yer önerim yoktur bunun sebebi ise her yazılımcının klasör hiyerarşi yapısı farklı olacağından düzenli olması özel karakterler içermemesi ve boşluk karakteri barındırmamasına özen göstererek kök dizinde veya dilediğiniz yerde tutabilirsiniz.
HTML img Etiketi Özellikleri
Aşağıda img etiketi özelliklerinden maddeler halinde bahsedeceğim hangi parametrenin ne işe yaradığını ve nasıl yapılması gerektiği hakkında kısaca bilgiler vereceğim. img içinde kullanılan parametreler şöyledir.
Kod:
... <img src="gorseller/araba.jpg" alt="dağ arabası" width="500" height="380" /> ...
Kodun parametreleri hep beraber inceleyelim.
- src : Fotoğrafın olduğu yolu yazmaktayız. (gorseller/araba.jpg)
- alt : Web sitesi içine eklenmiş fotoğrafın ne olduğu hakkında bilgi vermek için kullanılır. (dağ arabası)
- width : Fotoğrafın genişliği için kullanılır. (500px)
- height : Fotoğrafın uzunluğu için kullanılır. (380px)
Eklenilen fotoğrafın özelliklerini yukarıdaki tanımlar belirlemektedir ve bu tanımların arasından girilmesi zorunlu olan içlerinden src parametresidir.
Web Sitesine Fotoğraf Nasıl Yüklenmeli?
Web sitesine eklenen fotoğraflar yüksek boyutlu olmamalıdır. Bunun sebebi ise yüksek boyutlu fotoğrafların mobil cihazlarda açılmasının güç olmasıdır ve fotoğrafların boyutu ne kadar yüksekse Web sitesinin açılmasının süresi bir hayli uzamaktadır.
Yüksek boyutlu fotoğrafların diğer sakıncası da arama motorlarının değerlendirmesinde sayfa açılış hızının olmasıdır. Açılış hızındaki yavaşlık sitenizin listelenme içinde üst sıralara çıkmanızı engellemektedir.