Çarpıcı Web Siteleri Oluşturmak için Negatif Alan Nasıl Kullanılır

Web siteleri ve uygulamalar, bir arada bulunması gereken her türlü görsel öğeye sahiptir - düğmeler, sütunlar, simgeler, resimler, çizgiler, medya ve tipografi. Tüm bu öğelerin bir tuvale (boş web sayfası) ihtiyacı vardır ve bu tuvalin boş alana, yani negatif veya beyaz alana ihtiyacı vardır. İzleyicinin gözü, onsuz gördüğünü işleyemez.

Youtube Kanalımıza Abone Olun

Negatif Uzay nedir?

Pozitif alan, çalışmanın konu veya diğer odak noktaları ile dolu olan kısmıdır. Negatif alan gerisini alır. Boş veya beyaz olabilir, renk veya tasarımda zıtlık, ince bir arka plan görüntüsü olabilir - her ne olursa olsun, dolu veya darmadağın olmak yerine boş hissedecektir. Ancak, negatif uzayın boş olması onun önemsiz olduğu anlamına gelmez – dikkati pozitif alana çeker ve hatta bazen farklı bir şekilde bakıldığında pozitif uzayın kendisi haline gelir.

Negatif Alan Örnekleri

Negatif alan – ve onun karşılığı olan pozitif alan – web tasarımı da dahil olmak üzere her türlü sanat ve tasarımda bulunur. Şimdi FedEx logosuna bakalım. Mor ve turuncu harfleri görüyorsun, değil mi? Yine de orada bir ok var, beyaz boşlukta:

Bu gizli FedEx oku, çizim ve boyamaya benzer şekilde negatif alanı kullanır - anahat, tıpkı pozitif alanın oluşturulduğu gibi oluşturulur. Bunun gibi bir örnekte, negatif alan, pozitif alanın olmadığı yer olduğu için oluşturulmaz .

NBC tavus kuşu da aynı şeyi yapar:

Negatif alanın amacı genellikle pozitif alana odaklanmak olsa da, bazen akıllı tasarımlarda odak noktası haline gelir . İşte başka bir örnek – kurdun dişlerinin nasıl bir ağaç oluşturduğuna bakın:

Bunun için bir terim var: şekil-zemin tersine çevirme. Temel olarak, perspektifi ve yorumları değiştirmek için ön plan ve arka plan renklerinin yer değiştirdiği anlamına gelir. Bununla ilgileniyorsanız, MC Escher'in çalışmalarına, özellikle de dönüşüm baskılarına bakın.

Negatif alan fotoğrafçılıkta da aynı rolü oynar. Kuzenimin oğlu Julian'ın çektiğim bu portreye bak. Siyah arka plan tüm odağı ona veriyor:

Doğada, çiçek yaprakları arasındaki boşlukta olduğu gibi ve bir kahve kupasının kulbundaki boşlukta olduğu gibi fonksiyonel tasarımda negatif boşluk bulabilirsiniz.

Biz de sitemizde kullanıyoruz. Ana sayfamızda bir sürü bilgi var, ancak bunları ayırma şeklimiz nedeniyle bunaltıcı değil. Ve arka planda tasarıma eklenecek renk ipuçları ve bazı şekiller olsa da, hiçbir şekilde dikkat dağıtıcı değil - yine de sıkıcı olmadan ( ve marka üzerinde) hoş bir şekilde boş bir görünüm veriyor.

Negatif Alan Türleri

Birkaç tür negatif alan vardır. Mikro ve makro, bir kompozisyondaki negatif boşluğun boyutunu ifade eder. Aktif ve pasif, bu alanların kullanıcı için ne yaptığını ifade eder.

Mikro ve Makro Negatif Alan

Mikro negatif boşluk, öğeler arasındaki küçük boşlukları ifade eder - metin satırları arasındaki boşluk veya bir gezinme menüsündeki bağlantılar arasındaki alan. Bu, içeriğin okuyucu için ne kadar okunaklı olduğunu etkiler. Satırlar arasında yeterli boşluk yoksa veya metin kenar boşluklarının dışına çıkarsa, kullanıcı onu okumakta ve anlamakta zorlanacaktır.

Makro negatif alan daha büyüktür; düzenin etrafındaki boşluk ve büyük tasarım öğeleri arasındaki boşluklardır. Bir örnek, içerik blokları arasındaki alandır. Tüm tasarımı tutan kabın boş kısımlarıdır.

Az miktarda makro negatif alana sahip web siteleri oldukça bilgilendirici olma eğilimindedir. Büyük miktarda makro negatif alana sahip web siteleri genellikle minimalist veya vitrin lüksüdür. İlk örnek, küçük makro negatif boşluktur ve ikincisi, büyük makro negatif boşluktur:

Aktif ve Pasif Negatif Alan

Aktif negatif alan, sayfa yapısına katkıda bulunur, içerik akışını iyileştirir ve kullanıcıyı gitmek istediğiniz yere yönlendirir. Pasif negatif alan, web sitesinin görünümünü iyileştirir ancak kullanıcıyı belirli bir akışta hareket ettirmez. Alan merkezden uzak ve asimetrik olduğunda, genellikle aktiftir. Dengeli ve simetrik olduğunda genellikle pasiftir – daha az hareket uyandırır ve bu da kullanıcıyı belirli bir şekilde bakmaya zorlamaz. İşte bir aktif negatif alan örneği:

Ve işte bir pasif negatif alan örneği:

Negatif Boşluk ve Kompozisyon

Negatif alan kompozisyon için birkaç nedenden dolayı önemlidir:

• İyi orantılı tutmak için bir kompozisyondaki boşluğu görmeniz gerekir.
• Ayrıca bir tasarımdaki farklı nesneler arasındaki ilişkilerle oynamanıza da olanak tanır.
• Web tasarımında insanları sayfanızda tutmak kadar önemli bir rol oynayabilir.
• Bir öğenin etrafındaki boşluk miktarı, öğeye ne kadar odaklanılacağını belirler - daha fazla alan, daha fazla odak anlamına gelir.

Negatif ve Pozitif Alanın Doğru Dengesini Seçmek

Ne kadar negatif ve pozitif alan kullanacağınız, aradığınız görünüme ve izleyicide neyi uyandırmak istediğinize bağlı olacaktır.

• Estetik açıdan hoş bir tasarım istiyorsanız, muhtemelen eşit parça negatif ve pozitif boşluk kullanacaksınız.
• Bilerek sade ve minimalist görünen tasarım için daha fazla negatif alan kullanacaksınız.
• Güçlü ve yüzünüzde görünmek için daha pozitif bir alan seçebilirsiniz.

Tasarımcılar, marka ve web sitesinin amaçlanan amaçları için doğru dengeyi bulana kadar boşluklarla oynamak zorundadır.

Negatif Alan ile Metin-Ağır Web Sitelerini Dağıtmak

Bir sayfaya tonlarca bilgiyi sıkıştırmanız gerektiğinde, negatif boşluğu nereye yerleştireceğinizi bulmak zorlaşır - özellikle de bu bilgi metin ağırlıklıysa ve bu da hızlı bir şekilde karmaşık görünebilir. HostingDude, çok fazla pozitif alan için harika bir örnektir:

Öte yandan New York Times, gözlerinizi çıldırmadan ana sayfalarını haberleriyle nasıl dolduracağını buldu ve hepsi boşluklar (ve renk seçenekleri) sayesinde. Makro alan için çok fazla yer olmamasına rağmen, mikro alandan yararlandılar:

HostingDude'daki öğeler birbirine daha yakın olsa da, New York Times web sitesindeki öğeler, aralarındaki fazladan boşluk sayesinde daha birleşik görünüyor. Gözün sayfayı anlamlandırması daha kolay olur, bu da ona daha eksiksiz ve uyumlu bir tasarım sağlar. Göz dinlenme fırsatı bulduğunda, gördüklerini daha iyi algılayabilir. Negatif alan, daha azının daha fazla olduğuna inanır.

Metni Negatif Boşlukla Bölme

Tasarımcıların estetik açıdan hoş, metin ağırlıklı bir ana sayfa nasıl oluşturabileceğini gördünüz, peki ya daha uzun metin bloklarının kendileri? Kısa paragrafları uzun paragraflarla karıştırmak, başlıkları kalınlaştırmak, listeler oluşturmak ve bir makale boyunca medya eklemek, sözcüklerin çevresinde olumsuz boşluklar oluşturmaya yardımcı olur ve onu okuyucu için daha çekici hale getirir. Görünüm, kopyada bile önemlidir ve harika tasarımcılar bunu dikkate alır.

Müşterilere Negatif Alan Noktasını Açıklamak

Web sitesi tasarımcıları, müşterilerle negatif alan konusunda çatışabilir. Müşteriler, önemli, para kazandıran bilgileri sıkıştırmak için daha da fazla alan görürler. Boş alanın boşa harcandığını düşünüyorlar. Tasarımcılar ise gözün zaten var olan bilgiyi özümsemek için ihtiyaç duyduğu görsel arayı görür. Bir web sitesindeki tüm alanların, içerik içermeyen alanların bile önemli olduğunu bilirler.

Mockup ve prototipleme araçlarının kullanışlı olduğu yer burasıdır. Müşteriye web sitesinin iki versiyonunu gösterin, biri hoş miktarda negatif alan ve diğeri pozitif alanla aşırı dolu. Web sitelerine yan yana bakmalarını ve onlarla oynamalarını isteyin. Tahminimce, iyi tasarlanmış web sitesinde gezinmek kolay olacak ve kötü tasarlanmış web sitesinde kaybolmuş hissedecekler.

Toplama

Web sitelerinin bir sürü farklı öğesi vardır ve bu öğelerin uyum içinde yaşamasını ve izleyiciyi çekmesini istiyorsanız, etraflarında beyaz alana ihtiyacınız vardır. Kullandığınız boşluk miktarı ve nasıl çalıştığı, (a) markanıza ve (b) kullanıcının yapmasını istediğiniz eylemlere bağlıdır. Beyaz boşlukla da yaratıcı olabilirsiniz, örneğin renkleri ters çevirerek veya negatif boşlukla çizim yaparak onu ilginç veya göz kamaştırıcı bir şekilde tanımlayabilirsiniz.

Hangi yaklaşımı benimserseniz benimseyin, beyaz boşluk dengeli hissetmelidir - yine de bu mutlaka simetrik anlamına gelmez. Bunun yerine, öğelerin bir sayfada birbirleriyle rekabet etmeden ve sahip olmalarını istediğiniz türden ilgiyi çekerken var olduğu anlamına gelir. İzleyici için denge, bir web sitesine kafanız karışmadan veya bunalmadan bakabilmek anlamına gelir.

Web sitenizdeki beyaz boşlukla denemeler yapın. Biraz ekleyin, biraz çıkarın. Makroyu azaltın ve mikroyu artırın veya tam tersi. Belirli öğelerin etrafındaki beyaz alanın, kullanıcıyı harekete geçmeye ne kadar teşvik ettiğini test edin. Beyaz alanın güzelliği, sanatsal bir teknik olmasıdır, bu da katı kuralların olmadığı anlamına gelir.

Bir seyahat sitesi mi tasarlıyorsunuz? Muhtemelen çok fazla makro alanı kullanacaksınız. Seyahat Web Siteleri için Divi Çocuk Temaları topluluğumuza göz atın.

StockVector / Shutterstock.com aracılığıyla Öne Çıkan Görsel