Resimlerinizi Çevrimiçi Olarak En İyi Nasıl Sunarsınız?
Yayınlanan: 2013-12-18 Ne tür bir web siteniz olursa olsun, içeriğinizin metin ve resimlerin bir karışımı olması muhtemeldir. Fotoğrafçılar, sanatçılar ve diğer kreatifler için web sitenizdeki görseller muhtemelen içeriğinizin en önemli bölümünü oluşturur ve bu nedenle bunları nasıl düzgün şekilde sunacağınızı bilmek hayati önem taşır.
Elbette, WordPress panosu aracılığıyla daha fazla düşünmeden fotoğraf ve grafik yükleyebilirsiniz, ancak web sitenizin hızlı yüklendiğinden, okunması kolay olduğundan ve arama motorları için optimize edildiğinden emin olmak istiyorsanız, bunu okumanız iyi olur. Konu web sitenizde görsel kullanmak olduğunda en iyi uygulamalar için kısa rehber.
Görüntüleri Kaydetme ve Yükleme
WordPress, büyük resimleri doğrudan bilgisayarınızdan yüklemeyi ve bunları blogunuzun genişliğine uyacak şekilde otomatik olarak görüntülemeyi mümkün kılmış olsa da, işlenmemiş resimleri yüklemenizi önermiyoruz.
Herhangi bir web tarayıcısı, kodda talimat verilmişse, görüntüleri gerçekte olduklarından daha küçük bir boyutta görüntüleyebilir, ancak bunu yapmak gerçek dosya boyutunda bir azalmaya yol açmaz. Tam genişliğinin ve yüksekliğinin %50'sinde görüntülenen 500 kb'lik bir resim yine de 500 kb olacaktır. HTML ve WordPress konusunda bilgili olmayan blogcular, resimleri ekranda büyük görünmediği için, indirmenin hızlı olacağı anlamına geldiğini varsayabilirler, ancak durum her zaman böyle değildir.
Görsel boyutunuzu kontrol etmek için blogunuzdaki bir görsele sağ tıklayın veya kontrol tuşuna basarak tıklayın ve menüden görseli görüntüle/aç'ı seçin (ifade, kullandığınız tarayıcıya bağlı olarak biraz değişebilir). Açılan resim blogunuzda gördüğünüzden çok daha büyükse resimleriniz uygun boyutta değil demektir.
Resim ağırlıklı bir blogunuz varsa ve resimlerinizi yüklemeden önce yeniden boyutlandırmazsanız, web sayfanızın birleşik boyutu gereksiz yere büyük olabilir.
Resimlerinizi yüklemeden önce yeniden boyutlandırmak ve sıkıştırmak için fazladan birkaç dakika ayırmaya değer. Bu, Photoshop'ta veya kullandığınız diğer herhangi bir görüntü düzenleme yazılımında kolayca yapılabilir. PicMonkey ve Dynamic Drive's Image Optimizer gibi ücretsiz çevrimiçi araçları da kullanabilirsiniz.
Görüntüleri manuel olarak yeniden boyutlandırmak, sıkıştırma üzerinde tam kontrol sağlar ve yükleme sürenizi büyük ölçüde azaltır, ancak isterseniz, WordPress'in her yüklemede otomatik olarak oluşturduğu yeniden boyutlandırılmış görüntüleri kullanmayı da seçebilirsiniz. Bir gönderiye resim eklediğinizde, tam boyutlu, büyük, orta veya küçük boyutlu resimler ekleme seçeneğiniz vardır. Bu boyutları Blog tasarımınıza uyacak şekilde Ayarlar > Medya bölümünde düzenleyebilirsiniz. Bu yöntemi seçerseniz, orijinal tam boyutlu resimlerinizin herkesin web sitenizden ücretsiz olarak indirebileceğini unutmayın - fotoğrafçılar ve illüstratörler için en iyi seçenek değil !
Görüntü Optimizasyonu ve Kullanılabilirliği
Resimlerinizin uygun şekilde boyutlandırıldığından ve sayfa yükleme süresi için optimize edildiğinden emin olmanın yanı sıra, SEO (Arama Motoru Optimizasyonu) için doğru şekilde işaretlendiğinden de emin olmalısınız. SEO, arama motorlarının sitenizi bulmasını ve dizine eklemesini kolaylaştırır ve iyi SEO teknikleri kullanan bir sitenin, optimize edilmemiş bir siteye kıyasla arama motoru sonuç sayfalarında daha üst sıralarda görünmesi muhtemeldir.
SEO'nun tam bir tartışması bu makalenin kapsamının ötesine geçer (pek çok WordPress teması zaten kutudan çıkar çıkmaz SEO dostudur), ancak görüntü meta bilgilerinizi optimize etmek, site içi SEO'nuzu biraz artırmanın kolay bir yoludur ve insanların Google görsel arama ve diğer görsel tabanlı arama motorları aracılığıyla sitenizi bulmasına yardımcı olabilir.
Görsellerinizi uygun şekilde işaretlemek, özellikle görseller önemli bilgiler içeriyorsa, kullanılabilirlik açısından da önemlidir. Resmin yüklenmemesi veya görüntülenememesi durumunda (internet bağlantısının yavaş olması, resimlerin kapalı olması veya görme engelli kullanıcılar için) alternatif bir metin açıklaması sağlanması zorunludur.
1. Dosya Adı
İlk olarak, resimlerinizi kaydederken açıklayıcı bir dosya adına sahip olduklarından emin olun. Fotoğraflarınızı kameranızdan çıktığında IMG_013445.jpg veya her neyse olarak bırakmanız, arama motorlarına neyi tasvir ettikleri konusunda herhangi bir ipucu vermeyecektir. Tire ile ayrılmış uygun açıklayıcı anahtar kelimeler kullanın, ör. children-playing-ocean.jpg
2. Alternatif Metin
Görselinizi Medya Yükleyici aracılığıyla yüklediğinizde, WordPress dosya açıklamaları için çeşitli alanlar sunar. Bunlar boş bırakılabilir (ve birçok blogcu zaman kazanmak için yapar), ne kadar çok alan doldurursanız SEO ve kullanılabilirlik için o kadar iyi olur. Bunlardan en önemlisi “alternatif metin”in kısaltması olan alt metindir.

Bu, görüntüler kapatıldığında veya başka bir nedenle gösterilemediğinde görüntülenen metindir, bu nedenle görüntünün ne olduğunun bir açıklaması olarak işlev görmelidir. Arama motorları da bu metni okur ve sayfanın ne hakkında olduğuna ve sitenizi listelerde nereye yerleştireceğinize karar vermek için kullanır. Örneğin, Teksas'ta yaşayan bir düğün fotoğrafçısıysanız, tüm blog resimlerinizin alternatif metninin "düğün fotoğrafçısı" ve "düğün fotoğrafçılığı Teksas" gibi anahtar kelimeler dahil çok sayıda açıklayıcı metin içerdiğinden emin olmak istersiniz. Bununla birlikte, blog metninizde olduğu gibi, resim açıklamalarınıza anahtar kelimeleri aşırı doldurmamanın önemli olduğu konusunda uyarılmalıdır.
Zaman kazanmak için aynı alternatif metni tüm resimlerinize kopyalayıp yapıştırmak cazip gelebilir, ancak ideal olarak, resimlerinizin her birinin onu doğru şekilde tanımlayan benzersiz bir alternatif metni olmalıdır.
3. Resim Başlığı
Resim başlığı, alternatif metne benzer ancak biraz farklı bir amacı vardır. Görsele alternatif bilgi sağlamak yerine, başlık ek bilgi sağlamalıdır. Görsel başlığı, bir görselin üzerine geldiğinizde açılan bir kutuda görünen “araç ipucu” metnidir. Bu metin hem kullanılabilirlik hem de SEO için önemlidir ve resim veya nereye bağlantı verdiği hakkında hızlı, alakalı bilgiler sağlamalıdır.
Resim başlığı, alt metinden biraz farklı olmalı ve yine her resim için benzersiz olmalıdır.
4. Resim Altyazısı
Altyazı, genellikle görüntünün altında görüntülenen ve ek açıklama veya destekleyici metin sağlayan metindir. Altyazı kullanmak isteğe bağlıdır, ancak görseliniz hakkında ek bilgi sağlamak veya başka bir siteden görsel kullanıyorsanız kaynak belirtmek için kullanışlı olabilir. Altyazıyı bir sanat galerisi sergisindeki bir bilgi etiketi gibi düşünün.
Resim Bağlama
Varsayılan olarak, bir sayfaya veya gönderiye bir resim eklediğinizde, WordPress onu sadece üzerinde resim bulunan yeni bir sayfaya bağlar. Bunun gerçek bir nedeni yoktur ve sitenize SEO açısından bile zarar verebilir.
Aynı zamanda büyük bir kullanılabilirlik sorunu olabilir - bir kullanıcı resminizin üzerine gelir ve bunun bir bağlantı olduğunu görürse, bunun yararlı bilgiler içeren bir sayfaya bağlantı verdiğini varsayabilir. Yalnızca resim içeren bu sayfalara tıklamak ziyaretçi için zaman kaybıdır ve hatta ziyaretçi kaybetmenize neden olabilir.
Bu sorunu çözmek için, gerçekten belirli bir sayfaya bağlamak istemiyorsanız, WordPress'te bir resim yüklerken “Link URL” alanı olarak “Yok”u seçin. Bunu yaparsanız, resmin nereye bağlandığını belirtmek için resim başlığını veya resim yazısını kullandığınızdan emin olun.
Görüntü Yerleştirme
Görsellerinizin SEO için optimize edildiğinden ve kullanıcı dostu olduğundan emin olmanın yanı sıra, estetik ve okunabilirlik nedenleriyle metninize nasıl uyduğunu düşünmek de önemlidir.
Satır içi görüntüleri (metnin onları sarması için ana sütunlarınızdan daha küçük), tam genişlikte görüntüleri veya her ikisinin bir kombinasyonunu kullanmayı tercih edebilirsiniz. Tam genişlikte olmayan bağımsız görüntüler veya profesyonel olmayan ve çekici görünmeyen farklı genişliklerde bir dizi görüntü kullanmaktan kaçınmanız gerekir.
Bunu başarmak için portre resimlerinizin yatay resimlerinizle aynı genişlikte olduğundan emin olmalısınız. Görüntülerinizin yüksekliğine dikkat edin - çok uzunlarsa, daha küçük çözünürlüklü ekranlarda taşabilir. Bu, kullanıcıların kaçınılması gereken tam resmi görmek için kaydırma yapmasına neden olur. Resimleriniz portre formatında tam genişlikte görüntülenemeyecek kadar büyükse, yan yana iki veya daha fazla portre resminden oluşan bir kolaj oluşturabilirsiniz.
Satır içi görüntüler, içeriğinize biraz çeşitlilik sağlayabilir ve büyük metin duvarlarını kırmaya yardımcı olabilir. Tam genişlikte görüntülenmeye uygun olmayan daha küçük veya dar görüntüler için de iyi bir seçenektir.
Satır içi görüntüleri kullanırken, görsel tutarlılık için ayarlanmış bir genişliğe karar vermek yine en iyisidir. Bundan daha geniş görüntüler metni çok sıkıştıracağından ve okumayı zorlaştıracağından, bu, metin sütununun genişliğinin yarısından fazla olmamalıdır.
Sol kenar boşluğunu bölmemek ve okunabilirliği azaltmamak için satır içi resimler her zaman metnin solundan ziyade sağına hizalanmalıdır.
Blogunuzu Görsellerle Güzelleştirin
Görselleri kullanmak, ilginç ve görsel olarak çekici bir blog oluşturmak için önemlidir ve yaratıcı işinizi pazarlamak söz konusu olduğunda daha da hayatidir.
İyi optimize edilmiş, iyi sunulmuş görseller için bu makalede ele aldığımız ipuçlarını takip edin ve web siteniz sadece güzel görünmekle kalmayacak, aynı zamanda hızlı yüklenecek, okuması bir zevk olacak ve arama motorları için daha çekici olacaktır. Mutlu yayınlar!