PhotoShop etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
PhotoShop etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

8 Haziran 2008 Pazar

Save for web (Quality)

Save for web seçeneğinin sunduğu başka bir ayrıntı...

Resminizin bir bölümünü farklı oranda sıkıştırmanıza yarar. Bunun için, üstteki örnekte gördüğünüz gibi bir alfa kanalı hazırlamış olmanız gerekir. Seçtiğiniz alanı Feather verdikten sonra kayderedseniz, yumuşak bir geçiş olacaktır.


Resim 1
11 K

Resim 2
7 K

Resim 1'de herhangi bir seçim yapılmadan, doğrudan jpg olarak kaydedildi. (quality:60)


Resim 1

Resim 2'de ise, quality'nin yanındaki bölüme tıklayın ve orada yaptığınız alfa kanalını tanıtın...

Resim 2

Save for web (Dither, Matte)

Save for web seçeneğinin sunduğu diğer ayrıntılara göz atalım...

Gölge yaptığınız resimler aynı zamanda tranasparan olacaksa yaşanan bir sorun vardır. Resim:1 beyaz zemin üzerinde sorunsuz görünüyor ama Resim:2 deki gibi, zemin üzerindeki görüntüsü çok kötü...


Resim: 1

Resim: 2

Kullanacağımız zemin rengini, photoshopta ayrı bir layer olarak da hazırlayabilirsiniz ama bundan daha pratik bir yolu, kaydederken zemin rengini vermeniz...

Aşağıdaki örnekte matte olarak FFCC33 kullanıldı, yanda gölgenin altında aynı rengin oluştuğunu görüyorsunuz..

FFCC00 olmasına karar verdiğim zemin için hazırladığım örnekler aşağıda...
Resim:3 hazırladığım örnek... Onu beyaz zemin üzerinde kullanmayacağım için olması gereken zeminin üzerine koyuyorum.. (Resim:4)


Resim: 3

Resim: 4

Gölgede ilginçlik yapmak için denenebilecek bir şey var... Diffusion, Pattern ve Noise seçenekleri arasından noise ile yaptığım örnek...(Resim 5) Matte yine seçili..


Resim 5

Bu tür hazırladığınız resimleri farklı zeminler üzerinde de sorunsuz olarak kullanabildiğinizi görüyorsunuz.. (Resim 6 ve resim 7)


Resim 6

Resim 7

Save for web (gif - jpg)

Resimleri webde kullanmak için optimize etmek gerekir, yani olabilecek en küçük dosya boyutuna getirmek... Bunun için en pratik yol, save for web seçeneğini kullanmak... Resmin özelliğine göre neler yapmanız gerektiğini diğer derslerde anlatmaya çalıştım. Burada, farklı optimize biçimlerinin resimleri nasıl etkilendiğini bir arada görmeniz için farklı tip resimleri bir araya getirip, örnekler hazırladım.


Gif

Gif seçeneği seçerseniz, yukarıda pencere açılacaktır. Farklı seçeneklerden seçtiklerinize göre resimlerin görüntüsü aşagıdaki gibidir.

Degrade olan (bir renkten diğerine geçiş) resimlerde gif seçeneğinin iyi sonuç vermediğini görebilirsiniz. Çizgisel resimlerde ve ekran resimlerinde ise en iyi sonucu gif'le alırsınız... Aşağıdaki örnekler, sırasıyla 64, 125 ,256 renk seçenekleriyle hazırlanmıştır.

Resim 1
Gif (64)
19 K

Resim 2
Gif (128)
25 K


Resim 3
Gif (256)
31 K


Jpeg

Jpeg seçeneği seçerseniz, yukarıda pencere açılacaktır. Farklı seçeneklerden seçtiklerinize göre resimlerin görüntüsü aşagıdaki gibidir.

Sıkıştırma çoksa resmin bozulma oranı doğal olarak daha fazladır. Çizgisel resimlerde bu bozulma daha belirgin görülür.

Genel olarak 50 sıkıştırma işi görecek bir sonuç verebilir.. Hem resim çok bozulmaz hem de makul bir dosya büyüklüğü elde edersiniz...

Resim 4
Jpg (Low - 10)
11 K

Resim 5
Jpg (Medium - 30)
16 K

Resim 6
Jpg (High - 60)
28 K

PNG

Web için tasarlanmış yeni bir formattır. Gif gibi 256 renkle sınırlı olmayan, Jpeg gibi sıkıştırma oranı arttıkça kalite kayıpları oluşmayan bu format, aynı zamanda kademeli olarak görüntünün oluşması özelliğine de sahiptir.

PNG, kayıpsız bir filtreleme ile, tüm renk bilgileri ve tüm alfa kanallarını koruyarak sıkıştırmayı gerçekleştirdiği için, eski sürüm web tarayıcıları tarafından desteklenmeyecek olmasına rağmen geleceğin formatı olarak görülmektedir. Bildiğiniz gibi, GIF 256 renkten fazlasını desteklemez, JPEG ise alfa kanallarına izin vermez.

PNG
155x185 piksel / 83 KB
Adaptive
GIF
155x185 piksel / 36 KB
Adaptive

JPEG/Farklı seçeneklerin sonuçları

RGB bir resmin farklı sıkıştırma oranlarında (Baseline Optimized)
JPEG'e çevrilmiş görüntüleri


RGB / 8 bits
Image options: 10
49 KB


RGB / 8 bits
Image options: 8
25 KB


RGB / 8 bits
Image options: 6
17 KB


RGB / 8 bits
Image options: 4
15 KB


RGB / 8 bits
Image options: 2
13 KB

RGB / 8 bits
Image options: 0
11 KB

JPEG/Kaydetme ve özellikler

Joint Photographic Expert Groups

JPEG renk geçişlerinin önemli olduğu resimlerde, renk kalitesinin ne kadar azalacağına kullanıcının karar vereceği sıkıştırma seçenekleri sunan bir formatıdır.

Sıkıştırırken, resimdeki piksellerin renk bilgisini, piksellerin adresini kaydeder ve seçilen sıkıştırma oranını göre, benzer renkteki pikselleri aynı renge çevirir. JPEG, resimde sıkıştıracağı pikselleri bulmak için, resmi sol üst köşeden sağ alt köşeye doğru diyagonal biçimde tarar. 5/1 den 15/1 e kadar oranlarda sıkıştırma uygulanabilir.

JPEG kaydetme:

RGB resimleri JPEG kaydedebilirsiniz. Indexed Color modundaki resimler JPEG kaydedilemezler. Ayrıca resimde alfa kanallarının bulunmaması gerekir. Layer'lı dökümanlar da JPEG kaydedilemezler.

Benzer renkteki pikseller sıkıştırma sırasında aynı renge dönüşeceği için resimin boyutlarında önemli derecede azalma olur. Bu aynı zamanda, piksellerin yok olması anlamına da geldiği için, orjinali önemli resimlerin bir yedeğinin kullanılması tavsiye edilir. Baseline Optimized seçeneği, en iyi sonucu vermektedir. Resmin kademeli oluşması için progressive seçeneği kullanılır. Netleşmenin 3, 4 ya da 5 adımda mı oluşacağını belirleyebilirsiniz. Bütün tarayıcıların desteklemediği bu seçenek daha fazla dosya büyüklüğüne neden olur.

RGB / 8 bits
Image options: 10
Baseline optimized
39 KB
RGB / 8 bits
Image options: 10
Baseline standard
43 KB
RGB / 8 bits
Image options: 10
Progressive (Scans-3)
12 KB

JPEG'i çekici kılan özellikler:

GIF'in sadece 256 rengi desteklediği düşünülürse, milyonlarca renk içeren fotografik görüntüler için JPEG'in önemi kendiliğinden ortaya çıkar. Görüntü kalitesinin denetlenebilmesi de ayrı bir avantajdır.

JPEG'in tercih edileceği resimler:

Geniş alanlar halinde tek rengin bulunmadığı, detayları fazla tüm fotografik görüntüler için kullanılabilir.

GIF/Custom

Custom seçeneği, kendi renk paletinizi oluşturmanıza olanak sağlar. Bu özellikten yararlanarak, sitenizde yalnızca 2 renk kullanarak, farklı bir atmosfer yaratabilirsiniz.

Resminizi Indexed Color Moduna cevirdikten sonra, İmage / Mode / Color Table bölümüne ulaşın.

Farklı renk ve formatlardaki resimler

Custom ile özel bir renk paleti kullanmanın sonuçları