Arka plan rengi yeterli önemli unsur herhangi bir web sayfası. Birincisi sitenin istenilen havasını ve genel havasını belirler, ikincisi metnin algılanmasını kolaylaştırır.
Bir web sayfasının arka plan rengi, etiketin bgcolor özelliği kullanılarak ayarlanır.
.Örnek 1: Arka plan rengini değiştirme
Renk, onaltılık bir değer olarak veya adına göre belirtilebilir.
Arka plan için herhangi bir renk belirtebilmenize rağmen çoğu site Beyaz arkaplan ve en köklü seçenek olarak siyah harfler.
Arka plan görüntüsü
Uygun herhangi bir resmi arka plan olarak kullanabilirsiniz. Arka plan dikkati metinden uzaklaştırmamalı ancak metinle iyi uyum sağlamalıdır. renk uyumu Web sayfalarının hızlı yüklenmesi için boyutları küçük olmalıdır. Yukarıdakilerin hepsinden sonra yine de sayfaya arka plan resmi eklemek istiyorsanız, etiketin arka plan özelliğini kullanmalısınız.
.Örnek 2: Duvar kağıdı ekleme
Eğer görüntü daha küçük beden monitör ekranı yatay ve dikey olarak çoğaltılacaktır.
Arka plan resmi arka plan rengine göre daha yavaş yüklendiğinden, resimler yüklenene kadar bir süre okunamayan metinlerle karşılaşabilirsiniz. Tarayıcıda resimler devre dışı bırakılırsa aynı şey olabilir. Bu nedenle, arka plan renginin her zaman arka plan resmiyle birlikte ayarlanması önerilir (örnek 3).
Örnek 3: Bir arka plan resmi ve arka plan rengi kullanma
Sabit arkaplan
Varsayılan olarak kaydırma çubuğunu kullandığınızda arka plan resmi web sayfasının içeriğiyle birlikte hareket eder. Internet Explorer, bgproperties ="fixed" etiketi özelliğini kullanarak arka planı düzeltmenize olanak tanır
.Örnek 4: Sabit bir arka plan ayarlama
Örnek 4'te gösterildiği gibi bgproperties özniteliğini belirleyerek web sayfasındaki arka plan görüntüsü sabit kalacak ancak metin, grafikler ve diğer öğeler kaydırma çubuğuyla birlikte hareket edecektir.
Arayüzünüz için kullanıcının gözünü yoracak renkler mi seçiyorsunuz?
Arka plan için parlak ve doygun bir renk kullanırsanız, kullanıcıların hayatını zorlaştırırsınız: sayfayı görüntülemeleri anında zorlaşır. Parlak, zengin renkler cezbetmek en büyük dikkat. Ancak bu kadar çok parlak renk varsa, retina üzerinde artan bir yük oluşturur ve gözlerinizi çok fazla zorlamanız gerekir.
Örneğin yukarıdaki görseldeki renk örneklerine bir göz atın. Sol sütun maksimum parlaklık ve doygunluğa sahip renklerden oluşur. Sağdaki sütun %80 parlaklık ve %80 doygunluktaki renklerden oluşur. Parlak, doygun renkler gözlerinizi çok yorduğundan sol sütunun toleransı sağdakinden daha düşük olacaktır.
Neden kullanılması gerektiği hakkında konuşalım parlak renkler Bir web sitesinin veya uygulamanın arka planı için buna değmez. Evet, bugün yeni çıkmış bir trend - parlaklığı sonuna kadar vermek. Ancak her zaman modayı takip etmek zorunda değilsiniz, özellikle de çılgınlık sınırındaysa veya ürününüzün kullanımına engel oluyorsa.
Teoriyle başlayalım.
Parlaklık Vs. Doyma
Parlaklık ve doygunluk farklı özellikler renkler. Birincisi belirli bir renkte ne kadar beyaz veya siyahın karıştırıldığı, ikincisi ise grinin miktarıdır.
Parlaklığın artması doygunluğun da azaldığı anlamına gelmez. Doygunluğu azalttığınızda rengi grinin bir tonuna dönüştürürsünüz. Parlaklığı artırdığınızda renk bileşeninin miktarını artırırsınız ancak rengi gri () yapmazsınız.
Arayüzünüzde kullanıcının gözünü yoracak bir renk mi kullanıyorsunuz?
Arka planınız için parlak ve doygun bir renk kullanırsanız kullanıcının sayfanızda geçirdiği süreyi azaltırsınız. Parlak ve zengin renkler çok dikkat çekiyor. Ancak bu tür renklerin kullanımı Büyük miktarlar kullanıcının gözlerini ciddi şekilde yorar.
Hangi konuşmacıya daha uzun süre bakabilirsin?
Örnek. Yukarıdaki görseldeki renklere yakından bakın.
Sol sütun maksimum parlaklığa ve doygunluğa sahip renkleri içerir. Sağ sütunda parlaklık ve doygunluk %80'e eşit olan renkler bulunur.
Parlak renkler gözler üzerinde çok fazla baskı oluşturduğundan, sol sütuna olan dikkatiniz sağ sütuna göre daha düşük olacaktır.
Parlaklık ve Doygunluk
Parlaklık ve Doygunluk farklı renk özellikleridir. İlk özellik, bir renge ne kadar beyaz veya siyah karıştırıldığını ifade eder. İkinci özellik ise rengin ne kadar gri içerdiğidir.
Parlaklığı artırarak doygunluğu azaltmazsınız. Doygunluğu düşürdüğünüzde rengi grinin bir tonuyla karıştırırsınız. Parlaklığı artırdığınızda rengi daha açık hale getirirsiniz ancak gri yapmazsınız.
Üst: artan parlaklık - daha fazla beyaz. Alt: Doygunluğun azaltılması - daha fazla gri
Rengin dikkat ve uyarılma üzerindeki etkisi
"Ton, Doygunluk ve Parlaklığın Etkisi" araştırmasının sonuçlarına göre en fazla doygunluk ve parlaklığa sahip renklerin ilgi çektiği tespit edildi. Bu çalışmanın yazarı, bu renk özelliklerinin dikkat çekmede tonlardan daha önemli olduğu sonucuna varmıştır.
Diğer iki çalışma - "Renk doygunluğunun uyandırıcı etkisi" ve "Renk ve duygu", doygun renklerin en büyük heyecan. Renk tonu aynı zamanda uyarılmayı da etkiler, ancak doygunluk ve parlaklık en güçlü etkiye sahiptir.
Düğmelerde parlak ve zengin renkler kullanın
Parlak ve doygun renkler kullanıcının dikkatini çeker ancak uzun süre tutmaz. Bu renkleri kullanmak kullanıcının yanında çığlık atmak gibidir. Sadece bir süreliğine onların dikkatini çekeceksiniz.
Bu nedenle, bu tür renkleri yalnızca kullanıcının işlem yapmasını gerektiren arayüz öğelerinde (örneğin düğmeler) kullanmalısınız. Bu renkler kullanıcının dikkatini kontrollere çekecek ve kontrollerin doğru zamanda bulunmasını kolaylaştıracaktır.
Sol: Arka plan parlak ve doygun. Bu nedenle tüm dikkat düğmeye değil arka plana verilir. Sağ: Düğme parlak ve doygun bir renk kullanır. Kullanıcının dikkatini çeker
Arka plan için koyu ve daha az doygun bir renk kullanın
Arka plan rengini daha koyu ve daha az doygun hale getirmek daha iyidir. Renk koyulaştıkça beyaz içerik azalır. Doygunluk azaldıkça gri miktarı artar.
Ortaya çıkan arka plan, kullanıcının dikkatini sayfadaki metinden veya içerikten uzaklaştırmayacaktır. Bu, kullanıcının sayfayı kolayca ve dikkati dağılmadan okumasını sağlar.
Sol: Gözler için rahatsız edici. Arka plan parlak ve zengindir. Soldaki resimde maksimum parlaklık ve doygunluk. Sağda: Gözleri yormaz. Arka plan karanlık ve daha az doygun. Parlaklık ve doygunluk daha düşük
En uygun arka plan rengini bulma
Arka plan renginiz için kullanabileceğiniz birçok parlaklık ve doygunluk oranı vardır. Renk örneklerinden oluşan bir ızgara oluşturmak, bulmanıza yardımcı olacaktır. en uygun renk arka plan için.
Öncelikle ana tonu seçin ve parlaklığını ve doygunluğunu maksimuma ayarlayın. Renk tonu değeri kaydedilir ve parlaklık ve doygunluğun ayarlanması için bir referans noktası görevi görür.
Daha düşük doygunluk ve parlaklık düzeylerine sahip dört yeni renk örneği oluşturmak için ana renk tonunu (renk örneğini) çoğaltın.
Oluşturulan iki renk örneğinin parlaklık düzeyini azaltın. Ve diğer iki numunenin doygunluğunu azaltın. Rengi ayarlarken onluk artışlar kullanın.
Doymuş renk örneklerini, Parlaklık ve Doygunluk %100'e ayarlanmış şekilde orijinal renk tonunun soluna yerleştirin. Sağ tarafa minimum ve maksimum parlaklığa sahip renk örneklerini yerleştirin.
Şimdi ikinci bir renk örneği sırası oluşturun. İlk renk sırasına göre parlaklığı ve doygunluğu azaltın. Değerleri azaltırken her renk örneği kümesi için aynı değeri kullanın.
Sonuç olarak ikinci sıradaki renklerin hiçbiri %100 doygunluğa ve parlaklığa sahip değildir. Bu, bu renklerin işte kullanıma en uygun olduğu anlamına gelir.
Sonuçlardan memnun değilseniz başka bir renk örneği dizisi oluşturmayı deneyebilirsiniz. Bunu yapmak için üçüncü düzeyde renk örnekleri oluşturun ve her birinin parlaklık ve doygunluk değerlerini azaltın.
Artık farklı parlaklık ve doygunluk oranlarına sahip toplam sekiz optimum renge sahipsiniz.
Bir web sitesinin arka planında kullanılacak iyi ve kötü renk örnekleri
Aşağıda göze hoş gelen ve hoş gelen sayfa örnekleri verilmiştir. Örnek sayfaların her birine ne kadar süreyle bakabileceğinize dikkat edin.
Solda kötü bir yeşil var (Panik veya Prizmik). Sağda güzel bir yeşil (
Tam renkli bir görüntünün kontur keskinliğinin düzeltilmesinin özellikleri
1. Ton ve Doygunluk
2. Kontur keskinliği
3. Otomatik düzeltme
Renkli arka plan ve doygunluk
Renk düzeltmeden sonra görüntüdeki bozulmaların ortadan kaldırılması veya en azından önemli ölçüde azaltılması gerekir. Ancak renk doygunluğu yeterli olmayabilir. Bu durumda doygunluk düzeltme yöntemini kullanmalısınız.
Bu yöntem grafik editörlerinde görüntü düzeltme olarak uygulanır. renk modeli HSL.
Bu bilgisayar renk modeli prensip olarak HSB'ye (HSV) benzer. Ancak ana parametreleri şunlardır: ton, hafiflik ve doygunluk. HSL renk modelini şekil olarak hayal edersek, çift (yansıyan) altıgen bir koni olacaktır. Temeli, HSB'ninki gibi temel renkler ve üst kısımlardır: Beyaz renk, doygunlukla kontrol edilir ve siyah, hafiflikle karakterize edilir. Bu nedenle, HSL renk modeli en çok kullanılanlardan biridir. parlak örnekler renk tonu, doygunluk ve parlaklık gibi sezgisel kavramlar.
Görüntüdeki veya seçilen alandaki renk doygunluğunun arttırılması, piksel renk formülünün S parametresinin değerinin arttırılmasıyla gerçekleştirilir.
HSL renk modelindeki görüntü düzeltme arayüzüne bir örnek
 |
Adobe Photoshop CS6 örneğini kullanarak doygunluğu ayarlama
Artırırken Renk doygunluğu Görüntünün görüntüleneceği cihazın renk gamının dışına çıkmamaya dikkat edilmelidir.
Normal renk doygunluğu
Renk gamının ötesine geçmek
Açıklığı ve renk doygunluğunu düzeltmek için görüntüyü HSL renk modeline dönüştürmek gerekli değildir ancak kontur keskinleştirme düzeltmesi yapmak faydalı olabilir.
Menü konumu Maske Maske
Filtrenin eylemi sonucunda keskin olmayan maskeleme meydana gelir; program görüntünün bir kopyasını yapar, önemli değişiklikler renkler ve tonlar (keskin geçiş, güçlü kontrast) ve kenarlarını keskinleştirir, bu da konturların keskinliğinin artmasına ("kenarlarda kontrast") yol açar ve kalan ("düz") alanları etkilemez. Bu keskin görüntüye dayanarak, keskin olmayan bir maske oluşturulur ve hafif bulanık orijinal görüntünün üzerine bindirilir.
 |
Keskinliği Azaltma Maskesi arayüzü
Kontur keskinliğinde bir artış simüle edilirken, konturlar boyunca azaltılmış ve artırılmış açıklığa sahip piksel alanları oluşturulur. Tam renkli bir görüntüdeki piksellere bunu yapmak, renk bozulmasına neden olarak kenarlarda farklı renkli bantların görünmesine neden olabilir. İÇİNDE bilgisayar grafikleri bu tür eserlere renkli hale veya renkli hale denir .
Yükleniyor...
