Mükemmel Altbilgi Tasarımına Sahip 15 Divi Web Sitesi

Altbilgiler bir web sitesi tasarımının önemli bir parçasıdır, ancak aynı zamanda tasarlanması en zor alanlardan biri olabilirler. Çoğu, gezinme, iletişim bilgileri ve sosyal takip düğmeleri gibi temel öğeleri içerir, ancak onları öne çıkarmak ve hatta ilginç görünmelerini sağlamak başka bir hikaye. Bu yazıda, bir sonraki Divi web siteniz için size ilham vermek için mükemmel altbilgi tasarımına sahip 15 Divi web sitesine bakacağız.

Bu siteleri renk, resim, tipografi, gezinme, sosyal simgeler, iletişim bilgileri, harekete geçirici mesajlar, bülten kayıtları vb. kullanımlarına göre seçtim. Onlarla ilgili ilginç bulduğum şeyleri belirteceğim. Web sitesinin geri kalanına nasıl uyduğunu görebilmeniz için tam ekran görüntüsünü ekledim.

Elegant Themes öğreticilerine birkaç bağlantı ve Divi ile altbilginizi oluşturmanıza yardımcı olacak Divi 100'den ücretsiz bir düzen paketi için sonuna kadar bekleyin.

Şimdi, belirli bir düzende olmayan altbilgilere gelelim…

1. JC Pohl

Bu, tam genişlikte bir e-posta kayıt formu sağlamak için basit bir alt bilgidir. Beyaz ve mavi/yeşil metin, düğme ve simgeler içeren koyu bir arka plan kullanır. Renkler web sitesiyle mükemmel uyum sağlar. Metin, bültene kaydolmak için kısa bir harekete geçirici mesaj sağlar.

Siteyi ziyaret et

2. Benton Brothers Güzel Peynir

Bu, iki sıra halinde iki renkli bir tasarım oluşturmak için koyu metinli açık krem ​​arka plan kullanır. İlk satır sosyal takip butonlarını, logoyu ve haber bültenini birbirinden ayırır. İkinci satır, her bağlantı bir çubukla ayrılmış bir kutu içinde alt bilgi menüsünü ve telefon numarasını görüntüler.

Siteyi ziyaret et

3. SpotX

Bu altbilgi iki satır kullanır. İlk sıraya üç sosyal ağ için sosyal beslemeler yerleştirirken, ikinci sıra bir tarafta büyük kare sosyal takip simgeleri, ortada küçük bir logo ve en sağda küçük bir alt bilgi navigasyonu görüntüler. Telif hakkı bildirimi, navigasyonun altına yerleştirilmiştir.

Siteyi ziyaret et

4. Sosyal Yardım Artı

Bu, dalgalı ayırıcı çizgi boyunca yerleştirilmiş daireler içinde ekip üyesinin resimlerini içeren ilginç bir bölüm ayırıcı kullanır. Alt bilgi alanı, bilgiler, bağlantılar ve iletişim bilgileri içeren beyaz metinli siyah bir arka plan kullanır.

Siteyi ziyaret et

5. GCON

Bu web sitesinin altbilgisi, beyaz metin ve turuncu vurgulu koyu mavi bir arka plana sahiptir. Üçüncü sütunda iki satır bulunan üç sütun kullanır. Logo önceki bölümle örtüşüyor. İletişim bilgileri, turuncu kare kenarlıklı sosyal simgeleri içerir. Altbilgi gezintisi, her biri silik bir çizgiyle ayrılacak şekilde dikey olarak yerleştirilir. Bülten formu basit ama göze çarpıyor. Hakkımızda bilgileri kalabalık değildir ve okunması kolaydır.

Siteyi ziyaret et

6. HEJ Kahve Şirketi

Bu sitenin altbilgisi, alanın çoğunu kaplayan siyah arka plana sahip bir resim kullanır. Resim ve metin üç sütun oluşturur. Her öğenin tamamı büyük harflerle bir başlık görüntüleyen beyaz metin kullanır. Sosyal simgeler ve bağlantılar biraz gri. Aynı zamanda basit ve cesur.

Siteyi ziyaret et

7. Les Anagnou

Bu, web sitesiyle mükemmel uyum sağlayan beyaz bir arka plan ve yumuşak renkler kullanır. Metin küçüktür, çok fazla boşluk oluşturur. İki satır kullanır. En üst satırda, ilgili kişi ve bilgi içeren üç sütun görüntülenir. Orta sütun, logoyu sosyal simgelerle ve tasarımcının bağlantısını görüntüler. Sağdaki sütun, bir harekete geçirici mesaj ve küçük bir e-posta kayıt formu sağlar. İkinci satır, alt bilgi gezinmesini görüntüler. Her iki satır da bir çizgi ile ayrılmıştır.

Siteyi ziyaret et

8. Newton Yazılımı

Bu basit ve temiz görünüyor. Tipik altbilgi düzenleri, dört widget alanı sütunu kullanır. Bunun beş sütunu var ve hala çok fazla boşluk bırakmayı başarıyor. Soldaki sütun, (ön plana çıkan renk olan) logoyu, hakkında bilgi, sosyal bağlantılar, telif hakkı ve bağlantılarla birlikte görüntüler. Diğer dört sütun, tipik altbilgi gezinmesini ve ardından ayrıntılı iletişim bilgilerini ayırır. Alt kısımda tam genişlikte bir e-posta kayıt formu var.

Siteyi ziyaret et

9. eGaushala

Bu web sitesi açıklanmış bir altbilgi kullanır. Kaplama kısmı dört sütun görüntüler. Şirket logosunu, bilgileri, sosyal düğmeleri, telif hakkını, tasarımcıyı ve bağlantıları gösterir. Sonraki, küçük resimleri ve başlıkları görüntüleyen makalelere bağlanan iki sütundur. Son sütun, gömülü bir Twitter beslemesini görüntüler. Ortaya çıkan bölüm, bir bindirme içinde CTA'lı tam ekran bir görüntüdür. Renkler sitenin markasıyla eşleşiyor.

Siteyi ziyaret et

10. Tekme Bisiklet

Bu web sitesi ayrıca açıklanmış bir altbilgi kullanır. Bindirme bölümü, başlık ve CTA ile birlikte tam ekran bir resim görüntüler. Ortaya çıkan bölüm, içeriğin ortasında siyah bir arka plan kullanır. Büyük kare sosyal simgeler ve altında düğme bulunan e-posta kayıt formu ve telif hakkı ve bağlantılar içeren bir satır görüntüler.

Siteyi ziyaret et

11. Telepizza

Bu, bağlantıları görüntülemek için içerik alanındaki CTA'ların hemen altında üç bölüm kullanır. Her üç bölüm de sitenin geri kalanıyla eşleşen renkleri kullanır. İlki, hafif bir arka plan üzerinde gri sosyal simgeleri gösterir. İkincisi, altbilgi gezinmesini kırmızı bir arka plan üzerinde beyaz metin olarak görüntüler ve her bağlantı kendi kutusunda yaşar. Üçüncüsü daha koyu kırmızı bir arka plana sahiptir ve iletişim sayfasına ve yasal bilgilere bağlantılar içerir.

Siteyi ziyaret et

12. Bulut Dokuz

Bu, altbilgi alanında çok fazla bilgi görüntüler, ancak yine de takip etmeyi kolaylaştırmayı başarır. Beyaz ve turuncu vurgularla mavi bir arka plan üzerinde dört sütun görüntüler. En solda, sertifikaları gösteren şirket rozetleri var. Bunun ardından iletişim bilgileri ve bir CTA gelir. Sonraki sütun, gezinmeyi dikey olarak görüntüler. Son sütun, bir e-posta kayıt formu içeren bir CTA sayfasının bağlantısını görüntüler.

Siteyi ziyaret et

13. Ebert Stüdyosu

Bu web sitesi, desenli bir arka plan üzerinde dört sütunda basit bir alt bilgi görüntüler. Dört sütun yaygındır, ancak bunun haritayı gömme şeklini seviyorum. Haritanın altındaki metni seçmek, Google Haritalar'ı yeni bir sekmede açarak haritayı tam ekran görmenizi sağlar. Ayrıca logo, dikey menü ve sosyal takip butonları ile iletişim bilgileri de dahildir. Renkler web sitesinin markasıyla eşleşir.

Siteyi ziyaret et

14. Lauren K Stein

Bu, 2015'teki Footer Design Challenge kazananlarından biriydi. Bir ton bilgi içeriyor, ancak görmesi ve gezinmesi kolay. Bilgileri, olaylara bağlantılar, kaynaklara bağlantılar ve sosyal takip düğmelerini görüntülemek için çok renkli metin içeren koyu mavi bir arka plan kullanır. Başlıklardaki simgeler bölümlerin öne çıkmasına yardımcı olur. Bunun altında, web sitesinin geri kalanıyla aynı renkleri kullanan standart alt bilgi navigasyonu bulunur.

Siteyi ziyaret et

15. KR Dijital Çözümü

Bu aynı zamanda 2015'teki Footer Design Challenge kazananlarından biriydi. Gördüğüm en basit ve en temiz altbilgilerden biri, ancak yine de zarif görünüyor. Beyaz metinli siyah bir arka plan kullanarak, logoyu yanda, diğer yanda linkleri görüntüler. Bağlantılar, basit bir slogan olarak başlık metnini içerir. Bağlantılar tire ile ayrılır. Telif hakkı, menüden ayrı durmak için daha parlak beyaz renktedir.

Web Sitesini Görüntüle

Biten Düşünceler

Bu, bir sonraki Divi web siteniz için size ilham vermeye yardımcı olacak mükemmel altbilgi tasarımına sahip 15 Divi web sitesine bakışımız. Bazılarını sadeliklerinden dolayı seviyorum. Başkalarını takip etmesi kolay karmaşık bilgiler sağlamalarından dolayı seviyorum. Bunlar, çok fazla bilginin küçük bir alana nasıl yerleştirilebileceğinin ve okunabilir kalmasının mükemmel örnekleridir.

Divi ile altbilgi tasarımı ve ücretsiz bir düzen paketi hakkında daha fazla bilgi için makalelere bakın:

• Divi ile Alt Bilgi Gösterimi Nasıl Oluşturulur
• Divi Altbilginizi Nasıl Sabit Yapabilirsiniz?
• Divi Alt Bilginizi Nasıl Yapışkan Yapabilirsiniz?
• Ücretsiz Divi Altbilgi Düzeni Paketi: Sitenize Ayak Katacak 10 Benzersiz Altbilgi Tasarımı

Senden duymak istiyoruz. Bu altbilgi tasarımlarından hangisi favoriniz? Aşağıdaki yorumlarda bize bildirin.

VectorA / Shutterstock.com aracılığıyla Öne Çıkan Görsel