Blogger ve Picasa Üzerinde Resim Düzenleme İpuçları

Bloggerdan bir blog açtığımızda otomatik olarak açtığımız blogun adında Picasa hesabımızda bir albüm oluşturulur. Blogumuza yüklediğimiz her resim bu Picasa albümünde yer alır. Picasa üyeliği almak için herhangi bir çabaya gerek yok çünkü Google hesabı olan herkes Picasa Web hizmetlerini kullanabilmektedir.

Blogumuza bir resim yüklediğimizde aşağıdaki bir kod dizisi ve bir resim ile karşılaşırız.

lamborghini gallardo 2013 makyaji ile geliyor
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-sAL08-TuuFw/UIF_f0JF1rI/AAAAAAAAIEM/cPMMNESJsjI/s1600/lamborghini-gallardo-2013-makyaji-ile-geliyor.jpg" imageanchor="1" style="clear:left; float:left;margin-right:1em; margin-bottom:1em"><img border="0" height="408" width="544" src="http://4.bp.blogspot.com/-sAL08-TuuFw/UIF_f0JF1rI/AAAAAAAAIEM/cPMMNESJsjI/s544/lamborghini-gallardo-2013-makyaji-ile-geliyor.jpg" /></a></div>

Şimdi buradaki terimlerin ne anlama geldiğini öğrenelim. Kırmızı renkte belirttiğim kısım resmimi çerçeve içine alan css elementinin değerlerinin bulunduğu bölüm. Mavi ile renklendirdiğim kısım resme tıklayınca hangi bağlantıya gidileceğini belirliyor. Mavi alanın içinde kalın yazı tipiyle belirttiğim yer ise resmin orta da mı?, solda mı? yoksa sağda mı yer aldığını belirtiyor. Benim yüklediğim resim şu an sola dayalı biçimde. Turuncu ile renklendirdiğim alan ise resmin bulunduğu alan. Turuncu alanın içinde sadece kalın yazı tipiyle belirttiğim yer resmin yükseklik (height) ve genişlik (width) değerini belirtiyor. Son olarak Turuncu alanın içinde yer alan kalın ve italik yazı tipiyle belirttiğim kısım ise Picasa’ya ait bir değer. Bunun ne anlama geldiğini ayrı bir başlık altında anlatmak daha doğru olur.

Yükseklik ve Genişlik Ayarlamaları

s544 yazan kısım şunu ifade ediyor; Resmin boyutu ne olursa olsun genişliği 544 pixel değerinde. 544 yapmamın sebebi yazı alanının genişliğinin 544pixel olması. Daha büyük resimler yükleyip boyutunu 544 ayarlamak yerine resmi 544px genişliğe uydurmak daha mantıklı ve hız açısında olumlu bir hareket. Resmin orjinal boyutunda çıkmasını istiyorsak yapmamız gerekn tek şey s544 yazan kısmı s1600 yapmak. Resim 100px boyutta olsa bile s1600 yaptığımızda orjinal boyutunda yani 100px genişlikte çıkacaktır. Fakat 2000px genişliğinde bir resim yüklersek resmin boyutu 1600px genişliğe ayak uyduracak şekilde en boy oranı bozulmadan küçültülür.

Resmi Yeniden Boyutlandırma

Resmi yeniden boyutlandırmak için yapmamız gereken şey çok basit. Blogger’a bir resim yüklediğimizde otomatik olarak yukarıda belirttiğim s544 yazan kısım 1600px değerinde oluyor. Buraya istediğimiz değeri girebiliriz. Mesela yukardaki Lamborghini Gallardo marka aracın genişliği normalde 1024×768 boyutunda. Bir de yukardaki resimle aynı olan aşağıdaki resme bakın.

Gördüğünüz gibi genişlik 333px değerine ayarlandı ve yükseklik ona göre oranlandı.

Resim Kırpma Ayarları

Boyutlandırma özelliği dışında benim en beğendiğim özelliklerden biri olan kırpma özelliği yer alıyor. “Bunu nerede kullanabilirim?” derseniz şöyle söyleyeyim. Mesela benim blogun ana sayfasındaki önizleme resimleri 150×150 boyutunda. Fakat ben resme sadece s150 yaparsam resim tam kare değilse resimde bozulmalar meydana gelecektir.

Ek Bilgi: Ana sayfadaki önizleme resminin yazıda değil de sadece ana sayfada görünmesini istiyorsanız Blogger Öne Çıkan Resim Ekleme Yöntemi adlı makalemi okuyunuz.

Bunun için yapmamız gereken tek şey en yukardaki resimde s544 ile belirttiğim değer yerine s150-c şeklinde yeni bir değer girmek. Böylece resminiz tam ortadan 150×150 boyutunda kırpılmış olacak. Hemen bir örnekle görelim. İlk resim s150 değeri verdiğim resim. İkinci resim 150×150 boyutunda kırpılmış resim.

Burada fark edilmiyor ama resmin yüksekliğini sınırlayan bir değer olursa resimde kayma meydana gelir Burada resmi sınırlayan bir şey olmadığı için resim bozulmadan çıktı. Şimdi kırpılmış haline bakalım.

Resmin orjinali tam kare olmadığı halde tek bir değer değiştirerek resmi tam kare haline getirdik.

Bonus İpuçları

Yazımı buraya kadar okuduğunuzu varsayarak siz değerli okuyucularımla iki adet bonus ipucu daha paylaşıyorum.

Eğer yukarda s544 ile belirttiğim değerin yanında sadece -d değeri girip değeri s544-d haline getirirseniz bakın ne oluyor. Aşağıdaki linke tıklayın.

http://4.bp.blogspot.com/-sAL08-TuuFw/UIF_f0JF1rI/AAAAAAAAIEM/cPMMNESJsjI/s544-d/lamborghini-gallardo-2013-makyaji-ile-geliyor.jpg

Kırpma özelliğinden sonra en sevdiğim özellik. Bunu video paylaştığınız yazılarınızda kullanabilirsiniz. Aynı şekilde s544 ile belirttiğim değerin yanına -o ekleyip s544-o haline getirirseniz aşağıdaki gibi bir sonuç alırsınız.

Blogcular için faydalı bir bilgi olduğunu düşünüyorum. Umarım bir yerde lâzım olduğunda burada okuduğunuz bilgileri kullanırsınız.

Blogger ve Picasa Üzerinde Resim Düzenleme İpuçları

Furkan Özden

Blog dünyası ile 2009 yılında tanıştım. Bloğumda haftada en az bir yazı yayımlıyorum. Yazdığım yazıları beğendiyseniz beni Twitter'dan (@frknzdn) takip edebilirsiniz. Daha fazlası için hakkımda sayfasını ziyaret edin.

2 Cevaplar

  1. ehl-i blog dedi ki:

    teşekkürler faydalı bilgiler için.

  2. Alper Sağlam dedi ki:

    Merhaba,
    Örnek verecek olursak; 720×540 boyutlarında 230 KB olarak küçültülmüş resmimi yayın içinde yüklediğimde html kısmında şu şekilde bir yansıması oluyor:
    a href=”blablabla/s1600/aaa.jpg”
    src=”blablabla/s1600/aaa.jpg” height=”179″ title=”Heureux Anniversaire” width=”320″

    Şimdi burada height 179 width 320 gözüküyor. Yüklediğim resmin ebatları ise bundan çok fazla. İşin mantığını kavramaya çalışıyorum. Yükleme yaptıktan sonra bu değerleri nasıl değiştirmemiz gerekli ve mantığı nedir? Ayrıca iki farklı yerde s1600 var; kimisi demiş ki o s1600’ü düşürmeniz daha iyi olur misal s400, s800 falan yapabilirsiniz demiş ama iki tane var hangisini yapalım ya da s’in yanında ki rakamları değiştirdik tamam peki o zaman bu height, width değerleri ne olacak? Yani onca yerde karman çorman o kadar bilgi var ki tam aradığım şeye yakın bir bilgi sizin yazınızda buldum fakat bu sefer de tam anlamıyla çözemedim işi.. kusuruma bakmayın lütfen. Bu konularda bir detaylı açıklama ile yardımcı olabilir misiniz?

Bir Cevap Yazın

Bunlar da hoşunuza gidebilir...

%d blogcu bunu beğendi: