WordPress veya Joomla Web Sitenizde Uygun Şekilde Ölçeklendirilmiş Görüntüler Sunun

WordPress veya Joomla blogunuzda herhangi bir resim çekin. Kaliteyi derecelendirirseniz, olasılıklar resmin mobil cihazlarda değil, okuyucularınızın masaüstü cihazlarına sığacak şekilde küçültülecek kadar büyük olmasıdır. Kalite iyi ve iyidir, ancak bunun gibi durumlar ağır bir fiyata gelir.

Tek bir görüntüyle mümkün olduğunca çok sayıda farklı ekranı barındırmak için büyük bir ekran kullanmanız gerekir. Bu da, küçük cihazlarda bile tamamen indirilmesi gereken büyük dosyalara dönüşür. Bir çözüm var: ister masaüstü ister tablet veya mobil olsun, görüntü aygıtına bağlı olarak ölçeklendirilmiş görüntüler sunma.

Ölçekli Görüntüleri WordPress ve Joomla'da CSS ile Sunma

Web sayfalarında resimler ne kadar yer kaplıyor? Zor ve hızlı kurallar yoktur, ancak önemleri ve yaygınlığı göz önüne alındığında, cana sayfaap kesinlikle çok fazladır. Yine de yeniden ölçeklendireceğiniz görüntüler sunuyorsanız, yalnızca ekonomik olmak ve WordPress veya Joomla kullanıcılarınıza web sitenizin yükleme sürelerini hızlandırmak için önceden ölçeklendirilmiş görüntülerle sunmak mantıklıdır.

CSS, nispeten bilinmeyen, ancak paha biçilemez nitelikler kümesine yardımcı olmak için oradadır: srcset , size ve media . Çoğu modern web tarayıcısı tarafından desteklenen bu öznitelikler, görünüm alanının boyutuna bağlı olarak hangi görüntü sürümlerinin sunulacağını belirlemenize olanak tanır.

Srcset zamanki tamamlar src sekmesini. Öznitelik adından da anlaşılacağı gibi, tek bir görüntü belirtmek yerine, onu ölçeklenmiş görüntülerin bir listesini ve her birinin kullanılması gerektiğinde genişliği belirtmek için kullanırsınız. Bununla birlikte , görüntü alanı genişliğine göre görüntülerin ne zaman gösterileceğini tanımlayabileceğiniz boyutlar özniteliğidir.

Bu nitelikleri hakkında daha fazla bilgiyi okuyabilir burada , ama iyi haber son birkaç yıldır, WordPress otomatik olarak görüntüleri yeniden ölçeklendirilir ve okuyucu uygun boyutlarda hizmet veren olmasıdır. Sonuç şaşırtıcıdır: 511Kb'lik bir portre resmi mobil cihazlarda 42Kb'ye düşürülmüştür.

Otomatik Yeniden olçeklendirme ve Optimizasyon ImageRecycle

Görüntü boyutları söz konusu olduğunda, kaliteden ödün verilmediği sürece ne kadar küçükse o kadar iyidir. WordPress srcset kullanarak size yardımcı olsa da , özellikle resimleri yeniden ölçeklendirip sıkıştırarak resim boyutlarını en aza indirmek için yapabileceğiniz daha çok şey var.

ImageRecycle , görüntüleri sizin için aynı anda yeniden ölçeklendirip sıkıştırabilen bir eklentidir ve hem WordPress hem de ImageRecycle mana sayfacuttur. ImageRecycle , görüntüleri otomatik olarak yeniden ölçeklendirmek ve sıkıştırmak için ImageRecycle kullanabilirsiniz.

Yeniden ölçeklendirme, özellikle kendinizi WordPress veya Joomla blogunuzda stok resimleri kullanırken bulursanız kullanışlıdır. Bu görüntüler, baskı medyası dahil tüm kullanımları hesaba katmak için genellikle orantısız bir şekilde büyüktür. Web'de, tüm çözünürlüğü kullanmanız son derece düşüktür. ImageRecycle , büyük resimleri yükledikten sonra otomatik olarak maksimum yüksekliğe veya genişliğe ImageRecycle .

Yeniden ölçeklendirmeyi tamamlayan, kaliteden ödün vermeden görüntü boyutunu optimize eden sıkıştırmadır. Kayıplı sıkıştırma ile görüntü alanını% 80'e kadar azaltabilirsiniz. Bu sadece orijinal görseller için değil, aynı zamanda WordPress tarafından yeniden ölçeklendirilen görseller için de geçerlidir. ImageRecycle bunu sizin için otomatik olarak bir kez daha yapabilir.

Birkaç ekstra kilobayt olarak gördüğünüz şey, okuyucunuz için değerli kayıp zaman anlamına gelebilir. İyi haber şu ki, yükleme süreleri için kaliteden ödün vermek zorunda değilsiniz. CSS'nin ve ImageRecycle yeniden ölçeklendirmesinin ve optimizasyonunun daha akıllıca kullanılmasıyla, okuyucularınızın cihazlarına uyum sağlayan yüksek kaliteli görüntülere sahip olabilirsiniz.