Web Tasarımında Beyaz Alan Nedir? Boşluk Kullanımı Neden Satış Getirir?

İngilizcede bu kavrama "whitespace" ya da "negative space" (negatif alan) deniyor. Biz Talha Aslan ve ekibi olarak web tasarım projelerinde beyaz alanı süs değil, bir yerleşim aracı olarak görüyoruz. Çünkü ziyaretçi bir sayfaya girdiğinde önce bütüne bakar, sonra gözü bir noktada durur. O noktayı belirleyen şey çoğu zaman renk ya da büyüklük değil, öğenin çevresindeki boşluktur.

Bu rehberde makro ve mikro boşluğu, satır aralığını, düğme çevresindeki boşluğu, 8 piksel boşluk sistemini ve mobil ekranlardaki farkları anlatıyoruz. Ayrıca sık yapılan hataları bir tabloda topladık. Yazının sonunda da kendi sitenizde uygulayabileceğiniz bir kontrol listesi var.

Beyaz alan neden satış getirir?

Beyaz alan kendi başına satış yapmaz; ancak satışın önündeki engelleri kaldırır. Kalabalık bir sayfada ziyaretçi neye bakacağını bilemez, bu yüzden karar vermeyi erteler. Boşluk ise sayfadaki seçenekleri ayırır ve her birini tek tek değerlendirilebilir hale getirir.

Örneğin bir hizmet sayfasında başlık, üç fayda maddesi, bir referans alıntısı ve teklif düğmesi olduğunu düşünün. Bu öğeler birbirine yapışık durursa göz hiçbirine yerleşemez. Aralarına yeterli boşluk koyduğunuzda ise okur sırayla ilerler: önce ne sunduğunuzu anlar, sonra neden size güvenmesi gerektiğini görür, en son da düğmeye ulaşır.

Üstelik boşluk kalite algısını da etkiler. Mağaza vitrinlerini düşünün: pahalı ürünler genellikle geniş aralıklarla yer alır, indirim reyonlarında ise ürünler üst üste yığılır. Web sayfasında da benzer bir okuma oluşur. Ferah bir düzen "bu işletme ne yaptığını biliyor" mesajı verir.

Kısacası beyaz alanın satışa katkısı dolaylıdır ama güçlüdür. Okumayı kolaylaştırır, dikkati toplar ve güven hissini destekler. Bu üç etkinin her biri dönüşüm yolundaki bir sürtünmeyi azaltır.

Makro boşluk ve mikro boşluk arasındaki fark nedir?

Makro boşluk, sayfanın büyük blokları arasındaki alandır. Bölümler arası mesafe, kenar boşlukları, kahraman alanı (hero, sayfanın en üstündeki karşılama bölümü) ile ilk içerik bölümü arasındaki aralık bu gruba girer. Makro boşluk sayfanın genel ritmini belirler.

Mikro boşluk ise küçük öğelerin içindeki ve arasındaki alandır. Satır aralığı, harf aralığı, liste maddeleri arasındaki mesafe, düğmenin iç dolgusu (padding) ve form etiketiyle kutu arasındaki aralık mikro boşluktur. Mikro boşluk okunabilirliği ve dokunma rahatlığını belirler.

Dolayısıyla iyi bir tasarım ikisini birlikte ayarlar. Makro boşluğu cömert tutup mikro boşluğu ihmal ederseniz sayfa ferah durur ama metin yine yorucu kalır.

Beyaz alan okunabilirliği nasıl etkiler?

Okunabilirliğin büyük kısmı mikro boşluğa bağlıdır. Satırlar birbirine çok yakın olursa göz bir satırın sonundan sonrakinin başına geçerken kayar. Paragraflar arasında boşluk yoksa metin tek bir duvara döner ve okur daha başlamadan vazgeçer.

Bu konuda resmi bir ölçüt de var. W3C'nin erişilebilirlik standardı WCAG, Metin Aralığı (1.4.12) başarı ölçütünde kullanıcının satır yüksekliğini yazı boyutunun en az 1,5 katına, paragraf aralığını 2 katına çıkardığında içeriğin kaybolmamasını ister. Yani bu ölçüt sizden belirli bir aralığı zorunlu tutmanızı değil, kullanıcı aralığı açtığında tasarımın bozulmamasını bekler. Yine de bu değerler gövde metni için iyi bir başlangıç noktası verir.

Örneğin 16 piksel gövde metninde 24 piksel civarı satır yüksekliği çoğu yazı tipinde rahat bir okuma sağlar. Başlıklarda ise satır yüksekliğini biraz daraltırsınız, çünkü büyük punto zaten kendi boşluğunu taşır. Yazı tipi seçiminin bu dengeye etkisini web tipografisi rehberimizde ayrıca ele aldık.

Ayrıca metninizin genel okunma zorluğunu ölçmek isterseniz okunabilirlik analizi aracımızı kullanabilirsiniz. Araç cümle uzunluğuna bakar; boşluk ise o cümlelerin ekranda nasıl nefes alacağını belirler.

Satır uzunluğu ve paragraf aralığı nasıl ayarlamalısınız?

Satır uzunluğu, beyaz alanın en çok gözden kaçan parçasıdır. Geniş bir masaüstü ekranında metni tam genişliğe yayarsanız tek satır çok uzar. Okur satırın sonuna geldiğinde bir sonraki satırın başını bulmakta güçlük çeker. Bu yüzden metin sütununu daraltırsınız ve iki yanda doğal bir boşluk oluşur.

Tipografi kaynaklarında gövde metni için satır başına yaklaşık 45 ile 75 karakter arası sık önerilen bir aralıktır. Bunu kesin kural değil, başlangıç noktası olarak görün. Kendi yazı tipinizde birkaç paragraf deneyip gözünüzün nerede yorulduğuna bakın.

Paragraf aralığında ise basit bir kural iş görür: paragraflar arası boşluk satır aralığından belirgin biçimde büyük olsun. Böylece okur yeni bir düşünceye geçtiğini görsel olarak hisseder. Paragraf aralığı satır aralığına çok yakın olursa metin yine tek blok gibi durur.

• Metin sütununu ekranın tamamına yaymayın; rahat bir genişlikte sınırlayın.
• Gövde metninde satır yüksekliğini yazı boyutunun yaklaşık 1,5 katı civarında tutun.
• Paragraf aralığını satır aralığından belirgin biçimde büyük seçin.
• Başlığı, ait olduğu paragrafa önceki paragraftan daha yakın konumlandırın.

Son madde özellikle önemlidir. Başlık üstündeki boşluk alttakinden büyük olursa okur başlığın hangi metne ait olduğunu hemen anlar.

Beyaz alan CTA butonunu nasıl öne çıkarır?

CTA (call to action, harekete geçirici çağrı) butonu, ziyaretçiden beklediğiniz eylemi isteyen düğmedir. Bu düğmenin fark edilmesi için çoğu kişi önce rengi değiştirir. Oysa çevresinde boşluk olmayan bir düğme, rengi ne kadar canlı olursa olsun kalabalığın içinde kaybolur.

Göz, çevresi boş olan öğeye doğal olarak yönelir. Bu nedenle teklif düğmesinin etrafına cömert bir boşluk bırakmak, onu büyütmekten çoğu zaman daha etkilidir. Ayrıca düğmenin yakınına ikinci, üçüncü bir bağlantı koymamak gerekir. Birbirine yakın birkaç seçenek, ziyaretçiyi karar anında ikiye böler.

Örnek senaryo: Bir mimarlık ofisinin ana sayfasında "Projelerimiz", "Hakkımızda" ve "Teklif Al" düğmeleri yan yana, aralarında birkaç piksel boşlukla duruyor. Bu durumda üçü de aynı önemde durur. "Teklif Al" düğmesini ayrı bir satıra alıp üstüne ve altına geniş boşluk verdiğinizde ise sayfanın asıl hedefi netleşir.

Düğme metni ve konumu üzerine daha ayrıntılı örnekleri CTA butonu örnekleri yazımızda topladık. Burada vurgulamak istediğimiz nokta şu: rengi ve metni doğru bir düğme bile, çevresinde nefes alacak alan yoksa beklediğiniz etkiyi göstermez. Öte yandan kontrastın da işin bir parçası olduğunu unutmayın; bunu tasarımda kontrast rehberimizde anlattık.

8 piksel boşluk sistemi nedir ve nasıl kurarsınız?

8 piksel boşluk sistemi, sayfadaki tüm aralıkları 8'in katlarından seçmeniz anlamına gelir: 8, 16, 24, 32, 48, 64 gibi. Çok küçük ayrıntılar için 4 piksellik ara adımı da ekleyebilirsiniz. Amaç, her tasarımcının ya da geliştiricinin aralığı gözle tahmin etmesini önlemektir.

Peki neden 8? Çünkü 8'in yarısı ve çeyreği de tam sayıdır, ekran çözünürlüklerinin büyük kısmıyla uyumlu ölçekler verir. Ancak asıl fayda sayının kendisinden değil, tutarlılıktan gelir. Tüm sayfalarda aynı küçük ölçek setini kullandığınızda site, farklı kişiler tarafından hazırlansa bile tek elden çıkmış izlenimi verir.

1. Önce küçük bir ölçek seçin; örneğin 4, 8, 16, 24, 32, 48, 64 ve 96 piksel.
2. Her değere bir görev verin: 8 düğme içi, 16 liste maddesi, 32 kart arası, 64 bölüm arası gibi.
3. Bu değerleri CSS değişkeni olarak tanımlayın ve tasarım dosyasında aynı adlarla kullanın.
4. Ölçek dışında bir sayı gerektiğinde önce tasarımı sorgulayın; çoğu zaman sorun boşlukta değil, yerleşimdedir.
5. Mobil için ayrı bir ölçek uydurmayın; aynı ölçekte daha küçük adımları seçin.

Bu yaklaşım bir tasarım sisteminin temel taşıdır. Renk, yazı tipi ve bileşenlerle birlikte nasıl bir bütün oluşturduğunu tasarım sistemi yazımızda bulabilirsiniz.

Mobilde beyaz alanı nasıl kullanmalısınız?

Mobil ekranda alan dar olduğu için ilk refleks boşluğu kısmaktır. Ancak mobilde boşluk, masaüstünden de önemlidir. Çünkü kullanıcı parmağıyla dokunur ve parmak fare imlecinden çok daha az isabetlidir.

WCAG'nin Hedef Boyutu (Minimum) ölçütü, 2.5.8, dokunma hedeflerinin en az 24'e 24 CSS piksel olmasını ya da yeterli aralıkla ayrılmasını ister. Bu ölçüt boşluğu doğrudan erişilebilirliğe bağlar: iki küçük bağlantıyı yan yana sıkıştırırsanız yanlış dokunma artar. Ölçütün istisnalarını ve ayrıntısını resmi sayfadan kontrol edin.

Mobilde makro boşluğu biraz daraltırsınız, çünkü ekran zaten tek sütundur ve bölümler doğal olarak alt alta dizilir. Öte yandan mikro boşluğu, özellikle düğme ve form alanlarında, daraltmazsınız. Kenar boşluğu da önemlidir; metin ekranın kenarına yapışırsa okumak zorlaşır ve sayfa sıkışık durur.

Ayrıca başparmağın rahat ulaştığı bölge ile boşluk ilişkisini thumb zone yazımızda anlattık. Sitenizin mobil görünümünü hızlıca kontrol etmek için mobil uyumluluk testi aracımızı da kullanabilirsiniz.

"Boş alan israftır" yanılgısı neden yanlış?

Birçok işletme sahibi, ekranda boş kalan her santimetrenin kaçan bir satış fırsatı olduğunu düşünür. Bu yüzden kampanya şeridi, ikinci bir slayt, ek bir bağlantı listesi ekler. Sonuçta sayfa dolar ama hiçbir mesaj öne çıkmaz.

Bu yanılgının kökü, ekranı gazete sayfası gibi görmekte yatar. Basılı gazetede kâğıt maliyeti vardır, bu nedenle editörler her alanı doldurmaya çalışır. Web sayfasında ise kaydırma ücretsizdir. Ziyaretçi aşağı inmeye isteklidir, yeter ki her bölümde ne okuduğunu anlasın.

Öte yandan beyaz alan "içeriği azaltın" demek de değildir. Aynı miktarda bilgiyi daha iyi gruplayıp daha fazla boşlukla sunabilirsiniz. Örneğin on maddelik bir özellik listesini üç başlık altında toplamak, maddeleri silmeden sayfayı ferahlatır.

Elbette boşluğun da bir sınırı vardır. Bölümler arası mesafe çok büyürse ziyaretçi sayfanın bittiğini sanabilir. Bu nedenle beyaz alanı amaçsız boşluk olarak değil, ilişkileri anlatan bir dil olarak kullanırsınız. Sade tasarım akımı ile beyaz alan arasındaki farkı merak ediyorsanız minimalist web tasarım yazımıza göz atabilirsiniz; minimalizm bir stil, beyaz alan ise her stilde gereken bir araçtır.

Yakınlık ilkesi ile içeriği nasıl gruplarsınız?

Yakınlık ilkesi, birbirine yakın duran öğeleri beynin bir grup olarak algıladığını söyler. Beyaz alanın en güçlü işlevi budur: çizgi, kutu ya da renk kullanmadan hangi bilginin hangisiyle ilgili olduğunu gösterirsiniz.

Örneğin bir ürün kartında ürün adı, fiyat ve kısa açıklama birbirine yakın durmalı; kart ile yandaki kart arasında ise daha büyük bir boşluk olmalıdır. Bu oran tersine dönerse ziyaretçi bir ürünün fiyatını yanındaki ürüne ait sanabilir. Bu tür karışıklıklar doğrudan satış kaybına yol açar.

Dolayısıyla boşlukları seçerken basit bir kural uygulayın: bir grubun içindeki aralık, gruplar arasındaki aralıktan her zaman küçük olsun. 8 piksel ölçeğiyle düşünürseniz kart içi 8 ya da 16, kartlar arası 32 piksel gibi net bir fark kurabilirsiniz.

Bu ilke çerçeve kullanımını da azaltır. Çoğu sayfada her bölümü kutu içine almak gerekmez; doğru boşluk, çizginin yaptığı işi daha sade biçimde yapar. Böylece sayfa hem hafifler hem de görsel gürültü azalır.

Formlarda boşluğu nasıl kullanmalısınız?

Formlar, bir web sitesinde beyaz alanın en doğrudan sonuç verdiği yerdir. Teklif formu, randevu formu ya da iletişim formu dönüşümün gerçekleştiği andır; burada yaşanan küçük bir kafa karışıklığı ziyaretçiyi kaçırır.

Nielsen Norman Group, form tasarımında beyaz alan yazısında etiket ile alanın birbirine yakın, alan grupları arasındaki boşluğun ise daha büyük olması gerektiğini anlatır. Bu, yakınlık ilkesinin formdaki karşılığıdır. Etiket kendi kutusundan uzakta durursa kullanıcı hangi etiketin hangi kutuya ait olduğunu tahmin etmek zorunda kalır.

• Etiketi kutunun hemen üstüne, kutuya yakın yerleştirin.
• İlgili alanları (ad, soyad gibi) bir grup halinde tutun, gruplar arasına daha fazla boşluk bırakın.
• Hata mesajı için önceden yer ayırın; mesaj çıktığında form aşağı zıplamasın.
• Gönder düğmesini son alandan net bir boşlukla ayırın.

Form alanlarının sayısı, sırası ve metinleri üzerine daha fazlasını teklif ve randevu formu tasarımı yazımızda bulabilirsiniz.

Boşluk ve düzen kayması arasında nasıl bir ilişki var?

Boşluk yalnız görsel bir tercih değildir; teknik bir sonucu da vardır. Sayfa yüklenirken görsel, reklam alanı ya da çerez bildirimi için yer ayrılmamışsa içerik aşağı kayar. Google bu kaymayı CLS (Cumulative Layout Shift, kümülatif düzen kayması) metriğiyle ölçer.

web.dev'deki CLS rehberi, görsellere ve geç yüklenen öğelere önceden boyut vermeyi önerir. Tasarım dilinde söylersek: boşluğu sayfa yüklenmeden önce planlarsınız. Görselin, videonun ya da gömülü içeriğin alanı en baştan ayrıldığında ziyaretçi okurken metin yerinden oynamaz.

Örnek senaryo: Bir ürün sayfasında fiyatın hemen üstünde, sonradan yüklenen bir kampanya şeridi var. Ziyaretçi "Sepete Ekle" düğmesine dokunmak üzereyken şerit beliriyor ve düğme aşağı kayıyor. Sonuçta kullanıcı yanlış öğeye dokunuyor. Bu durumda çözüm, şerit için sabit bir boşluk ayırmak ya da şeridi akışın dışına almaktır.

Kısacası iyi planladığınız beyaz alan hem göze hem de ölçüme iyi gelir. Google, sayfa deneyimi sinyallerini Search Central'daki sayfa deneyimi belgesinde açıklar; düzen kayması bu sinyallerin bir parçasıdır.

Beyaz alan kullanımında en sık yapılan hatalar nelerdir?

Sahada en çok karşılaştığımız boşluk hatalarını aşağıdaki tabloda topladık. Her birinin belirtisi kolayca göze çarpar, düzeltmesi de çoğu zaman birkaç CSS değeriyle sınırlıdır.

Bu tablo bir başlangıçtır. Ancak boşluk hataları çoğu zaman tek başına gelmez; aynı sayfada üç dört tanesi birlikte çıkar. Bu yüzden düzeltmeyi tek tek değil, ölçek tanımlayarak bütün olarak yapmanızı öneririz.

Ana sayfada ve hizmet sayfasında boşluk dengesini nasıl kurarsınız?

Ana sayfa ile hizmet sayfası farklı görevler üstlenir, dolayısıyla boşluk dengeleri de farklıdır. Yönlendirme ana sayfanın işidir; ziyaretçiye "nereye gitmeliyim?" sorusunun cevabını verir. Hizmet sayfası ise ikna eder ve teklif isteğine götürür.

Ana sayfada makro boşluk ön plandadır. Her bölüm tek bir mesaj taşır ve bölümler arası geniş aralık bu mesajları birbirinden ayırır. Hizmet sayfasında ise metin daha uzundur, bu nedenle mikro boşluk, yani satır aralığı ve paragraf aralığı daha fazla dikkat ister.

Örnek senaryo: Bir endüstriyel temizlik firması düşünelim. Hizmet sayfasında üç paket, süreç adımları ve sık sorulan sorular var. Paketleri kart olarak, adımları numaralı liste olarak ve soruları akordeon olarak sunarsanız her blok kendi boşluk kuralına sahip olur. Böylece uzun bir sayfa bile kolay bir tarama sunar.

Bu dengeyi kendi sitenizde kurmakla uğraşmak istemiyorsanız, boşluk ölçeğini ve sayfa ritmini en baştan planladığımız web tasarım hizmetimiz için teklif isteyebilirsiniz. Biz önce hedef eylemi belirler, sonra boşluğu o eyleme göre kurarız.

Görseller ve beyaz alan birlikte nasıl çalışır?

Görsel ile beyaz alan rakip değildir. Ancak görseli kenardan kenara yaydığınızda çevresindeki boşluğu da yok edersiniz. Bu bazen etkileyici bir sonuç verir; örneğin kahraman alanında tek bir büyük fotoğraf güçlü bir ilk izlenim yaratır.

Öte yandan içerik bölümlerinde görsele bir çerçeve boşluğu bırakmak çoğu zaman daha iyi sonuç verir. Görsel ile yanındaki metin arasındaki mesafe, metnin satır aralığından belirgin biçimde büyük olmalıdır. Aksi halde metin görselin içine taşmış izlenimi verir.

Fotoğrafın kendi içindeki boşluk da önemlidir. Arka planı sade, konunun etrafında hava olan bir fotoğraf, üzerine başlık yazmanıza imkân tanır. Kalabalık bir fotoğrafın üstüne metin koyduğunuzda ise okunabilirlik düşer ve çoğu zaman yarı saydam kutular eklemek zorunda kalırsınız.

Kısacası görsel seçerken de boşluğu düşünürsünüz. Ürün fotoğraflarında aynı kadraj ve aynı kenar payı, katalog sayfasını tek bir ritme oturtur. Farklı kadrajlardaki görseller ise ızgarayı bozar ve aynı aralığı kullansanız bile düzen dağınık görünür.

Ayrıca görsel altı açıklamalarını unutmayın. Açıklama metni görsele yakın, sonraki paragraftan ise belirgin biçimde uzak durmalıdır. Böylece okur açıklamanın hangi görsele ait olduğunu düşünmeden anlar. Bu küçük ayrıntı, özellikle proje ve referans sayfalarında sayfanın düzenli algılanmasını sağlar ve ziyaretçinin dikkatini dağıtmadan bir sonraki örneğe geçmesine yardım eder.

Koyu temada beyaz alan nasıl çalışır?

Koyu arka planlı sitelerde de beyaz alan aynı görevi üstlenir; yalnız rengi değişir. Ancak koyu zeminde açık renkli metin gözde biraz daha parlak bir etki bırakır. Bu yüzden koyu temada satır aralığını ve harf aralığını çok az açmak çoğu zaman okumayı rahatlatır.

Öte yandan koyu temada kartları ayırmak için sık sık çizgi ya da gölge eklemek isteyebilirsiniz. Oysa burada da yakınlık ilkesi işe yarar. Kartlar arasına yeterli boşluk koyduğunuzda çerçeveye gerek kalmaz ve sayfa daha sakin bir görünüm kazanır.

Örnek senaryo: Bir yazılım firması ürün sayfasını koyu temada hazırlıyor ve her özelliği ince çizgili kutulara koyuyor. Çizgileri kaldırıp kutular arasındaki boşluğu artırdığında ise sayfa hem ferahlıyor hem de özellik başlıkları daha net okunuyor. Kısacası koyu temada boşluk kuralları değişmez; yalnız kontrast ve parlaklık dengesine biraz daha dikkat edersiniz.

Beyaz alan kontrol listesi neleri içermeli?

Yeni bir sayfa yayına almadan ya da mevcut bir sayfayı gözden geçirirken aşağıdaki listeyi kullanabilirsiniz. Her madde birkaç saniyede kontrol edilebilecek kadar somuttur.

• Sayfadaki tüm aralıklar aynı küçük ölçekten mi geliyor?
• Grup içi boşluk, gruplar arası boşluktan küçük mü?
• Gövde metninde satır yüksekliği yazı boyutunun yaklaşık 1,5 katı civarında mı?
• Paragraflar arası boşluk, satır aralığından belirgin biçimde büyük mü?
• Masaüstünde metin satırları aşırı uzun değil mi?
• Ana CTA düğmesinin çevresi boş mu, yanında rakip bağlantı var mı?
• Mobilde dokunma hedefleri yeterince büyük ya da yeterince aralıklı mı?
• Görsellere ve geç yüklenen alanlara önceden yer ayırdınız mı?
• Bölümler arası boşluk, ziyaretçiye sayfanın bittiğini düşündürecek kadar büyük değil mi?
• Formda etiketler kendi alanlarına yakın mı?

Bu listeyi ekibinizle paylaşıp her yeni sayfada aynı sırayla uygulamanızı öneririz. Böylece boşluk kararları kişiye göre değil, ortak bir kurala dayanır.

Mevcut sitenizde boşluğu nasıl test edersiniz?

Boşluğu test etmenin en basit yolu sayfayı bulanıklaştırmaktır. Ekran görüntüsünü alın, bir görsel düzenleyicide hafif bulanıklık verin ve neyin öne çıktığına bakın. Eğer ilk göze çarpan şey ana mesajınız ya da teklif düğmeniz değilse boşluk dağılımında bir sorun vardır.

İkinci yöntem, yakınlaştırma ve metin aralığı testidir. Tarayıcıda yakınlaştırmayı artırın ve metnin taşıp taşmadığını kontrol edin. WCAG'nin metin aralığı ölçütü bu nedenle önemlidir; kullanıcı aralığı açtığında içerik kesilmemelidir.

Üçüncü yöntem gerçek cihazdır. Sayfayı kendi telefonunuzda tek elle gezin ve her düğmeye başparmağınızla dokunun. Yanlış dokunduğunuz yerler, mikro boşluğun yetersiz olduğu yerlerdir. Bu testi farklı boyutlarda en az iki telefonla tekrarlamanızı öneririz, çünkü küçük ekranda sorun daha belirgin çıkar.

Son olarak davranış verisine bakın. Isı haritası ya da kaydırma derinliği verisi, ziyaretçilerin hangi bölümde durduğunu gösterir. Belirli bir bölümden sonra ziyaretçilerin büyük kısmı ayrılıyorsa, o noktadaki aşırı boşluk ya da sıkışıklık bir neden olabilir. Yine de tek bir veriye dayanarak karar vermeyin; değişikliği yaptıktan sonra aynı ölçümü tekrarlayın.

Beyaz alanı kim, ne zaman planlamalı?

Beyaz alan, tasarımın sonunda eklenen bir rötuş değildir. En iyi sonucu, sayfa yapısı planlanırken boşluk ölçeği de belirlendiğinde alırsınız. Sonradan "biraz ferahlatalım" diye eklenen aralıklar çoğu zaman tutarsız kalır.

Bu nedenle süreci şöyle kurmanızı öneririz: önce sayfanın tek bir hedef eylemini yazın, sonra içerikleri gruplara ayırın, ardından boşluk ölçeğini tanımlayın ve en son görsel ayrıntıya geçin. Böylece boşluk, hedef eyleme hizmet eden bir araç haline gelir.

Ekip içinde de görev paylaşımı netleşmelidir. Tasarımcı ölçeği belirler, geliştirici bu ölçeği değişken olarak koda taşır, içerik yazarı ise paragrafları bu ritme uygun uzunlukta tutar. Biri kuralı bozduğunda sayfa yine kalabalıklaşır.

Sitenizin boşluk sistemini baştan kurmak ya da mevcut sayfaları bu gözle elden geçirmek isterseniz, web tasarım sayfamızdan projeniz için teklif alabilirsiniz. Talha Aslan ve ekibi olarak boşluk ölçeğini, mobil düzeni ve teklif akışını tek bir planın parçası olarak ele alıyoruz.