“Tasarımcı Olmayan” için 3 Etkili Web Tasarım İlkeleri
Yeni web tasarımcılarını ve “tasarım için gözleri” olmayan biri olarak tanımlamaya yardımcı olmak için etkili tasarım uygulamalarını keşfettiğimiz mini serimiz “Etkili Divi Web Tasarım İlkeleri” nin 2 bölümüne hoş geldiniz.
Önceki yazımızda, zihniyetinizi hazırlama ve tasarım için daha iyi bir göz geliştirmeyi öğrenmenin bazı yollarını tartıştık. Bu yazıda, web tasarımının “tasarımı” konusunda daha iyi olmak için web tasarım çabalarınıza hemen uygulayabileceğiniz iyi bir tasarımın bazı evrensel ilkelerine odaklanacağız.
Hadi düz gidelim! 3 Etkili Web Tasarım İlkeleri “Tasarımcı Olmayan” için bu serinin 1. Bölümünde belirtildiği gibi, tasarım açısından doğru veya yanlış yoktur. Bu yazıda tartışacağımız şey, genel olarak web tasarım topluluğunda çoğunlukla ve evrensel olarak iyi bir tasarım ilkesi olarak kabul edilmektedir. Bu aynı zamanda, neredeyse on yıl ve daha önemli deneyime, yüzlerce mutlu ve memnun müşteriye sahip bir divi web tasarımcısı olan bir grafik/basılı tasarımcı olarak kişisel kılavuzumdur. Bu ilkeleri yaptığım her bir divi web sitesi tasarımı için uyguluyorum ve her zaman korkunç veya olağandışı bir şey isteyen bir müşteri olmasına rağmen, bu size 10 kez en az 9’a hizmet edecektir.
1) Üçte birinin kuralları, basit bir kuralı takip etmek için tüm web tasarımları, grafik tasarımları, basılı tasarım, fotoğraf ve diğer yaratıcı medyada en yaygın uygulamalardan biridir – üçte bir kural. Kısacası, üçte birinin kuralları simetri ve denge ile ilgilidir. Üçüncü -üçüncü kuralın amacı, tasarımda daha fazla denge ve uyum elde etmenize yardımcı olmayı amaçlamaktadır. Ve en iyi yanı – üçte birinin kurallarını grafikler, resimler, tüm web sayfaları düzenleri ve daha fazlası uygulayabilirsiniz! Üçüncü kuralların bilimsel olup olmadığı konusunda birçok çevrimiçi görüşme vardır, ancak bunun dışında, kamuoyu, görüntü veya tasarım solda, sağ veya üst ve altta çok benzerse, izleyicinin bulabileceğini gösterir. sıkıcı veya sıkıcı. Eğer üçüncü bir kural, ilginç kalır ve aşağıda tartışacağımız iyi bir akış üretebilir. Divi web içeriğinizi optimize etmek için tasarım ipuçları hakkında önceki yazımızda, bu da bir ızgara sistemi olarak da adlandırılır. Görsel olarak düşünmenin iyi bir yolu. Şuna benzeyen bir ızgara hayal edin:
Görüntüler, grafikler veya düzenlerdeki bu hayali ızgara ile içeriği bir veya birkaç ana kavşak noktasının yakınına kolayca yerleştirebilirsiniz. Nesneyi ve odak noktasını 1 veya 4’ten fazla kavşak noktasında tutmak, konunun kesişme noktasının altında olduğu ikinci örneğe kıyasla genellikle çok daha dengeli ve simetrik bir ekran üretecektir. Aşağıdaki resme bakın. İlk örnek üçte bir kurallara uymaz. Bu örnek üçte birinin kurallarını izler. İlk örnek hala iyi bir resim olsa da, üçüncü bir kural kullanmak, üçüncü üçüncü kurallarda alt kesişme noktası ile ön arka planı keserek görüntüde tamamen farklı bir nüans verir. Üçüncü bir ızgara kurallarıyla resme bakalım. Şimdi üçüncü kuralların kesiştiği yerde sıraya girmeden resme bakalım. Dikkat çeken tasarımın genellikle bir veya daha fazla kavşak noktasına nasıl paralel olduğu açısından büyük bir fark görebilirsiniz. Üçüncü kurallar en çok fotoğraf ve videografide tartışılmış olsa da, web sitesinin tasarımı için önemlidir. Size üçte bir kuralları kişisel siteme nasıl uyguladığımı göstereceğim. İzleyicilerin aşağı kaydırmadan önce gördükleri için geçerli olan ilk “Paro Up” tasarımından aşağıdaki alıntı. Şimdi, üçüncü ızgara kuralını ana parçanın üzerine koyalım ve görünüşü görelim. Bu durumda, üçte bir kuralları uyguladığım ana menü altındaki içeriğe odaklanacağım. Bu örnekte, kavşak noktasında veya yakınında 4 ana öğe vardır. Kısacası, aşağıdakileri vurgulamak istiyorum: Kim olduğum ve bu sitenin ne olduğunun kısa bir açıklaması. Yeni kullanıcıların kimi duyacaklarını görerek daha rahat ve güvenilir hissetmelerine izin veren görüntüler.
En son e-kitap grafikleri, insanlara kaydolmak için bir neden veriyorum.
Son olarak, davet e -postası, kullanıcının gözlerinin biteceği son 2 karede kayıt yaptırmaya yöneliktir.
Kuralların üçte biri ile, genellikle her kavşak noktasında (özellikle fotoğrafta) bir şey olması en iyi uygulama değildir, ancak bu düzeni web sitemde takip ediyorum. Ve kayıt için: Soldan sağa okuduğumuz için, genellikle ekranın ortasında veya sağında hareket etme davetiyem var çünkü gözlerimiz burada bitiyor. Bu serideki son yazıda daha ayrıntılı olarak hareket etme davetini tartışacağız, ancak bu, üçte birinin kurallarını tasarımıma nasıl uyguladığımın iyi bir örneğidir. Bu nedenle, bir web sayfasının nasıl düzenleneceğinden emin değilseniz veya görüntüleri, metni ve belki de harekete geçme davetini nasıl karıştıracağınızdan emin değilseniz, üçte bir kurallara uymaya çalışın ve rehberiniz olmasına izin verin, doğru ya da yanlış bir stil yok . Genellikle projeye, müşterinizin isteklerine, tasarım tarzınıza ve genellikle hedeflediğiniz pazara bağlıdır. Çoğu zaman, dijital veya web tasarım aracıları, moda ve tasarım fotoğrafçılığı gibi hizmetlerde minimalist bir görünüm ve his ile daha modern ve modaya uygun. Modern tasarımlarla, daha fazla açık alan görünür, daha az metin tabanlı içerik, daha fazla resim ve belki daha fazla rulo. (Bazı eski müşterilerim sadece ürperdi!)
Üretim, hukuk firmaları, mavi -collar endüstrileri vb. Gibi daha geleneksel iş pazarlarında, daha fazla metin tabanlı içeriğe, daha az açık alanlara ve hiç şüphesiz görüntü ve daha az tasarım öğesine sahip web siteleri bulabilirsiniz … çekici. Ve herhangi bir nedenle, bu sektördeki müşterilerimin çoğu çok fazla ruloya karşı. Bu yüzden iyi bir akışla bir düzenin nasıl tasarlanacağını bilmek anahtardır! Sık sık yaratıcı tasarım stilimi müşteri endüstrisimde, hedef demografik özellikler ve müşterilerimin arzu ve ihtiyaçları ile başarılı olanla denemek ve denemek zorunda olduğumu görüyorum. Söylenen her şeyle birlikte, kim çalışırsanız veya hangi sektörde uygulanıyor olursa olsun uygulanabilecek birkaç temel düzen ve temel prensip vardır. Yukarıda belirtilen önceki gönderileri görerek, takip edilecek çok önemli yönergeler tasarım kalıplarıdır. Bunu genellikle her hafta sağlanan birçok yeni profesyonel divi düzen kiti ile bulacaksınız. Bakalım ne demek istediğimi görelim. Soldaki ilk örnekte, solda bir resim var, davet düğmesiyle sağdaki metin iyi bir hareket ediyor, sonra gözleriniz metnin/CTA’nın başka bir kısmına doğru okundu ve sonra başka bir görüntü ile bırakıldı. Doğru ve tekrar. Tersine, sağdaki resimde ters bir desen vardır. Görüntüye metne, metne vb. Metin. Bu Z tarzı deseni takip etmek, okuyucuyu çekmenin iyi bir yoludur ve metin ve görüntüleri birlikte dengelemenin iyi bir yoludur.
Bu değil ‘
İyi bir sayfa tasarımındaki akıştaki düzen için tek seçenek, ancak iyi bir uygulama, içeriği soldan aşağıya doğru almamızdır. Sonra soldan sağa doğru vb. Şüphe varsa, sayfa içeriğinizin akışını ayarlamaya yardımcı olmanın bir yolu olarak Z stili desenini takip etmeye çalışın. Ve Rolls-i hakkında son bir not, sitemi 3-5 parşömende tutma eğilimindedir. Çoğu zaman, sayfa o kadar büyük ve yükleme o kadar yavaş kaydırmanız gerekir. Bir kez daha, kaydırma açısından doğru ya da yanlış bir şey yoktur, ancak daha eski bir zihniyete sahip müşterilerle hiç çalışmadıysanız, bazı çatışmalar yaşamanız garanti edilir. Müşterileri, kaydırmanın korkulmasına gerek olmadığı konusunda tekrarlamaya çalıştım. Sosyal medya bizi hızlı bir şekilde kaydırmaya ve içerik almaya devam etmemiz için eğitti. 3) Görsel Hiyerarşi Burada göstermek istediğim son ana ilke görsel hiyerarşi. Kısacası, hiyerarşi kullanıcıların en önemli bilgileri bilmelerine ve onlara gözlerinin tasarımınızda nerede olduğu hakkında çok net bir yön vermelerine yardımcı olur. Hiyerarşiye genellikle tipografi (üçüncü yazımızda tartışacağımız) ile atıfta bulunulur, ancak sitenin grafik öğeleri, görüntüleri ve genel tasarımında da çok önemli olabilir. “İyi Tasarım” bölümünde eksik hissettiğim siteleri kasten göstermeyeceğim, ancak net bir netlik olmadan aynı boyutta metin ve görüntüleri olan birçok site bulduğunuzdan eminim. Harekete geçmek için arayın, değil mi?
Kaçmak istediğimiz şey bu. İyi bir hiyerarşi kullanmak, web sitenize ne tıklamaları veya yapmaları gerektiğini öğrenmeleri için yönlendirmenin en iyi yoludur. İşte hiyerarşiyi göz önünde bulundurarak yaptığım en son tasarımın bir örneği: Sağ üstteki logo ve telefon numarası açıkça büyük ve görünür olsa da, en büyük içerik ve üst parodaki en parlak renk, tıklamaya davet etmek için davetlidir. düğme.
Bu durumda, müşterinin ana harekete geçme daveti çevrimiçi alışveriş yapmak veya doğrudan bunlarla iletişim kurmaktır. Logo, kısa bir açıklama ve hatta telefon numarası yaygındır, ancak Divi Double düğmesi, kullanıcıların daha fazla kaydırmazlarsa aradıklarını tıklamalarını umduğunuz en büyük unsurdur.
Bu nedenle, bir kez daha, sadece birkaç görsel hiyerarşiye örnek olmasına rağmen, bu, web sitesi kullanıcılarınızı yapmak istediklerinizi yapmaya veya istediğiniz yere gitmeye yönlendirmede çok etkili bir yöntem olabilir! Ayrıca, önlenecek genel web tasarımı hataları hakkındaki önceki yayınlarımızı kontrol etmenizi şiddetle tavsiye ederim. Kapanışta, bu etkili tasarım ilkeleri, web tasarımında yeni olun, ister tasarımda daha iyi olmak isteyin tasarım çabalarınızda size yardımcı olmasını umuyorum! Bir kez daha, tartışabileceğimiz birçok ilke var, ancak bunlar tüm web sitesi tasarımlarımda uygulanmaya çalışan ilk 3. Paylaşmak istediğiniz başka tasarım ilkeleriniz varsa, aşağıdaki yorumlarda bize bildirin! Yarın: Her Web Yapma Sitesine odaklanması gereken 3 Önemli Tasarım Alanı Zihniyetimizi hazırlamayı, tasarım hakkında daha iyi bir görüşe sahip olmayı nasıl öğreneceğimiz ve bazı temel tasarım ilkelerini tartıştık, son yazımız en çok araştıracak Tasarım ağının odaklanması gereken önemli yönleri. Bir web sitesinin her yapımı. O zamana kadar! Büyük duyuruları, yararlı ipuçlarını veya divi freebie’yi asla kaçırmayacak şekilde e -posta bültenimize ve YouTube kanalımıza abone olduğunuzdan emin olun!
