Bu bölüm birkaç önemli Web grafiği sorununu anlamanızı sağlar. Bildiğiniz gibi, Web grafikleri yazdırılan grafiklere oldukça benziyor, ancak Web’de grafik oluştururken ve kullanırken Web’e özgü bazı faktörler ortaya çıkıyor. Özellikle, çevrimiçi grafikler renk sınırlamalarını, dosya formatlarını ve dosya boyutlarını ve ayrıca saydamlık, indirme ve animasyon sorunlarını dikkate almanızı gerektirir. Renkler, dosya türleri ve dosya boyutları olmak üzere üç ana etken hakkında farkındalık kazanmak, Web sayfalarınızdaki grafikleri kullanmaya başlamanızı sağlar ve daha fazla grafik çalışması için bir atlama noktası sağlar. Bu nedenle, buradaki genel saldırı planı, Web grafiklerini kullanma, toplama ve oluşturma konusunda daha yaratıcı (ve eğlenceli) umutlara açılmadan önce bazı Web grafikleri temellerini bir kranya köşesine sıkıştırmaktır. Grafiklerin rengini nasıl gösterdiğine bakarak başlayalım.
Renk kavramını anlamadan önce, rengin iki ana bölümünü yani piksel ve paletleri bilmeliyiz.
Piksel
Her şeyden önce, her çevrimiçi grafik, bir görüntü oluşturmak için birlikte çalışan bir grup küçük renkli karelerden oluşur. Bir şekilde, çevrimiçi grafikler denilen bir resim tekniğini taklit eder. Pointilizm. Fransız ressam Georges Seurat’ın (1859-1891) tanıttığı Pointillism, her seferinde bir nokta (veya küçük bir fırça darbesi) resim yapma sanatıdır. Pointilizm sayesinde Seurat, tuvalindeki her görüntüyü küçük renkli noktalara böldü. Bir pointillist resme yakından baktığınızda, her noktayı görebilirsiniz. Resimden uzaklaştıkça, noktalar bir resim oluşturmak için bir araya gelirler. Bilgisayarlar, resimleri nokta boyası yerine benzer bir teknik kullanarak görüntüler; ancak bunlar, boyalı noktalar yerine, resimleri piksel olarak adlandırılan renkli karelere böler. Örneğin, Şekil 1’deki kirazlara bakın. Şekil 1, ekranınızda görüntülenen herhangi bir grafik olabilir. Gördüğünüz gibi, grafik diğer çevrimiçi resimlerin çoğuna benziyor (veya bunun için basılı materyalin içinde) ve hiçbir belirgin nokta, kare veya piksel işareti bulunmuyor.
Şimdi grafiğe biraz daha yakından bakalım. Bu Derste, bu resmi Jasc Paint Shop Pro, Adobe Photoshop veya Microsoft Paint gibi uygulamalarla düzenleyebilirsiniz. Daha sonra görüntüyü çarpıcı şekilde büyütürseniz, resmi oluşturan kareleri (piksel) göreceksiniz, Şekil 2’de gösterildiği gibi. Monitörünüzdeki kirazları büyütürseniz, göreceksiniz ki ‘nin renkleri ve tonları pikselden piksele veya kareden kareye değişir. Sisteminizde bir grafik düzenleme uygulamanız yoksa veya popüler bir “servis hizmeti” düzenleme uygulaması test sürüşü yapmak istiyorsanız, www. .jasc.com ve Paint Shop Pro’nun ücretsiz deneme sürümünü indirin. Bu derste daha sonra grafik düzenleme uygulamaları hakkında söyleyecek daha çok şeyimiz var.
Palet
Artık pikselleri bildiğinize göre, paletler hakkında biraz konuşabiliriz. Bir palet sadece bir grafikte kullanılan renklerin tablosudur. Bazı Web grafikleri (diğer bir deyişle, bir sonraki bölümde açıklandığı gibi GIF dosya formatı kullanılarak kaydedilen grafikler) sınırlı bir renk koleksiyonu kullanır. Bir görüntüye bir palet atayabilir veya bir Görüntü oluşturup düzenlerken grafik programınızın otomatik olarak bir palet oluşturmasına izin verebilirsiniz. Bir GIF paleti, 256 renge kadar tutabilir, ancak birçok görüntü bundan daha az renk kullanır. Örneğin web tasarımı nasıl yapılır, Şekil 3’e bakıldığında, kiraz grafiği 8 renk ve acı biber grafiği 128 renk kullanır. Resimlerin boyutlarına dikkat edin – kiraz grafiği 3 KB (çok küçük) ve acı biber grafiği 7 KB (neredeyse kiraz GIF grafiği kadar küçük).
Kiraz grafiğinin paleti 8 renk, acı biber grafiğinin paleti 128 renk içerir. Genel olarak, çoğu grafik uygulaması GIF grafik paletinde bulunan renkleri görüntülemenizi sağlar. Ayrıca, resim paletindeki renk sayısını azaltarak veya sınırlandırarak bir GIF görüntüsünün boyutunu azaltabilirsiniz. Ve muhtemelen bildiğiniz gibi, daha küçük dosya boyutları Web’de daha hızlı indirme sürelerine eşittir.
Bunu dene!
Jasc Paint Shop Pro, Adobe Photoshop veya Microsoft Paint gibi bir grafik düzenleme uygulamasında cherries.gif veya fire brea.g.gif dosyasını bulun ve grafiklerden birini açın. Resim paletini Paint Shop Pro’da görüntülemek için Renkler menüsünden Paleti Düzenle’yi seçin. Photoshop’ta, Görüntü menüsünden Mod’u seçin ve sonra Renk Tablosu’nu seçin. (Her grafik paketinin kendine ait menü seçeneklerinin olduğunu biliyoruz; size grafik uygulamanızda bakmanız gereken komut türü hakkında bir fikir vermesi için önceki iki komutu veriyoruz.) GIF resimlerini kullanın. Henüz GIF tanımlamamış olduğumuzu veya bu konuda herhangi bir Web dostu resim formatını tanımadığımızı fark ediyoruz. Şimdi piksellerin ve paletlerin doğası hakkında bir fikir edindiğinize göre, web üzerinde kullanabileceğiniz grafik dosya formatlarını izleyelim ve tartışalım. Bu derste daha sonra GIF’leri tartıştığımızda paletler hakkında daha fazla konuşacağız.
Web Tasarımı 