Metin ve Görsel İçeren Bir Makalede Fotoğraflar Nasıl Boyutlandırılır ve Yerleştirilir?
Okunabilir bir makale için her fotoğrafı üstlendiği göreve göre boyutlandırın: Önemli kanıt veya bağlam taşıyan bir görsele net şekilde görülebilmesi için yeterli alan tanıyın; etrafındaki metin konuyu zaten açıklıyorsa destekleyici bir görseli daha küçük tutun. Görseli açıkladığı pasajın yanına yerleştirin, net bir okuma sırası koruyun ve dar genişliklerde yerleşimi kontrol edin. Bu rehber, dijital bir makalede fotoğrafların düzenlenmesine odaklanmaktadır; amaca öncelik veren aynı tercihler basılı bir mizanpaja da yön verebilir, ancak ekran davranışının kendi içinde ayrıca kontrol edilmesi gerekir.
Fotoğrafın göreviyle başlayın
Bir fotoğrafı taşımadan veya yeniden boyutlandırmadan önce okuyucunun ondan ne anlaması gerektiğine karar verin. Bu fotoğraf incelemeleri gereken bir kanıt mı, bir pasajı zihinde canlandırmayı kolaylaştıran bir örnek mi, yoksa sadece bir süs mü? Bu ayrımı yapmak, önceden belirlenmiş bir görsel genişliğiyle başlamaktan daha yararlıdır.
Fotoğraf metinde yer almayan bir bilgi taşıyorsa, ilgili ayrıntının okunabilir olması için ona yeterli alan tanıyın. Bir belgenin, nesnenin veya sürecin küçük bir görseli, okuyucu onu inceleyemiyorsa asıl görevini yerine getiremeyebilir. Fotoğraf yalnızca metinde zaten açıklanmış bir noktayı görselleştiriyorsa daha küçük bir boyut yeterli olabilir ya da görsele hiç ihtiyaç duyulmayabilir. Bu, evrensel bir boyut standardı değil, fotoğrafın amacından çıkarılan pratik bir tasarım kuralıdır. GOV.UK Design System'ın görsel kılavuzu da benzer şekilde görsellerin gerçek bir kullanıcı ihtiyacını karşılaması ve görsel yardımcılar olarak hizmet etmesi gerektiğini, zorunlu bilgilerin ise yazılı olarak sunulmaya devam etmesi gerektiğini belirtir. Bu öneriler hükümetin çevrim içi hizmetleri için yazılmıştır; bu nedenle bunları her tür makale için bir kural kitabı olarak değil, faydalı bir referans olarak değerlendirin.
Faydalı bir karar verme yöntemi, her fotoğrafa şu üç rolden birini atamaktır: inceleme, örnekleme veya süsleme. "İnceleme" genellikle daha büyük bir sergileme alanı ile dikkati ilgili ayrıntıya çeken bir açıklama veya altyazı gerektirir. "Örnekleme" genellikle desteklediği paragrafın yanında orta büyüklükte yer alabilir. "Süsleme" ise bilgilendirici bir göreve sahip değildir; bunu çıkarmayı veya görsel olarak dikkat çekmeyecek bir boyutta tutmayı düşünebilirsiniz. Bu kategoriler, kaynaklar tarafından zorunlu kılınan bir terminoloji değil, pratik bir düzenleme aracıdır.
Öneme ve kullanılabilir alana göre bir boyut seçin
Makalenin metin sütununu başlangıç sınırınız olarak kullanın. Sütunu boydan boya kaplayan bir fotoğrafın fark edilmesi kolaydır ve ayrıntılı içeriğe daha fazla alan tanır; bu yaklaşımı, yarattığı görsel duraklamayı hak edecek öneme sahip görsellere ayırın. Sütunla hizalanmış daha küçük bir fotoğraf, başlık veya metinle yarışmadan yakındaki bir noktayı destekleyebilir. Yalnızca orijinal dosya büyük olduğu için bir boyut seçmekten kaçının: Görüntülenen boyutlar yerleşime ve okuyucuların görmesi gereken bilgilere uygun olmalıdır.
Test edilmiş bir şablon değil, örnek niteliğinde bir karar senaryosu: 700 piksel genişliğindeki bir içerik sütununda, aralarındaki farkın pasajın ana konusu olduğu iki parçalı bir nesneyi gösteren bir fotoğraf olduğunu varsayalım. Tam sütun genişliğine yakın bir sergileme karşılaştırmayı kolaylaştırabilir. Aynı fotoğraf yalnızca genel bir sahne oluşturucuysa ve açıklama paragrafta yer alıyorsa, daha dar bir görüntüleme metne verilen vurguyu koruyabilir. 700 piksel değeri yalnızca sütun genişliğine bir örnektir; önerilen bir standart değildir.
Geniş bir ekranda bir fotoğraf metnin yanında göründüğünde, ikisini eşleşmiş bir birim olarak ele alın. Görsele konusunu gösterebilecek yeterli genişliği, metne de rahatça okunabilecek kadar alanı verin. İkisinden biri sıkışık hâle gelirse, fotoğrafı küçültüp metni dar bir şeride sıkıştırmak yerine bunları alt alta dizin. Daha küçük ekranlarda, genellikle en net düzenleme tek sütunlu bir sıralamadır: metin, ardından ilgili fotoğraf, ardından sonraki pasaj. W3C'nin WCAG 2.2 Reflow açıklaması, birçok makale sayfasının tek bir sütuna nasıl uyarlanabileceğini anlatır ve sıradan okuma içerikleri için iki yönlü kaydırmayı önleme hedefini açıklar. Ayrıca, anlamı veya kullanımı iki boyutlu bir yerleşim gerektiren içerikler için istisnalara da dikkat çeker. Bir makale yerleşimi açısından asıl mesele, görsel-metin eşleşmesinin okuyucuları metni takip etmek için yana doğru kaydırma yapmak zorunda bırakmamasını sağlamaktır.
Her fotoğrafı bağlantısının net olduğu bir yere yerleştirin
Fotoğrafı, orada bulunma nedenini açıklayan cümlenin veya paragrafın yakınına koyun. Okuyucuların görseli bulmak için ilgisiz birkaç paragrafı kaydırması gerekiyorsa, aradaki bağlantı belirsizleşebilir. Benzer şekilde, bir cümlenin veya fikrin tam ortasına eklenen büyük bir fotoğraf mantık akışını bölebilir. Düzgün bir yerleşim genellikle konuyu tanıtan ilk pasajın hemen ardından veya görsele ihtiyaç duyulan bir adımın tam öncesidir.
Belirli bir katkı sağladığında bir altyazı kullanın: konuyu tanımlayın, bir ayrıntıya işaret edin veya görselin neden önemli olduğunu açıklayın. Çevredeki cümleyi kelimesi kelimesine tekrarlamak için altyazı kullanmayın. Fotoğrafın yakından incelenmesi gerekiyorsa, neye bakılacağını altyazının yanı sıra yakındaki metinde de belirtin; okuyucular verilmek istenen mesajı yalnızca yerleşimden çıkarmak zorunda kalmamalıdır.
Fotoğraf ile metni arasındaki ilişki, görme engelli veya ekran okuyucu kullanan okuyucular için de önemlidir. W3C'nin Images Tutorial kılavuzu, bilgilendirici görsellerin temel bilgilerini aktaran metin alternatiflerine (alt metin) ihtiyaç duyduğunu; dekoratif görsellerin ise yardımcı teknolojilerin bunları atlayabilmesi için boş bir alternatif kullanabileceğini belirtir. W3C'nin bilgilendirici görsel rehberi, alternatifin yalnızca görünen nesneleri listelemek yerine görselin bağlam içindeki anlamını ifade etmesi gerektiğini vurgular. Pratik bir kontrol olarak şunu sorun: Biri bu fotoğrafı göremeseydi hangi bilgiyi kaçırırdı? Temel bilgileri makale metnine ekleyin ve görsel için uygun bir metin alternatifi sağlayın. Görsel, bitişiğindeki metnin ötesinde hiçbir şey katmıyorsa açıklamasını tekrarlamak gereksiz olabilir.
Fotoğrafın kullanışlı formunu koruyun
Bir fotoğrafın en-boy oranı (genişliği ile yüksekliği arasındaki ilişki), kapladığı alanı ve neyin görünür kaldığını etkiler. Fotoğrafın tamamını seçilen alana sığdırarak başlayın. Yalnızca ana konu net kaldığında ve kırpma işlemi okuyucunun ihtiyaç duyduğu ayrıntıları ortadan kaldırmadığında kırpma yapın. Yatay bir kırpma geniş bir ana görsel için uygun olabilir; dikey bir görsel ise sütun içinde daha küçük bir genişlikte daha iyi sonuç verebilir. Bunlar değişmez kurallar değil, kompozisyon tercihleridir.
Kırpma bağlamı ortadan kaldırıyorsa, bariz anlamı değiştiriyorsa veya makalede tartışılan bir ayrıntıyı gizliyorsa, farklı bir kırpma kullanın ya da orijinal oranları sergileyin. Şemalar, etiketler veya belgeler için nihai sergileme boyutunu kontrol edin: Fotoğrafın içine yerleştirilmiş metinler okunamayacak kadar küçük hâle gelebilir. GOV.UK görsel kılavuzu, okunması, kopyalanması, yeniden boyutlandırılması veya bir ekran okuyucu ile erişilmesi zor olabileceğinden görsellerin içine metin yerleştirilmesini genel olarak önermez; metin görsel için vazgeçilmez olduğunda, anlamı yakındaki yazılı içerikte de sunun.
Yerleşimi okuyucuların kullandığı boyutta kontrol edin
Makaleyi hem geniş bir masaüstü genişliğinde hem de dar bir mobil genişlikte önizleyin. Fotoğrafın metin sütununun dışına taşmadığından, içeriği kapatmadığından veya metni yanında sıkışmış halde bırakmadığından emin olun. Başlıktan paragrafa, oradan fotoğrafa okuma sırasını takip edin: Yerleşim alt alta dizildiğinde görsel yine de açıkladığı pasajın yakınında görünmelidir. Ayrıca altyazıları ve görseldeki önemli ayrıntıları gerçekte görüntülendikleri boyutta kontrol edin.
Web sayfaları için görüntülenen boyut ile dosya boyutu birbirinden ayrı kararlardır. Büyük bir sergileme için büyük bir kaynak dosya gerekebilir, ancak daha küçük ekranlara gereksiz derecede büyük görsel dosyaları göndermek veri israfına yol açabilir. Google'ın web.dev duyarlı görseller rehberi, tarayıcıların farklı görüntüleme koşulları için görsel boyutları arasından nasıl seçim yapabileceğini açıklar ve tek bir doğru görsel versiyonu sayısı olmadığını belirtir. Bu, web yayıncılığı için bir uygulama kılavuzudur; görselin makalede nereye ait olduğunu belirlemez.
Hızlı bir karar dizisi
Görevi adlandırın. Fotoğraf incelenmek için mi, metni görselleştirmek için mi, yoksa sadece sayfayı süslemek için mi var?
Bağlantı noktasını bulun. Onu tanıtan veya ona bağlı olan pasajı belirleyin, ardından fotoğrafı o pasajın yanına yerleştirin.
Görüntüleme genişliğini ayarlayın. Kilit kanıtlara yeterli alan tanıyın; ayrıntı şart değilse destekleyici bir fotoğrafın daha az yer kaplamasına izin verin.
Kırpmayı kontrol edin. Konuyu ve ilgili tüm bağlamı görünür tutun.
Yerleşimi sırayla sesli okuyun. Dar bir ekranda, metin ve fotoğrafın mantıklı bir sırada görünmeye devam ettiğini ve metnin okunabilir kaldığını doğrulayın.
Bilgiyi tanımlayın. Faydalı olduğunda bir altyazı ekleyin ve görselin rolüne göre bir metin alternatifi sağlayın.
Pratik kural basittir: Belirginliği önemin, yerleşimi ilgili metnin belirlemesine izin verin ve düzenlemenin hâlâ çalışıp çalışmadığını dar ekran önizlemesinin ortaya çıkarmasını sağlayın. Fotoğrafı seçtiğiniz boyutta anlamak zorsa onu büyütün, kırpmayı basitleştirin veya ilgili ayrıntıyı metinde açıklayın.
