Canva görsellerini web siteleri için optimize etme: dışa aktarma ve sıkıştırma

Canva'nın indirme ayarlarını kontrol edin

Basit bir indirme için Paylaş → İndir yolunu açın; fotoğrafta JPG, yazı ve grafikte PNG seçin. Sayfayı seçip indirin. Kaydedilen piksel ölçülerini kontrol edin. Hesapta boyut veya kalite ayarı yoksa indirilen kopyayı daha sonra küçültebilir ya da sıkıştırabilirsiniz.

Eğer Boyutu sınırla seçeneği varsa, Canva şu anda bunu tek sayfalık JPG veya PNG çıktılarında destekler. Belgelerine göre karmaşık tasarımlar yine de istenen sınırı aşabilir. Kaydedilen dosyayı kendiniz kontrol edin.

Daha küçük sürümleri denemeden önce net bir Canva çıktısını saklayın. Canva'da JPG kalitesini düşürüp sonra yeniden sıkıştırmak veya dönüştürmek ayrıntıları iki kez azaltabilir. Sağlıklı bir karşılaştırma için her sürümü aynı kaliteli çıktıdan oluşturun.

Web sayfasındaki görseller için bir görsel biçimi kullanın. PDF Baskı, sıradan bir resmi web sayfasına yerleştirmek için değil, baskı için tasarlanmıştır. Daha kaliteli görünen bir seçenek her zaman doğru değildir. Görselin ölçülerini, görünümünü ve sayfanın gerçekten yüklediği dosyayı kontrol edin.

Canva görselinin nerede kullanılacağını belirleyin

Tam genişlikte bir banner, blog küçük resmi ve küçük bir logo farklı ihtiyaçlara sahiptir. Dışa aktarmadan önce hedef sayfayı açıp görselin görüntülenme genişliğini, şeklini ve arka planını kontrol edin. Kare bir sosyal medya gönderisi, geniş bir site başlığına her zaman uygun değildir.

Üç şeyi not edin: yaklaşık görüntülenme genişliği, saydamlık ihtiyacı ve okuyucunun görselde neyi ayırt etmesi gerektiği. Banner için bir ürün ve kısa yazı, diyagram için her sözcük ve çizgi önemli olabilir. Böylece sonucu yalnızca dosya boyutuna göre değerlendirmezsiniz.

Tasarımda başlık, paragraf veya düğme varsa bunları doğrudan web sayfasına eklemeyi düşünün. PNG veya JPG içindeki metin görselin bir parçasıdır; ekran daraldığında satırları yeniden düzenlenemez. Canva'da çizilmiş bir düğme de sitede çalışan bir bağlantı eklenmedikçe yalnızca resimdir. Mümkünse görseli çizim için, sayfayı önemli metinler ve düğmeler için kullanın.

Tasarıma göre JPG, PNG veya SVG seçin

Canva farklı amaçlar için JPG, PNG ve SVG çıktıları sunar. Güncel seçenekler için indirme biçimleri kılavuzuna bakın. Tablo, kendi dosyalarınızı karşılaştırmak için başlangıç noktasıdır; tek bir biçim her zaman en iyi değildir.

JPG, bazı görsel ayrıntılarını çıkararak dosyayı küçültür. Buna kayıplı sıkıştırma denir. Genellikle fotoğraflarda iyi sonuç verir, ancak kenarları bulanıklaştırabilir veya harflerin çevresinde iz bırakabilir. PNG bu tür bozulmaları önler; yine de PNG olarak kaydedilen bir fotoğraf çok daha fazla yer kaplayabilir. İki biçim de özgün tasarımdaki bulanıklığı düzeltemez.

SVG, şekilleri ve çizgileri büyütüldüklerinde net kalacak şekilde tanımlar. Ancak SVG içindeki bir fotoğraf yine fotoğraftır; bu şekilde dışa aktarmak ona yeni ayrıntılar kazandırmaz. Fotoğraf içeriyorsa dosya büyük de kalabilir. Pixilo'nun sıkıştırıcısı SVG kabul etmez. Siteniz SVG'yi kabul ediyor ve görsel doğru görünüyorsa dosyayı doğrudan kullanabilirsiniz.

İndirdikten sonra bir WebP sürümü de deneyebilirsiniz. PNG grafikler için PNG → WebP, JPG fotoğraflar için JPG → WebP aracını kullanın. Sonucu Canva çıktısıyla karşılaştırın. Dosya büyürse veya metin kötüleşirse ilk çıktıyı saklayın. Her biçimin kullanımını web siteleri için görsel biçimleri kılavuzumuz açıklar.

Sayfaya uygun piksel boyutlarını seçin

Görselin sayfada en fazla hangi genişlikte görüneceğini kontrol edin. Banner 800 piksel genişliğinde gösteriliyorsa, yüksek çözünürlüklü bir telefon veya dizüstü ekranında 800 ve 1600 piksellik sürümleri karşılaştırın. Ek pikseller daha fazla ayrıntı gösterebilir, ancak indirilecek veri miktarını artırır. Her görselin boyutunu otomatik olarak ikiye katlamak yerine iki sürümü de değerlendirin.

Genişlik ve yükseklik oranını, yani en boy oranını koruyun. 800 × 450 alan 16:9 oranındadır; 1600 × 900 görsel de aynı şekle uyar. 1600 × 1600 kareyi kırpmak veya farklı bir yerleşim kullanmak gerekir. Mobil başlık alanı çok daha yüksekse, önemli içeriğin yanlardan kesilmemesi için tasarımı uyarlayın.

Siteniz telefonlara küçük, büyük ekranlara daha büyük görsel dosyaları sunabilir. Bunlara duyarlı görseller denir. Tek bir büyük görsel yüklemek yeterli değildir: sitenin farklı sürümleri oluşturması veya sağlaması ve hangisini yükleyeceğini seçmesi gerekir. Çok sayıda kopya hazırlamadan önce site oluşturucunuzun zaten ne yaptığını kontrol edin. Ayrıntılar için duyarlı görseller kılavuzumuza ve MDN'nin duyarlı görseller açıklamasına bakın.

Yalnızca Canva düzenleyicisindeki ölçülere değil, indirilen dosyanın genişliğine ve yüksekliğine bakın. İndirme boyutunu değiştiremiyorsanız gerekli ölçülere yakın bir tasarımla başlayıp sonucu kontrol edin. Çok büyük görselleri küçültmek için Pixilo'nun yeniden boyutlandırma aracını kullanın. Küçük bir JPG veya PNG'yi büyütmek eksik ayrıntıları geri getirmez.

Saydam arka planlı bir grafik indirin

Şeffaf PNG dâhil bazı indirme seçenekleri uygun bir Canva planı gerektirir. Seçenek yoksa hesabınızın olanaklarını bağlantılı yardım sayfasından kontrol edin. Normal bir JPG veya PNG indirmesini yine de optimize edebilirsiniz.

Bir görsel görüntüleyici saydam grafiği beyaz üzerinde gösterebilir. Bu yüzden beyaz önizleme tek başına arka planın saydam olup olmadığını göstermez. Görseli hem açık hem koyu arka planda deneyin; kenarları ve gölgeleri inceleyin.

JPG'yi PNG'ye dönüştürmek arka planı kaldırmaz. Tasarımdaki fotoğrafın konusunun arkasında beyaz bir dikdörtgen varsa PNG seçmek onu yok etmez. İstenmeyen arka planı indirmeden önce tasarımda kaldırın.

Grafik hep aynı düz renk üzerinde kullanılacaksa saydamlık gerekmeyebilir. Daha sonra başka yerde kullanma ihtimaliniz varsa saydam sürümü ayrıca saklayın. Arka planın dosyada mı, yoksa yalnızca görüntüleyen uygulamada mı olduğunu anlamak için siyah veya beyaz arka planlar kılavuzumuzdan yararlanabilirsiniz.

saydam dışa aktarma talimatlarına

Canva çıktısını Pixilo ile sıkıştırın

Boyutlar ve yerleşim uygun olduğunda görsel sıkıştırıcıyıaçın. Her biri en fazla 25 MB olan 20 adede kadar JPG, PNG veya WebP ekleyebilirsiniz. Pixilo bunları cihazınızda tek tek işler; biçimi, genişliği ve yüksekliği korur. Her kenar en fazla 8000 piksel, toplam en fazla 32 milyon piksel olmalıdır. Örneğin 8000 × 4000 iki sınırı da karşılar, 8000 × 8000 karşılamaz.

PNG sıkıştırması kayıpsızdır: pikseller ve renkler değişmez. Canva'nın zaten iyi sıkıştırdığı PNG çok az küçülebilir. JPG ve WebP sıkıştırması ince ayrıntıları değiştirebilir; sonucu kontrol edin. Yeni dosya daha küçük değilse Pixilo özgün dosyayı korur.

Biçimi değiştirmek için dönüştürme aracı kullanın. Ana sayfadaki sıkıştırıcı PNG'yi PNG olarak tutar. PNG → WebP ve JPG → WebP araçlarında görseli ekledikten sonra kaliteyi ayarlayıp Sonuçları güncelle seçeneğiyle değişikliği uygulayabilirsiniz. Bu araçlar genişliği veya yüksekliği 4000 pikseli aşan görselleri orantılı olarak küçültür; en uzun kenar 4000 piksel olur. Çok büyük tasarımlarda indirilen ölçüleri kontrol edin.

Yükleme formunda kesin dosya boyutu sınırı varsa Hedef boyuta sıkıştıraracını deneyin. Formun kabul ettiği bir biçim seçin ve minimum genişlik ile yüksekliği de kontrol edin. Metni veya ayrıntıları belirsizleştirmeden çok küçük bir dosyaya ulaşmak her zaman mümkün değildir. Yalnızca boyutu değil, tüm gereksinimleri dikkate alın.

Örnek: bir makale için Canva banner'ı hazırlama

Makalenizde en fazla 800 × 450 piksel olarak gösterilecek bir banner gerektiğini düşünün. Tasarım bir fotoğraf ve kısa metin içeriyor. Bu ölçüler planlama örnekleridir; sıkıştırma testi sonuçları değildir.

1. Kompozisyonu hazırlayın. 16:9 kullanın ve ana konuyu hem masaüstünde hem mobilde görünür tutun. Makale başlığını görsel içinde uzun uzun tekrarlamak yerine web sayfasına ekleyin.
2. İki sürüm indirin. Mümkünse aynı tasarımdan 1600 × 900 JPG ve PNG çıkarın. İkisini açıp kısa metni inceleyin. Her ikisini de Canva tasarımından oluşturun, önceden sıkıştırılmış bir kopyadan değil.
3. Sıkıştırmayı karşılaştırın. Seçtiğiniz çıktıyı ana sayfadaki sıkıştırıcıyla deneyin. Siteniz destekliyorsa PNG'nin WebP kopyasını da test edin. Doğru dosyaları karşılaştırmak için farklı adlar kullanın.
4. Masaüstünde ve mobilde kontrol edin. Banner'ı 800 × 450 ölçülerinde ve telefonunuzdaki görüntülenme genişliğinde inceleyin. Metin yakınlaştırmadan okunabilmelidir. Çok küçükse daha fazla sıkıştırmak yerine tasarımı sadeleştirin veya metni sayfaya taşıyın.
5. Tercih ettiğiniz sürümü yayımlayın. Sitenin gerçekten yüklediği dosyayı, boyutunu ve kırpmasını kontrol edin. Site otomatik küçük sürümler üretiyorsa diğer görselleri değiştirmeden önce onları da inceleyin.

Bu konumda işe yarayan ölçüleri ve biçimi not edin. Benzer tasarımlar için başlangıç olarak kullanın, ancak her sonucu kontrol edin. Basit bir çizim ve ayrıntılı bir fotoğraf aynı ölçülerde bile farklı ayarlar gerektirebilir.

Bulanık metni veya beklenmedik büyük dosyaları düzeltin

İndirilen tasarım zaten bulanık

Canva dosyasını sıkıştırmadan önce açın. Zaten bulanıksa tasarıma dönüp özgün fotoğrafı, metin boyutunu ve indirme ölçülerini kontrol edin. Canva'nın bulanık indirmelerle ilgili kılavuzu yaygın nedenleri açıklar. Sıkıştırma, odak dışı fotoğrafı veya çok küçük kaydedilmiş görseldeki metni düzeltmez.

Dosya cihazda net, web sitesinde bulanık

Site küçük bir önizlemeyi büyütüyor, yeniden sıkıştırıyor veya eski bir sürümü gösteriyor olabilir. Tarayıcı izin veriyorsa yayımlanan görseli yeni sekmede açıp ölçülerine bakın. Gerekirse geliştirici araçlarıyla yüklenen dosyayı bulun. Sayfa küçük önizlemeyi yüklemeye devam ediyorsa daha büyük Canva çıktısı işe yaramaz.

PNG neredeyse hiç küçülmüyor

Görseli değiştirmeden çıkarılabilecek veri sınırlıdır. Fotoğraf veya ayrıntılı doku içeren PNG, özellikle zaten iyi sıkıştırılmışsa büyük kalabilir. Saydamlık gerekmiyorsa JPG deneyin. WebP de saydamlığı destekler; dönüştürmeden sonra metni ve kenarları kontrol edin. PNG daha iyi görünüyorsa onu koruyun ya da yalnızca netlik korunuyorsa ölçüleri küçültün.

İki dönüştürmeden sonra tasarım kötüleşiyor

Kaliteli Canva çıktısına dönün. Tekrar tekrar JPG → WebP → JPG dönüştürmekten kaçının. Her kayıplı kayıt yeni bozulmalar ekleyebilir; son dönüştürme önceki kayıpları geri almaz. Her alternatifi aynı kaynaktan oluşturup doğrudan onunla karşılaştırın.

Yalnızca dosyayı değil, yayımlanan sayfayı kontrol edin

• Yüklenen görseli kontrol edin. Sayfa eski veya gereksiz büyük bir kopyayı değil, yeni dosyayı ya da sitenin oluşturduğu uygun sürümü göstermelidir.
• Mobil kırpmayı inceleyin. Konuyu görünür tutun ve önemli yazıları yerleşimin gizleyebileceği kenarlara koymayın.
• Önemli bilgileri sayfada normal metin olarak verin. Ziyaretçiler tek fiyatı, talimatı veya eylem çağrısını okumak için görseli büyütmek zorunda kalmamalıdır.
• Anlam taşıyan görselleri açıklayın. Görseli göremeyen kişiler için kısa bir açıklama olan alternatif metin ekleyin. Görselin bu sayfada neden önemli olduğunu anlatın. Yalnızca dekoratif görsellerde alternatif metin genellikle boş bırakılır. Google'ın görsel SEO yönergelerini izleyin; açıklamaları anahtar kelimelerle doldurmayın.
• Sayfanın yüklenmesini kontrol edin. Küçük dosya yardımcı olur, ancak yüklemenin ne zaman başladığı da önemlidir. Ana görsel hâlâ geç görünüyorsa görseller ve Core Web Vitals kılavuzuna bakın.

Sık sorulan sorular

Canva tasarımlarını her zaman PNG olarak mı indirmeliyim?

Hayır. Saydam grafikler ve net metin için PNG, saydamlık gerektirmeyen fotoğraflar için JPG deneyin. Her tasarımda aynı biçimi kullanmak yerine dosyaları sayfada görünecekleri boyutta karşılaştırın.

Ücretli dışa aktarma ayarları olmadan Canva görsellerini optimize edebilir miyim?

Evet. Kullanılabilen JPG veya PNG'yi indirin, ölçülerini kontrol edin ve kopyayı Pixilo ile yeniden boyutlandırın, sıkıştırın veya dönüştürün. Bu, Canva'nın ücretli özelliklerini açmaz ve kaynakta olmayan saydamlığı oluşturmaz.

İki kat boyutta dışa aktarmak görseli her zaman iyileştirir mi?

Hayır. Daha büyük çıktı yüksek çözünürlüklü ekranda daha net görünebilir, ancak tasarımdaki küçük veya bulanık fotoğrafı düzeltmez. İki sürümü de sayfanızda karşılaştırın; büyük olanı yalnızca faydalı bir fark yaratıyorsa kullanın.

Web görselleri için belirli bir DPI ayarı gerekir mi?

Piksel cinsinden genişliğe, yüksekliğe ve sayfadaki görüntülenme boyutuna odaklanın. Yalnızca DPI sayısını değiştirmek ayrıntı eklemez. Web ve baskı arasındaki farkları DPI, PPI ve piksel kılavuzumuz açıklar.

WebP kullanmak daha iyi arama sıralaması sağlar mı?

Hayır. Biçimi değiştirmek sıralama garantisi vermez. Faydalı bir görsel, anlaşılır çevre metni, uygun açıklamalar ve verimli bir sayfa, sırf uzantı seçmekten daha iyi hedeflerdir.