Ana Sayfa Örnek: Bir sonraki web tasarım projeniz için 8 ilham verici fikir
Bir sonraki web tasarım projeniz için ilham kaynağı olarak kullanabileceğiniz ana sayfa örnekleri mi arıyorsunuz? Önemli ana sayfa tasarımı. Ve biz sizinle birlikteyiz, çünkü doğru ev tasarımının işletmeniz için rekabet avantajı sağlayabileceğini biliyoruz. Ana sayfanız geliştirmek için çok önemlidir. Bununla birlikte, bu, müşterinizin sizin hakkındaki ilk izlenimidir ve çoğu tüketici, ana sayfanıza indikten sonra ilk üç saniyede sizin ve şirketiniz hakkında fikirler oluşturma eğilimindedir. Ana sayfanız ayrıca web sitenizin trafiğini çekmekten sorumludur. Ana sayfa, çeşitli kitleler ve kökenlerden gelen tüm trafiği destekleyecek şekilde tasarlanmalıdır.
Bu, ana sayfanızın trafiği çekmesi, ziyaretçileri eğitmesi ve dönüşümü davet etmesi gerektiği anlamına gelir. Baskı yok, değil mi? Düzeltmek çok önemli olsa da, birçok işletme ana sayfalarını doğru bir şekilde tasarlamak için mücadele ediyor. İyi tasarlanmış ana sayfa sadece bir ekrandan daha fazlasını gerektirir – bu sayfanın, ziyaretçilerinizin siteniz boyunca yolculuğu için bir başlangıç noktası sağlayan bir amacına sahip olması gerekir. Bu nedenle bu listedeki ana sayfa sadece tasarımıyla değil, aynı zamanda yaratıcılık ve potansiyel dönüşüm nedeniyle de ünlüdür. Aşağıda, web’de gördüğümüz en iyi ana sayfa tasarımlarından bazıları, onu çok istekli hale getiren tasarım veya optimizasyon tekniğine göre kategorize edilmiştir.
1. Kimliği Temizle Bilinen bir marka veya şirketseniz, kim olduğunuzu ve ne yaptığınızı açıklamanız gerekmeyebilir. Ancak, örneğin Coca-Cola veya Apple siz olmadıkça, işletmeniz hala kim olduğunuzu açıklığa kavuşturmalıdır, böylece her ziyaretçinin doğru yerde olduklarını bilir. Kim olduğunuzu belirtmek için bir yükümlülüğünüz olsa da, bunu akıllı ve ilginç bir şekilde yapabilirsiniz. Bunun için, aşağıdaki ilk örneğimize bakın, atıştırmalık türü: Neden hoşuma gidiyor:
Nazik atıştırmalık slogan çok parlak. Kolay ve net bir dille, mesaj hemen yankılandı ve Snack Bar etiketini kendimiz okumak istememizi sağladı.
Cesur renkler kontrast üretir, sayfada kelimeler ve görüntüler öne çıkarır. Ayrıca, renklendirme, mağazadaki tür ürünlerde gördüğünüz ambalajla tutarlıdır.
Kınamak atıştırmalıklarının ne zaman kurulduğunu ve görevlerinin hemen olduğunu bilmemize gerek yok: Bir navigasyon bağlantısı için saklandı.
2. Bu kolay gezinme bizi bir sonraki ilham verici tasarım ipucuna götürür: Kullanıcılar sayfalarınızı nasıl keşfedeceğinizi bilmelidir. İyi tasarlanmış navigasyon, meşruiyet, güvenilirlik ve otorite gösterir. Tüm müşteriler kolay gezinme bekler veya sayfanızı hızlı bir şekilde tıklarlar. Doğrudan verandadan ihtiyaç duydukları sayfaya net bir yol verin. Navigasyon menüsünü sayfanın üstünde görünür hale getirin ve bağlantıyı hiyerarşik yapıda ayarlayın. Akıllı bir kopya yazmak için bonus puanları, her navigasyon bağlantılarınızın her biri için netleştirin. Bu örnek için, Slim & Husky’s Pizza’yı cazip alın. Neden hoşuma gidiyor:
Sağ üst menü navigasyonunu bulmak çok kolaydır. Harekete geçme daveti basit ve doğrudan tıklanabilecek her navigasyon bağlantısında. Marka ile tutarlı yazı tipleri ve renklendirme. Büyük sloganlar, hemen yukarıda aynı stil ile bir navigasyon bağlantısı ile sağa dikkatinizi çeker.
İki navigasyon seçeneğinin basit ama akıllı katmanı, kullanıcıların kolayca dolaşmasına yardımcı olur. Menüler, sipariş ve konum gibi daha yaygın olanı tıklayın, ilk olun. Daha az yaygın ancak yine de önemli olan mağazalar, medya ve etkinlikler daha küçük ve daha hafiftir. Biz kesinlikle onlardan pizza sipariş düşünecek!
3. Her renk, yazı tipi, görüntü ve çizgilerin büyüleyici bir ruh hali ziyaretçileri ruh hali, ton ve atmosfer açısından farklı şekilde etkiler, böylece her karar önemlidir. İyi haber şu ki, şirketinizin veya markanızın misyonu ve amacı ile geldiğinde beyin fırtınası ruh hali ve tonu yapması muhtemeldir. Ana sayfanızı tasarlarken, ruh halinize uyan öğeleri seçin. Bununla birlikte, kullanıcılarınızın ve tüketicilerinizin ürününüzün ilk üç saniyede teslim edilmesini hissetmelerini istiyorsunuz. Bu örnek için, ruh hali nasıl satılacağını bilen Airbnb’ye dönüyoruz.
Neden seviyoruz:
Airbnb, benzersiz yatan hastalar sattıklarını bilir, bu yüzden elbette, şehvetiniz ana sayfalarına tıklarken hemen etkindir.
Tam bir sayfa resim kullanmak harika – kullanıcı hemen kendilerini Airbnb tarafından satılan bir macerada görmek istiyor (aşağıdaki tam sayfanın gücü hakkında daha fazla bilgi). Bu, çoğu ziyaretçinin ruh halini hemen anlamlı tıklamalara dönüştürmek için hemen aramaya geldiği bir arama formu içerir.
4. Tam Sayfa Görüntüsü İnsanların% 65’i görsel öğrencilerdir, tam bir sayfa görüntü kullanmak kitlenizi çekmenin bir yoludur. Ancak, sadece moda göründüğü için eski görüntüye bağlı kalmayın. Ne sunduğunuzu ve işinizi açıkça gösteren veya destekleyen görüntüleri kullandığınızdan emin olun. Duyguları yakalayan, eylemi teşvik eden ve anlatmak istediğiniz hikayeyi görsel olarak anlatan görüntüler kullanın. Görüntüler, düşük dosya boyutlarına sahip yüksek kaliteli görüntüler (Tinypng gibi araçlar yardımcı olabilir) ve ekran okuyucuları kullananlara erişilecek görüntülere alternatif metin eklemek için kullanılır. Çok etkili görüntüler için 4’ten fazla nehir duman evini arayın .
Neden seviyoruz:
Resim derhal ürünü istememizi sağlıyor. Dünyada cazip bir resim gibi satabilecek bir yazı yok.
Bu bağlantıyı tıklayan kişi, 4Rivers’in adını ne okuduğundan emin değilse, bu resim kesinlikle bu soruyu cevaplayacaktır.
Bu resim aynı zamanda 4river bir müşteri tabanını da çekecek. Ana başlık ile eşleştirilen görüntü yüksek bir talep duygusu yaratır, bu da bu ürünün kesinlikle geri dönmeye değer olduğu anlamına gelir. Resim, net bir navigasyon çubuğu için üstte yeterli alan olan “çevrimiçi mesaj” düğmesinin sloganı ve yerleştirilmesi için doğru kontrast ve odak noktasıdır. Büyüleyici bir görüntü seçmeyi unutmayın, ancak yine de metinde gezinmek için yeterli negatif alana izin verir.
5. İyi davranma daveti, tüm web sitelerinin ziyaretçilerin sitelerini ziyaret ettikten sonra harekete geçmelerini istemektedir. ACT (CTA) Daveti her zaman doğrudan satışları teşvik etmez, ancak müşterileri satış kanalına yönlendirebilir. Ana sayfayı tasarlarken CTA, gerekli diğer düğmelerle mantıklı bir şekilde yerleştirilmelidir. “Şimdi sipariş” veya “ücretsiz deneme” veya “daha fazla öğrenin” şeklinde olabilir. CTA basittir, ancak bunalmış veya kaybolmamaları için bir sonraki adımda ne yapmaları gerektiğini söylemek etkilidir. CTA ayrıca, göze çarpması için verandanın diğer kısımlarıyla zıt bir renkte görsel olarak çarpıcı olmalıdır. Sadece aşağıdaki CTA Hijau Freshbook düğmesine bakın.
Neden seviyoruz:
CTA ile kontrast ve konumlandırma kullanımı vardır. Pattele ana renk açık mavi olmasına rağmen, yeşil aksanlar iyi bir düğme rengi üretir. Kullanıcıların “ücretsiz” başlayabileceğini eklemek de kesinlikle daha fazla tıklama alacaktır.
Küçük işletme sahiplerinin% 97’sinin FreshBooks’u öneren CTA’nın hemen yanındaki istatistikler-o zaman tereddüt eden müşteriler tarafından görülmesi gereken bir cesarettir.
Ana bilgiler ve küçük ürün açıklaması olmasına rağmen, bu sayfa çoğunlukla kullanıcıların düğmeye tıklamasına odaklanmıştır. Ayrıca, gözleriniz aşağı bakamıyor ve FreshBook’lardan bahsetmiş olan büyük şirketleri ve yayınları göremiyor ve CTA çevresinde daha fazla güvenilirlik sağlıyor.
6. Yardımlara öncelik vermek sadece ne yaptığınızı açıklamak için değil, aynı zamanda sitenizdeki insanların neden ne yaptığınızı da önemsemeleri gerektiğine dair önemlidir. Beklentiler sizden satın almanın faydalarını bilmek istiyor çünkü onları hayatta kalmaya zorlayacak olan budur. Bir kopyasını hafif ve okunması kolay kalın ve müşteri dilinizi kullanın. Önceden kar satan şirketler için Evernote’dan öğrenin. Neden hoşunuza gidiyor:
Faydaları daha net olamaz: “İşini sakinleştirin, hayatınızı belirleyin.” Göz yolu sizi “Ücretsiz Kayıt” olarak hareket etme davetine götürür.Verandalarındaki faydaları, çok rahatsız edici olmayan ve ürünün özünü kolayca anlaşılan bir kopyada yakalamak için basit bir beyaz yazı tipine dahil etmek iyi bir iş çıkarır.
Bu ana sayfa, dönüşüm yolunu öne çıkarmak için tam sayfalı bir resim ve parlak yeşil vurgular ve tipik beyaz ve beyazını kullanır.
Evernote ayrıca, ziyaretçilerin daha fazla zaman tasarrufu sağlamak için Google üzerinden bir katlama kayıt süreci sunar.
7. Minimalist daha önce tartıştığımız gibi, minimalist bu yıl en iyi web tasarım trendi olmaya hazır. Veranda üzerindeki ince ve sofistike etkileri düşünün. Daha az kalabalık, nefes alacak daha fazla alan. Zor sorular, ana sayfanızın elde etmesi gereken her şeyle. Ancak, kullanıcı hızlı bir şekilde bilgi okuyabilir ve bulabilirse, yüklenemeyen çarpıcı bir görüntü veya videodan daha önemlidir. Pürüzsüz bir mesajı veya stok görüntüsünü hafif ve basit bir CTA düğmesi ile değiştirmeyi ve çevredeki rahatsızlığı ortadan kaldırmayı düşünün. Her zaman ince ve minimal olan siteler için ortama dönüyoruz. Neden hoşuma gidiyor:
Alternatif ana sayfadaki bu yeterince boş alan, etrafındaki her şeyi açıkça görülebilir hale getiriyor. Bu sayfada amaç, kullanıcıların orta uygulamayı indirmesini sağlamaktır, böylece sayfa bu özelliğin etrafında tasarlanmıştır. Sitenin geri kalanı hala navigasyon bağlantısında, ancak burada geliştiriciler o zaman amaçlarının ne olduğunu biliyorlar.
Ortam, e -posta yerine metin bağlantısını kullanarak kaydolmayı kolaylaştırır. Bu hücresel bölgeler için iyi bir fikirdir. Metin bağlantıları aramak için kullanıcılar cep telefonlarına baktığından bu sayfadan çıkmaya gerek yok.
Home, minimalist bir temayla kalmak için parlak renkli yazı tipleri kullanır. Yeşil patlamalar daha etkili hale gelir.
Ziyaretçilerin tıklamaya başlaması için iyi sosyal kanıtların kullanılması. “Orta Popüler” ve “Personel Seçimi” bölümü, yüksek kaliteli içerik bulan kullanıcılara anlatır.
8. Video Kucaklama Sosyal medyada zaman geçirirseniz, her köşede bir video olduğunu biliyorsunuz. Web tasarımı ayrıca doğrudan verandada rulo veya kısa videolar çeviren sayfalarla video trendlerini de benimser. Bu, şirketinizin kullanıcılarının kısa video sunumlarında ürününüz hakkında her şeyi kolayca oturabileceği ve görebileceği pasif bir etkinlik olmasını sağlar. Ancak – ilginç veya çekici olmalı veya kullanıcı uzun sürmeyecektir.
Ana sayfanızda video kullanmayı düşünüyorsanız, sağlam hedefleriniz ve planlarınız olduğundan emin olun. Yükleme süresini ve videonun sitenizin arkasındaki hedefi nasıl artırdığını düşünün. Ürününüz veya şirketiniz kullanıcının daha ileri gitmeden önce görmesi gereken bir şey mi? Bir örnek için A24 filmine bakın. Neden hoşunuza gidiyor: Bu kesinlikle ihtiyaçların ihtiyaçlarını cevaplar: Film şirketi, evlerinde tam sayfa bir video için uygun olmalıdır.
Videonun yaklaşan film projeleri için bir snippet olduğunu gören video, kullanıcılara hemen estetik ve ürünler hakkında bilgi veriyor. Bu sadece harekette tam olarak anlamak için görmeniz gereken bir şey.
Verandanın tepesinde A24, daha fazla bilgi edinmek veya nasıl iletişim kuracağını öğrenmek için basit navigasyon bıçakları sunar. Bu sitedeki kullanıcıların film stüdyoları hakkında bilgi edinmek isteyeceğini ve daha sonra biriyle daha fazla bilgi için iletişim kurmak isteyeceğini biliyor, bu yüzden bulmak daha kolay olamaz. Tüm bunlar önyükleme için tam bir video ile!
Bir sonraki ana sayfanız için ilham hissetmek verandanız bir el sıkışma gibidir. İlk izlenimi belirlemeli ve kullanıcıları daha fazlasını öğrenmek için kalmaya teşvik etmelidir. Müşteri olmaya karar vermeden önce, ne sattığınız, onlar için neden önemli olduğu ve sunduklarınızdan nasıl yararlanabilecekleri hakkında bir fikir edinmek için ana sayfanızı gözden geçireceklerdir.
Parlak veranda, yukarıda belirtilen unsurlara olmasa da en az birkaç tane girmelidir.Umarım bu örneklere ve neden işe yaradığına bakarak, en çok kim olduğunuzu iletişim kuran ev tasarımını denemek için ilham alacaksınız.Ardından, herkesi görmek için inanılmaz bir veranda yeniden yapabilirsiniz! Ücretsiz e -kitabı indirin: 65 Web Tasarım Gereksinimleri Bilmeniz Gereken
PDF İndir
Rachel Kolman Rachel Kolman serbest yazar ve editördür.Hayatının ilk otuz yılını Doğu Kıyısı’nda geçirdikten sonra Kuzeybatı Pasifik’in yeni bir sakinidir.Yaratıcı yazımda bir MFA başlığı var ve içeriğin yazılmasına hikaye anlatımı öğeleri dahil etmekten mutluluk duyuyor.Müşterilerin profesyonel belgeleri düzenlemelerine ve cilalamasına yardımcı olmanın yanı sıra Web genelinde çeşitli yayınlar için yazmıştır.Rachel, yazmanın yanı sıra, masa oyunlarını, lezzetli kahveyi, çok fazla podcast’i ve seyahat etmeyi, dağlarda tercih ediyor.
