Bu Popüler Web Tasarım Trendlerini Kullanırken Dikkatli Olun

Yayınlanan: 2018-02-14

Çoğu kültürel ürün gibi, web tasarımının da kendi zamanın ruhu vardır. Her yıl popüler tasarım bileşenleri, özellikleri ve trendlerinden oluşan yeni bir ürün görüyoruz. Tutumlar, özellikle yeni teknolojik gelişmelerin hızlı temposu ile hızla değişmektedir.

Bazı web tasarım trendleri zamana karşı koyamaz. Geçmişte kullanılabilirliği engelleyen veya site ziyaretçilerini caydıran trendler koymalısınız. Tasarımcılar, ilgilenmeye çalıştıkları insanları yabancılaştırabilecek aşağıdaki trendleri kullanmaktan kaçınmalıdır.

Yeterli Negatif Alan Yok

Negatif alan, kullanılabilirlikte önemli, ancak genellikle belirtilmeyen bir rol oynar. Bazen boşluk olarak da adlandırılır, bir görüntünün veya tasarım öğesinin etrafındaki ve arasındaki boşluktur. Sanatta olduğu gibi, web tasarımında da negatif alan sanatsal bir unsur olarak kendi gücüne sahiptir. Ne yazık ki, bazıları negatif alanı boşa harcanan alan olarak görüyor, ancak tıpkı müze duvarlarının sanat arasında boşluğa ihtiyacı olduğu gibi, web tasarımı blokları da öyle. Negatif alan, sitenizdeki içeriğin okunmasını ve bulunmasını kolaylaştırır.

bagigia örneği boşluk

Web tasarımcıları, Coco Chanel'in daha azın ne kadar çok olduğu konusundaki tavsiyesine kulak verseler iyi olur – “evden çıkmadan önce aynaya bakın ve bir aksesuarı çıkarın.” Web tasarımcıları, fazladan varlıklar eklemeye başlamadan önce CSS ve HTML öğelerinin varsayılan olarak nasıl boş alan olmadığını düşünmelidir.

Bu sorunu herhangi bir iyi web sitesinin ihtiyaç duyduğu yüksek kaliteli içerikle birleştirin ve sorun açıktır - bakılacak çok fazla yeri olan aşırı erişimli bir web sitesi. Her öğenin etrafında yeterince boşluk olduğunda, kullanıcılar içeriğinizi görecek ve CTA'larınız öne çıkacaktır.

Kalabalık bir site için birkaç kolay düzeltme var. İlk olarak, dikey kaydırmanın sonsuz kapasitesini kullanın. Üst navigasyonunuz açık olduğunda, ekranın altında başka ikincil öğelere sahip olmak tamamen kabul edilebilir. Sitenizde gezinmek başlangıçta kolay olduğunda, kullanıcılar daha fazla bilgi aramaktan çekinmezler. İkincisi (ve tipografi hakkında daha sonra konuşacağız) yazı tipi boyutlarına dikkat edin. Çok büyük, yer kaplar ve patronunuzdan gelen büyük harflerle bir e-posta gibi agresif bir şekilde okuyabilir. Bu bir denge – sizi bunaltmayan ama yine de dikkat çeken bir yazı tipi bulun.

Hamburger Menüleri

Son birkaç yılın en öne çıkan web tasarım trendlerinden biri de hamburger menüsü oldu. Bu eğilim, kısmen, mobil cihazlarda web sitelerine erişen kullanıcılardaki ani artış nedeniyle ortaya çıktı. Hamburger menüsünün amacı, bir sayfanın ana alanını karıştırmaması için menü gezinmesini gizlemektir. Kullanıcılar simgeleri tanır ve genellikle tam menüyü bulmakta sorun yaşamazlar. Bu iyi bir fikir - eğer insanlar oraya varmadan önce ne istediklerini biliyorlarsa.

hamburger menü simgeleri

Sorun, bir site bir kullanıcının içeriği organik olarak keşfetmesine bağlı olduğunda ortaya çıkar. Luke Wrobleski'nin dediği gibi, "belli ki her zaman kazanır." Ve açıktır - daha yüksek görünürlük, daha yüksek kullanım anlamına gelir. Facebook örneğini düşünün. Sosyal medya kuruluşu iOS uygulamasında üst hamburger menüsünden alt sekme çubuğuna geçtiğinde, artan kullanıcı memnuniyeti, daha yüksek gelirler ve hız (ve algısı) gibi kullanıcı katılımı da tavan yaptı.

Kullanıcıların doğal olarak keşfedecekleri diğer içerik miktarını sınırlamak tehlikeli bir oyundur. Kategorileri gizleyerek, ziyaretçiler seçeneklere hemen maruz kalmazlar.

Hamburger menüleri, özellikle işletmelerin ürünlere maruz kalmasına bağlı olduğu e-ticaret sitelerine zarar veriyor. Kullanıcıların menüyü açmaları gerektiğinde, işletmenizin en belirgin ve önemli yönlerini gözden kaçırabilirler. İşletmeniz RSS beslemesi gören okuyuculara bağımlıysa, hamburger menülerinden tamamen kaçınılmalıdır; okuyucuların ilgili konuları ve diğer güncel başlıkları görebilmesine bağlı olan haber sitelerini olumsuz etkiler.

Ön Sayfa Karuselleri

Ön sayfa karuselleri şu anda her yerde bulunur ve bunları küçük işletme sayfalarından büyük şirketlere kadar sitelerde görebilirsiniz. Tasarımcılar, tek bir özellik üzerinden çok fazla bilgi sunarak görsel ekonomi yarattıkları için atlıkarıncalara çekilebilir.

Şirketiniz hala adını duyurmaya çalışıyorsa, karuselleri dikkatli kullanın. Döngüler, insanların sayfanızı bulmasını zorlaştırır ve genellikle sayfanın gövdesinde daha az içerik anlamına geldikleri için arama motoru optimizasyonunu (SEO) olumsuz etkileyebilir. Sayfada daha az metin, Google'ın bulması için daha az meta bilgi anlamına gelir.

atlıkarınca grafiği

Yine de, sayfanın kendisine metin eklemek için bir noktaya değinmek gibi geçici çözümler vardır, ancak bu, görsel ekonomi için bir atlıkarınca kullanma amacını baltalar. Döngüler ayrıca bir sitede büyük erişilebilirlik sorunlarına neden olabilir. Yükleme süresini yavaşlatmakla ünlüdürler ve genellikle performans sorunlarına neden olabilecek JavaScript kullanırlar.

Döngüler yalnızca bir siteyi daha az erişilebilir kılmakla kalmaz, siteye erişebilen ziyaretçilerin ilgisini başarıyla çekmez. 2013 yılında yapılan bir araştırma, atlıkarıncanın otomatik mi yoksa manuel olarak mı yönlendirildiğine bağlı olarak, site ziyaretçilerinin yaklaşık %1'inin bir atlıkarınca tıkladığını buldu.

Ve Wroblewski'nin hamburger menüleri hakkında verdiği tavsiyeleri dikkate alırsak, karusellerde sorun aynıdır – bunlar bariz değildir. Yukarıdaki çalışmada, tıklayan %1'in %83'ü ilk resme tıklamıştır. Bu, kullanıcıları yakalamayı umduğunuz diğer dört resim için ne anlama geliyor? Hiçbir mesafe kat etmiyorlar ve katılımı teşvik etmek için çok az şey yapıyorlar.

Wroblewski, PJ McCormick'in Amazon'daki atlıkarınca tasarımını gerçekten işe yarayan bir örnek olarak kullanıyor. Görüntüler bölümlere ayrılır ve kullanıcı belirli bir bölümün üzerine geldiğinde bu, atlıkarıncadaki görüntü olur ve kullanıcıların aradıklarını bulmak için oraya tıklayabileceklerini açıkça gösterir.

Açılır pencereler

Açılır menüler, en yetenekli kullanıcılar tarafından bile çalıştırılması karmaşık olabilir, bu karmaşıklığı küçük ekrana ekleyin ve navigasyon için bir kabus. Açılır menü kontrolleri ise, kullanıcı keskinliği veya hızından bağımsız olarak kolayca kaydırılabilen menü seçeneklerinin bir listesini sunar. Apple'ın iPhone'u buna iyi bir örnektir – sürükle, hafifçe vur veya dürt – geniş hedef ve bağışlayıcı seçenekler kontrolü kolaylaştırır.

İyi yapıldığında pop-up'lar bileşik girdiler (tarihler, yükseklikler, ağırlıklar için girdiler) için harikadır ve süreci çok daha akıcı hale getirir.

Örneğin, tarih girmek için üç seçenek (gün, ay ve yıl) yerine tek bir tarih alanı, kullanıcıların doğru tarihi girmek için aynı anda üç listede gezinmesine izin veren bir dizi açılır menü açabilir. Bu basit düzeltme, kullanıcının sabırsızlığıyla birlikte giriş süresini azaltabilir.

Sonsuz Kaydırmayı Altbilgi İçeriğiyle Birleştirme

Sonsuz kaydırma, kullanışlı bir tasarım aracı olabilir. Sonsuz ve zahmetsizce içerik yüklemek, tatmin edici bir kullanıcı deneyimi sağlayabilir. Pinterest gibi siteler, mükemmel etki için sonsuz kaydırma kullanır ve onu modaya uygun tutmaktan kısmen sorumludur. Dikey kaydırma belirli uygulamalar için büyük bir başarı olmasına rağmen, yatay kaydırma hala birçok kullanıcının kafasını karıştırıyor. Çoğu zaman bunun bir seçenek olduğunun farkına bile varmazlar. İçerik sona ermiş gibi görünüyorsa, aynı şekilde şaşkına dönecekler.

Sonsuz kaydırma

Bir site ayrıca kullanıcıların erişmek isteyebileceği içeriğe sahip bir altbilgiye sahip olduğunda, sonsuz kaydırma bir sorun haline gelir. Kullanıcılar aşağı ve aşağı kaydıracak ve altbilgiye yetişemeyecek. Deneyimli mobil kullanıcılar bunu çözecekler, ancak bu onları hayal kırıklığına uğratıyorsa denemeyebilirler. Açık olmanın yanı sıra, navigasyon kolay olmalıdır.

Yavaş Yüklenen Ekranlar

Kullanıcıların bir siteyi terk etmesinin bir numaralı nedeni - bir heyelanla - yavaş yükleme süresidir. Anketlerde, kullanıcıların yaklaşık yarısı bir sayfanın yüklenmesi için 10 saniyeden fazla beklemeyeceklerini söylüyor. Daha hızlı internet bağlantılarına ve cihazlara alıştığımız için, insanlar sayfaların neredeyse anında yüklenmesini bekliyor. Bir ekranın yüklenmesi ne kadar uzun sürerse, kullanıcının ayrılma olasılığı o kadar artar.

Kullanıcılar bunun için suçlanmamalı, teknoloji, deneyimlerimizden yeterince faydalandı ve bunun bir beklenti haline geldiğini söyledi. Yükleme sürenizi kısaltabilecek karmaşık içeriği dengelerken, kimsenin görmemesinin önemli olup olmayacağını düşünün. Mobil kullanıcılar, web sitenizi kontrol ederken oturup latte içmezler - hareket halindedirler ve mobil deneyimlerinin de aynı hızda olmasını beklerler.

Gereksiz Karmaşık Tipografi

Günümüzde mevcut olan yazı tiplerinin çeşitliliği ile, web tasarımcıları tek bir sayfada birkaç yazı tipi kullanmaya cazip gelebilir. Tek bir belgede asla iki veya üçten fazla yazı tipi kullanılmaması gerektiğine dair sık ​​sık alıntılanan bir tipografi kılavuzu vardır.

Birden çok yazı tipini haklı çıkaran durumlar olsa da, genellikle temiz ve net bilgi sunumuna odaklanmak daha iyidir. Wroblewski, Tim Brown'ın tipografi için en iyi uygulamalarına ilişkin notlarını sunuyor. Tipografi için en önemli unsurlardan biri dengedir - boyut, yönlendirme ve ölçü dengesi, okunabilirliği ve estetik çekiciliği artırır. Okunmayacaksa bir yazı tipinin anlamı nedir? Tasarımın netliğini gizlemek mantık dışıdır ve okuyucu sayınızı artırmaz.

iyi yazı tipi kötü yazı tipi

Bir veya iki yazı tipi seçmek, birleşik bir görünüm oluşturur ve kullanıcıların bir markayı daha iyi tanımlamasına yardımcı olur. Unutmayın, amaç kullanıcılarla etkileşim kurmaktır. Çok fazla boyutta birden fazla yazı tipi, bir sitenin rahatça okunmasını zorlaştırır. Metin okunaksız ise, hiç kimse sayfada uzun süre kalamaz.

Yüzen Elemanlar

Kayan öğeler, bir kullanıcının dikkatini çekmek için harika bir yol olabilir, ancak uygunsuz bir şekilde zamanlanırsa, sayfanın bir bölümünü engelleyerek ve onları görmek istedikleri şeyden uzaklaştırarak kullanıcılarınızı yabancılaştırabilir. Hepsi bir siteyle etkileşime girmemelerini sağlar. Kayan öğeler, bir siteye daha küçük bir ekranda erişmeye çalışan mobil kullanıcılar için özellikle sinir bozucu.

Ek olarak, kayan öğeler genellikle amaçlandığı gibi çalışmaz, kapatıldığında bile açılır ve önemli sayfa özellikleri üzerinde kayar. Kullanıcının deneyimi ne kadar karmaşık hale gelirse, siteyi kullanmaya devam etme olasılıkları o kadar az olur.

Paralaks Kaydırma

Paralaks kaydırma mutlaka kötü bir tasarım seçimi değildir ve birçok pazarlama kampanyasında büyük etki için kullanılmıştır. Sitelerin kendilerini farklılaştırmaları için yeni bir seçenek sunuyor ve son zamanlarda popülaritesi arttı.

Bazı dezavantajlarla birlikte geliyor. Karusellerde olduğu gibi, arama motorlarının tarayabileceği daha az içerik olduğundan SEO'yu olumsuz etkileyebilir. Paralaks kaydırma, mobil cihazlar tarafından erişilebilir olması gereken siteler için de iyi bir tasarım seçimi değildir. JavaScript'e ve çok sayıda grafiğe dayandığından, bir sayfanın çok yavaş yüklenmesine neden olarak, kullanıcının sabırsızlanıp sayfa yüklenmeden ayrılma olasılığını artırır.

Trendlerden En İyi Şekilde Yararlanın

Tüm bu trendlere kesinlikle uygun uygulamalar olsa da, web tasarımcıları bunları kullanmaya karar vermeden önce dikkatlice düşünmelidir. Herhangi bir tasarımcı için en iyi kural, işlevselliğe ve kullanıcı deneyimine, bir anda ortaya çıkan trendden daha fazla ağırlık vermektir. Herhangi bir tasarımda Luke Wroblewski'nin tavsiyesini aklınızda bulundurun ve açık olun. İçerik ne kadar iyi olursa olsun, gizliyse faydasızdır.