Web Tasarım Trendleri – Aralık 2017

Bu ayın üç önemli tasarım trendinin tamamı tipografi ile ilgili. Ve eğilimler, kullanıcı etkileşimi oluşturmak ve harika bir ilk izlenim yaratmak için güzel bir tür kullanmanın bazı güzel yıldız biçimlerini sergiliyor.

Bu tasarımlar arasında ortak bir tema, tüm tipografi tarzlarının yüksek oranda okunabilir olmasıdır. Daha modaya uygun veya korkak bir metin öğesiyle çalışmayı planlıyorsanız, kullanıcıların okumak için mücadele etmeyeceği bir yazı tipi seçin. Son moda teknik, bu tasarımlarla ilgili hiledir, yazı karakterinin kendisi değildir.

Bu ay tasarımda trend olan nedir?

1. Sadece Kaydırma Üstü Yazın

Harika bir resim, kullanıcıları bir tasarıma çekmeye yardımcı olabilirken, bazen doğru kelimeler ve boşluk bilettir.

Bu tasarım trendinden en iyi şekilde yararlanmanın anahtarı mesajınızı daraltmaktır. Kelimelerin basit olması, anlamlı bir şey söylemesi ve kullanıcı için değer yaratması gerekiyor.

Peki nasıl yapıyorsun?

• Bir anahtar kelime ile başlayın. Bu sizin göreviniz veya kullanıcılar için bir değer önerisi olabilir. Kullanıcılara masaya ne getirdiğini ve web sitenizin onlar için neden önemli olacağını söyleyin.
• Daha uzun kopyalama blokları için mesajlaşma ile aynı ruh hali olan basit bir yazı karakteri seçin.
• Metin bloğu kısasa, Tür Türleri gibi, kullanıcıları çekmek için funkier tipi bir seçenek düşünün.
• Uzaydan en iyi şekilde yararlanın. Aşağıdaki örneklerin her birinde, metnin nefes almak için bolca alanı olduğunu ve bir bakışta okumayı kolaylaştırdığını unutmayın. Alan aynı zamanda metne göz atmaya yardımcı olabilir ve bunları Design Ups gibi ekranda ortalamak istemiyorsanız metin öğelerini dengeleyebilir.
• Görsel ilgi alanı eklemek için renk kullanın. Parlak, popüler renkler, kullanıcıları tasarıma çekmeye yardımcı olabilir. Renk ayrıca mesajlaşma ile ilişkilendirilen bir ruh halinin ayarlanmasına yardımcı olabilir.

Ağır tip bir tasarımla çalışırken zorlamayın. Bazen tam bir “ekran” doldurmak için yeterli metininiz olmaz. Less + More ve Type of Type, metin içeriğinde mükemmel bir şekilde boyutlandırılmış çoklu paneller oluşturmak için renk engellemeyi kullanır.

2. Beyaz Kutulardaki Metin

Web sitesi tasarım projelerinde pek çok cesur görsel öğeyle – ve bunlarla başa çıkmak için çok sayıda duyarlı nokta – beyaz kutular metin için bir kap öğesi olarak yeniden ortaya çıkıyor. İçinde koyu renkli metin bulunan beyaz kutular, renk varyansının olduğu fotoğraf, video veya resim üzerine mesajlaşmaya geldiğinde okunabilirliği sağlayabilir.

Ve bu eğilim biraz kulağa hoş gelse de, iyi… özensiz ya da tembel, aslında iyi yapıldığında harika görünüyor.

Bir resmin üzerinde herhangi bir yere sadece bir tokat alamazsınız ve en iyisini umarız. Beyaz kutuların, görüntünün önemli kısımlarını kapsamayacakları ve kullanıcıların tasarıma bakmalarında kendilerine doğru hareket etmeleri için stratejik olarak yerleştirilmesi gerekir.

Beyaz kutuların makul bir miktarda metin içermesi için yeterince büyük olması gerekir ve metin kutusundaki her şeyin ana görüntünün altına düşmesi gibi daha küçük ekranlarda bu öğe için bir planınız olmalıdır. Küçük ekranlarda bir resmin üzerine bir metin kutusu koymayı denemeyin. Çünkü, okuyamayacak kadar küçük bir metin kutusuyla sonuçlanacaksınız ya da kutu resmin çoğunun kendisini kapsayacak.

Beyaz kutu tedavisi için pot yaparsanız, eğlenin. Aşağıdaki örneklerin her biri tamamen farklı şekillerde beyaz kutular kullanmaktadır.

Do Space, görüntünün çoğunun görülebilmesi için görüntünün alt köşesine beyaz bir kutu keser. Beyaz kutu aşağıdaki beyaz boşluğa akar ve böylelikle hemen aşağıdaki panodan çıkmış gibi görünür. Bu teknik, ana kaydırıcının aşağıdaki içeriğe bağlanmasına yardımcı olur (hatta kaydırmayı da teşvik edebilir).

HowIt yuvarlak blokları kullanır, böylece beyaz metin kutuları arka plan resminin tonuyla daha iyi eşleşir. Şekildeki bu ince değişim, kutuların daha fazla sıvı görünmesi, elemanların birbirine bağlanmasına yardımcı olur, böylece kutular ve arka plan tutarlı bir his verir. Metin için beyaz kutuların, arka planda gelişigüzel bir şekilde yerleştirilmiş gibi hissetmelerini istemezsiniz. (Bu işe yaramaz ve kullanıcılar için uyumlu bir his yaratmanıza yardımcı olmaz.)

Macaulay Sinclair metin elemanını tutmak için bir görüntü paneli ızgarasının bir bölümünü kullanarak diğer örneklerden daha fazla metne sahiptir. Burada, beyaz kutunun arkasındaki görüntü hiçbir bilgi değeri sunmamaktadır. Diğer görüntülere benzeyen ve çoğunlukla metin elemanı ile tasarımın geri kalanı arasında bir uyum sağlamaya yarayan bir renk ve hareket şeması vardır.

3. Tipografi Kesikler

Hiç kimse, bu metnin katı dolu bir dizi harf olması gerektiğini söylemedi. Daha fazla tasarımcı, bir resmin üzerinde bir renk bloğu bulunan tipografi kesmelerini tercih ediyor, böylece görüntü net bir yazıyla geliyor.

Bu teknik, hala veya hareketli görüntülerle ve tam ekran bindirmeleriyle çalışabilir, böylece sadece az miktarda bilgi harfler (neredeyse bir doku oluşturmak için) veya daha fazla bir arka plan görüntüsü ile bir blok üstü görüntü stili ile gelir. gözle görülür.

Bu işi yapmanın hilesi doğru yazıdır. Harfler, arka planda görüntü veya doku görülebilecek kadar kalın konturlara sahip olmalıdır. Bunu tutarlı bir başarı ile ince veya yoğun yazı tipi ile yapamazsınız.

Bu teknik, kelime ve harflerin sayısı oldukça sınırlıysa, en iyi şekilde çalışır. 10 veya daha az harfle bir veya üç kelimeye tutun veya kullanıcıların bir bakışta bileceği çok yaygın kelimeler kullanın.

Danbury, kullanıcılara harekete geçirici görüntülü görüşme yapmaya teşvik etmek için bir çizim olarak parlak metin kesme kullanır. Tüm turuncu kutu sadece dev bir buton.

Fusion Winery yazıdaki bir bağın arka plan videosunu kullanır. Bu tasarım hakkında harika olan üçlü katman etkisidir: Ürün resminin altındaki beyaz metin kesiminin altındaki video arkaplanı.

Kaneko, harflerin doldurulması için tanımlanamayan bir görüntü kullanır. Bu stili seçerseniz, bu arka plandaki gibi bu arka planı basit tutun. Göze çarpan tuval üzerindeki metne dikkat çeken bir renk ve doku dokunuşu var.

SONUÇ

Tasarım kuralları, yaratılış için bir başlangıç noktası olarak mevcuttur. Bu yönergeleri görmezden gelme alışkanlığı kazanmak istemiyorsanız da, bir tasarım felaketi yaşayabilirsiniz – burada bir kural çiğnemek ve özel bir şeyler yaratmanıza yardımcı olabilirsiniz.

Şu anda hangi eğilimleri seviyorsun (veya nefret ediyorsun)? Hayran olduğunuz bazı web sitelerini görmek isterim. Bana Twitter’da yada Instagram’dan bana mesaj bırakabilirsiniz.