Grafik Bölümü
Resim ve animasyon gibi çoklu ortam öğeleri, başllangıçta yalnızca bilimsel amaçlar için kullanılan interneti, basın-yayın ortamına dönüştürdü. Günümüzde, kalitesi yüksek resim dosyalarını, düşük yükleme süreleriyle birleştirebilen veri sanatçıları revaçta. Bu yazıda profesyonel web tasarımı için altı ipucu ve yardımcı araçları bulacaksınız.
Web sayfası tasarımında, genellikle çok sayıda noktanın bir araya getirilmesiyle oluşturulan bitmap grafiklerin kullanımı gündeme gelir. Bu türden resimler, mercek altına alındığında noktaları (ing. Pixel) kolaylıkla ayırt edilebildiğinden, her biri üzerinde ayrı ayrı çalışmak mümkündür. Bitmap çözünürlüğü, dpi (dots per inch) birimiyle ifade edilir. Bilgisayar ekranlarının çoğunda 72 dpi fiziksel çözünürlük üst sınırı aşılamadığından, bu değer web grafiklerinin boyutlandırma normu olarak görülmektedir. Diğer resim türü, noktalar yerine renk alanlarından oluşan vektör grafikleridir. Ölçekleri, uzatılarak ya da bastırılarak değiştirilebilir.
Vektör grafikleri, web kullanımının inanılmaz boyutlara varmasından önce var olduysa da, Shockwave teknolojisinin (Flash) devreye girmesiyle birlikte saygınlık kazanmıştır. Bu tür, yine de diğer web kullanımları için uygunluk göstermez. Resim dosyaları farklı dosya biçimlerinde bulunabilir.
BMP (Windows Bitmap) veya TIF (Tagged Image File Format) en sık karşılaşılan grafik uzantılarıdır. Tasarımcılar, web için GIF (Grafics Interchange Format) ve JPG veya JPEGi ( Joint Photographic Experts Group) daha sık tercih ederler. Web grafikleri konusunda diğer bir alternatif, giderek daha geniş kullanım alanı bulan PNG (Portable Network Graphics) dosya biçimidir.
Bu format, GIF ve JPG dosyalarının Düflük renk derinliğine sahip resimler için GIF biçimi GIF dosya biçimi, programcılar tarafından özellikle World Wide Web kullanımı için geliştirilmiştir. GIF, web tasarımcılarının en fazla 256 renk kullanabilmesine izin verdiğinden, düşük çözünürlükteki resimler için idealdir ve bu yüzden özellikle düğme, logo ve reklam bantları gibi yönlendirme öğelerinin şekillendirilmesi sırasında faydalanılır. GIF biçimindeki resimleri, renk sayısını azaltma yoluna giderek, küçültmek ve yüklenme süresini iyileştirmek mümkün. Sınırlandırılmış renk derinliği nedeniyle webde fotoğraf yayını için elverişsiz formatın web tasarımcılarının gözündeki en cazip yanı saydamlık, interlacing ve animasyon imkanı.
Saydamlık: GIF biçimi, herhangi bir rengin, genellikle de seçilen arka planın saydam olarak tanımlanabilmesini sağlayabilir. Saydam alanlar, web browser üzerinde o anki web sayfasının arka planını görülebilir kılar. Bu yolla, istediğiniz her internet sayfasına rahatlıkla ekleyebileceğiniz düğme ve logolar oluşturabilirsiniz.
Interlacing: Resim dosyalarıInterlacing: Resim dosyaları browserda yüklenmeleri esnasında satır satır oluşturulur. Söz konusu resim dosyası ne kadar büyükse, izleyicisi, resmi tümüyle anlayabilmek için o kadar uzun süre beklemek durumundadır. Interlacing özelliğinin etkinleştirilmesi sayesinde, bir GIF resminin browser tarafından öncelikle net olmayan hatlarla görüntülenmesini sağlanır ve böylelikle sorun ortadan kalkar. Resmin netliği, dosya yüklenirken artmaya devam eder. Bu şekilde izleyici resmin içeriği hakkında çok önceden bilgi sahibi olur ve fazla vakit kaybetmek durumunda kalmaz.
Animasyon: GIF dosya biçimindeki resimler, animasyon oluşturmada kullanılabilir. Bu amaçla, gerekli sayıda resim hazırlanarak uygun bir araçla tek bir GIF dosyasında bir araya getirilir. Hareketlendirilmiş GIF dosyalarının gösterimi sırasında, resimler önceden belirlenen bir hızla birbiri ardına değiştirilerek gösterilir ve resmi gören için animasyon etkisi oluşturulur.
16.7 milyon renk: JPG türünde resimler JPG formatındaki resimler 16.7 milyon renk derinliğini destekler. Bu nedenle bu dosya biçimi fotoğrafların ve de 256 rengin üzerindeki diğer resimlerin gösterimi için mükemmel bir uygum sergiler. JPG biçimindeki bir resim dosyası, sıkıştırma yoluyla küçültülebilir ve bu yolla web sayfasının yüklenme süresi iyileştirilebilir.
PNG: Yüksek renk derinliğine sahip resimler için Web kullanımı için uygun bir diğer grafik formatı ise PNGdir. Bitmap resimlerin internette transferi için özel olarak geliştirilmiştir. PNG formatı, saydam alanlar da içeren yüksek renk derinliğine sahip resimler için uygun görülüyor. Resim dosyasının sıkıştırılması kalite kaybı yaşanmadan gerçekleştirilebiliyor ve resimler bu yolla netlik kaybına uğramı-yor. Ancak sadece dördüncü nesil browserlar PNG biçimindeki resimleri doğru olarak işleyip görüntüleyebiliyor. Bu yüzden en azından şimdilik bu formatı webde kullanırken dikkatli olmalısınız.Web grafiklerinin renk paletini ve resim kalitesini belirlemek İnternette kullanımınıza sunulan resim dosyalarının kalitesi, farklı etkenlere bağlı olarak değişir. Görüntülenen renkler, kullanılan grafik biçiminin dışında, işletim sistemi ve web-browser ayarlarından olduğu kadar, monitör ve ekran kartının değerlerinden de etkilenir. Tüm bu etkenler, resim dosyasının gösterimini hissedilir ölçülerde değiştirme gücüne sahiptir. Web grafiğinde kullanılan renk paleti, en önemli faktörlerden biri olarak görülür.
Kullanıcıların herhangi bir resim dosyasını çağırmaları halinde, browser resmin gösterimi için kendi dahili renk paletine başvurur. Internet Explorer prensipte renkleri Netscape Navigatordan farklı bir biçimde bir araya getirir. Yani Internet Explorer, Windows renklerinin paletine başvururken, Netscape Navigator kendi dahili renk tablosundaki renk kombinasyonlarından yardım alır. Browser, kendi dahili renk paletinde yer almayan bir rengi yorumlamak durumunda kaldığında, benzer bir renk seçer ve iki farklı renk tonunu birbirine karıştırarak yeni ve benzer bir renk elde eder. Renklerin karıştırılması Dithering olarak da adlandırılır ve gerçekte istenmeyen bir etkidir. Kuşkusuz web tasarımcısının resim şekillendirme sırasında kontrolü kaybetmemesini sağlayan bir çözüm bulunuyor... Bu durumda kesin olarak tanımlanabilecek 216 renkten oluşan ve kayıtlarının her güncel web browser tarafından eşit bir şekilde yorumlanacağı bir renk paleti kullanılır. Grafik şekillendirme sırasında bu paleti tercih etmeniz durumunda, sayfanızın görüntülenme garantisi sağlanır.
Web sayfanız için ücretsiz resim ve grafikler
Başka hiçbir öğe, bir web sayfasının tasarımına uygun yerleştirilmiş şık bir grafik ya da resim kadar güzel etki bırakamaz. Grafiksel eklentilerden mahrum bırakılmış metin alanları, pek çok sörfçü tarafından hoş karşılanmayacaktır. Ancak uygun resim veya grafik materyalinin nereden temin edilebileceği sorusu, hiçbir tasarımcı için gündemden düşmez. Kendi sitesini tasarlayan amatör kullanıcılar veya webmasterlar, gerekli öğeleri kendi başına oluşturabilecek kadar yetenekli bir tasarımcı olmayabilirler. Firmalar bu iş için genellikle grafiker, fotoğrafçı ve resim editörlerini görevlendirirken, aynı yöntem özel kişisel web sayfaları için yüksek maliyet nedeniyle alternatif olmaktan çıkar. Birazdan resim ve grafik temin edebileceğiniz adreslerin listesine ulaşacaksınız.
Söz konusu kaynakların sunduğu içeriğin tamamına yakınını kişisel web sayfanızın şekillendirmesi amacıyla ücret ödemeden kullanabilirsiniz. Dijital kamera veya tarayıcı resimlerini çoğu kez hemen web sayfanıza yerleştiremezsiniz. Bu materyal, öncelikle bir grafik işlem programı vasıtasıyla uygun formata dönüştürülmelidir.
Tarayıcı sayesinde, resim, grafik ya da diğer şablonlar basılı kağıt üzerinden PCye aktarılabilir ve bilgisayarda yeniden biçimlendirilir. Bu işi görecek nitelikte bir tarayıcının maliyeti markasına ve özelliklerine göre 50 dolar ile 200 dolar arasında değişir. Giderek daha da ucuzlayan dijital kameralar vasıtasıyla görüntü karelerini sadece yakalamakla kalmaz, onları aynı zamanda doğrudan fotoğraf makinesinden PCye aktarabilirsiniz. Üstelik genellikle dosya biçimini bile değiştirmeniz gerekmez. Bu tarz dijital kameralarla web sayfanız için resimler oluşturabilirsiniz. Kameraların fiyatları 200 ile 300 dolar civarında değişiyor. Resim negatifi ve diaları, fotoğrafçılarda yüksek kalitede CDye yazdırabilir ve ardından bilgisayara aktarabilirsiniz. Kitapçılarda, alışveriş merkezlerinde, PC mağazalarında ve online shoplarda çok sayıda fotoğraf, grafik ve simge içeren, çoğu kez Clip-Art Collection adıyla anılan uygun fiyatlı CD-ROMlar bulmak mümkün. Buradaki resimleri kendi web sayfalarınız için dilediğiniz gibi kullanabilirsiniz. Pek çok uygulama Clipart koleksiyonuyla birlikte gelir. Program CDlerine veya sabitdiskinizdeki program klasörlerine bakarak, ClipArt, Images, Bitmaps veya benzer isimli klasörlerin izini sürün. Microsoft Office paketiyle çalışıyorsanız ve orijinal CD-ROM elinizin altındaysa ClipArts klasörüne bakmanız yeterli
olacaktır. Her türden resim ve grafik için bir diğer kaynak da elbette webin kendisidir. Uygun resim materyalini bulmayı sağlayacak aramadan daha yakın pek az imkana sahibiz. İstediğiniz resmi internetten kendi kişisel bilgisayarınıza indirmek için sağ fare tuşuna tıklamak ve Resmi farklı kaydet komutunu seçmek yeterli. Pek çok arama motoru clipartlar için özel bölüm veya arşivlere sahip, diğerleriyse ClipArt veya GIF aramalarıyla isabetli sonuçlar elde edilmesini sağlıyorlar.
www.clip-art.com
www.freegraphics.com
www.clipartconnection.com
www.clipartcastle.com
Resim işleme için araç ve uygulamalar
Resim ve grafiklerin web kullanımına hazır hale gelmesi için, değiştirilmesi ve üzerinde çalışılması gerek. Bu nedenle grafik ve resim işlemede kullanabileceğiniz, çeşitli hizmetler sunan bazı yazılımları tanıtıyoruz. Bu programlar web editörleriyle birlikte web tasarımcıları için en önemli araçlar arasında yer alıyor.
--- --- ---
Paintshop Pro 7.0: Paintshop Pro, grafik ve resimleri küçük sanat eserlerine dönüştürebilmek için gereken tüm araçları sunuyor. Özellikle web grafikleri konusunda fark edilir sonuçlara çok hızlı şekilde erişilebiliyor. Dahili animation shop-araçları sayesinde kısa sürede istenen GIF, banner veya metin animasyonlarını elde edebilirsiniz. Fiyat-performans değerinin uygunluğu, programı düşük bütçeli web tasarımcılar için son derece elverişli kılıyor.
Bilgi için: www.jasc.com
--- --- ---
Phootshop 8 CS: Photoshop yazılımının, profesyonel çizgisi övgüye değer. Program web grafiklerinin değiştirilmesinde kullanılabilecek çok yönlü araçlar sunuyor. Photoshop hem vektör hem de bitmap grafikler konusunda hiçbir ihtiyacı karşılıksız bırakmıyor. Ama bu kez performansın bedeli bir hayli yüksek.
Bilgi için: www.adobe.com
--- --- ---
Fireworks MX: Fireworks, tasarım ve geliştirme arasındaki boşluğu örnek şekilde doldurmayı başarıyor. Yazılım, çok yönlü bitmap ve vektör araçları sayesinde, web grafiklerinin oluşturulmasını, işlenmesini ve hareketlendirilmesini sağlıyor. Resimlerinizi iyileştirebilir ve istenen HTML editörüne aktarabilirsiniz. Fireworks profesyonel istekleri hedef alan ama daha az tecrübe sahibi kullanıcıları da kolaylıkla net sonuçlara götürebilen performans özellikleri sergiliyor.
Bilgi için: www.macromedia.com
--- --- ---
Corel Draw 11: Corel Draw 11 Graphics, Suite Corelın şimdiye kadarki en yüksek performansı sağlayan paketi. Sayfa tasarımı, illüstrasyon, resim işleme ve vektör animasyonları için çeşitli araçlara sahip. Bitmap grafiklerin oluşturulması ve işlenmesi için PhotoPaint yazılımıyla birlikte geliyor. Web tasarımcılar bu programla hem profesyonel kullanım hem de ev kullanımı için gereken araçlarla donatılmış olacaklardır.
Bilgi için: www.corel.com
--- --- ---