B2B Web Sitesi Tasarımı: Satın Alma Komiteleri İçin En İyi Uygulamalar

İyi B2B web sitesi tasarımı bir girişim ya da banka gibi görünmekle ilgili değildir. Aynı şirketten, her biri farklı bir soruya sahip beş altı kişinin, önce satış ekibiyle konuşmadan yanıtlarını bulabilmesiyle ilgilidir. Çoğu B2B web sitesi hayali tek bir ziyaretçi için tasarlanır: ana sayfayı baştan sona okuyup "Demo ayarlayın"a tıklayan bir karar verici. Böyle biri nadiren vardır.

Bu rehber, B2B web sitesi tasarımını alıcının bakış açısından ele alıyor: her sayfanın ne yapması gerektiği, aynı siteyi birden fazla rol ve sektör ziyaret ettiğinde navigasyonun nasıl çalışması gerektiği, tanımlayamadığınız ziyaretçiler için nasıl tasarım yapılacağı ve sayfaların daha sonra uyarlanabilmesi için değiştirilebilir slotlarla nasıl kurulacağı. Sonunda açıklamalı temsili bir örnek ve kopyalayabileceğiniz bir önce/sonra yeniden tasarım yer alıyor.

Görüşümüz: Personaya Değil, Komiteye Göre Tasarlayın

Çoğu B2B web sitesi tasarım brief'i bir persona ve bir marka mood board'uyla başlar. Bize göre bu yanlış bir başlangıç noktası. Bir B2B satın alma kararını bir satın alma komitesi verir ve web sitesi, komitenin üyeleri tarafından ayrı ayrı, farklı zamanlarda ve farklı amaçlarla ziyaret edilir. Bütçe sahibi karar verici maliyeti ve riski bilmek ister. Kullanıcı, ürünün günlük işi görüp görmediğini bilmek ister. BT ekibi güvenlik ve entegrasyonları öğrenmek ister. Satın alma birimi ise koşulları ister.

Alıcılar bu işin çoğunu da kendi başlarına yapar. Gartner'ın 2018'de yayımladığı araştırma, potansiyel müşterilerin satın alma sürelerinin yalnızca yaklaşık yüzde 17'sini tedarikçilerle görüşerek geçirdiğini ve bu sürenin değerlendirdikleri tüm tedarikçiler arasında bölündüğünü ortaya koydu. Geri kalanı araştırmadır ve bunun büyük kısmı tedarikçi web sitelerinde yapılır.

Yani tasarım sorusu “ideal müşterimiz ne görmek istiyor?” değildir. Soru şudur: “Şu anda bu sayfada komitenin hangi üyesi var ve cevabını bir dakikadan kısa sürede alabiliyor mu?” Bunu iyi yanıtlayan bir site genellikle ödüllü bir siteden daha sade görünür. Daha iyi dönüşüm sağlar, çünkü kimse Salesforce ile entegre olup olmadığınızı öğrenmek için satış ekibine e-posta göndermek zorunda kalmaz.

Bir B2B Web Sitesini B2C'den Farklı Kılan Nedir

Sayfa sayfa rehberliğe geçmeden önce kısıtları açıkça ortaya koymak faydalı olur. Tasarım kararlarını yönlendirmesi gereken farklar şunlardır:

Bunların hiçbiri B2B sitelerinin yoğun olması gerektiği anlamına gelmez. Hiyerarşinin birkaç kişiye hizmet etmesi gerektiği anlamına gelir. Bunun kullanılabilirlik tarafını daha ayrıntılı görmek isterseniz kullanıcı dostu B2B web siteleri yazımız UX kalıplarını, formları ve hızı ele alıyor.

Sayfa Sayfa B2B Web Sitesi Tasarımı En İyi Uygulamaları

Her temel sayfanın tek bir görevi vardır. Bir sayfa üç görev üstlenmeye çalıştığında hiçbirini iyi yapamaz.

Ana sayfa: Satış konuşması yapmayın, yönlendirin

B2B ana sayfası bir santraldir. Oraya gelen ziyaretçi genellikle adınızı bilir (bir tavsiyeden, bir reklamdan, bir G2 kaydından) ve iki şeyi hızla teyit etmek ister: Ne yaptığınızı ve kendi şirketleri gibi şirketlere uygun olup olmadığını. Sayfayı ikisini de ekranın üst kısmında yanıtlayacak, ardından yönlendirecek şekilde tasarlayın. İş ortağı ve satış ortaklığı yönlendirmeleri de çoğunlukla buraya düşer; SaaS satış ortaklığı pazarlaması rehberimiz bu trafiğin bunun yerine nereye gitmesi gerektiğini anlatıyor. B2B ana sayfa örnekleri galerimiz, 11 yazılım şirketinin bu yönlendirme işini bugün nasıl yaptığını gösteriyor.

• Başlık: sonuç ve kategori, sade bir dille. "Çok ülkeli ekipler için bordro yazılımı", "İşin geleceğini güçlendiriyoruz" ifadesinden daha iyidir.
• Alt başlık: Şirket türüne veya büyüklüğüne göre kimin için olduğu.
• Kanıt şeridi: Tanınmış müşteri logoları veya tek bir somut sonuç; en altta değil, doğrudan başlığın altında.
• Yönlendirme bloğu: "Finans / İK / BT'deyim" ya da "SaaS / üretim / sağlık için çözümler"; her biri o okuyucu için hazırlanmış bir sayfaya bağlanır.
• Bir birincil, bir ikincil CTA: Örneğin "Demo talep edin" ve "Fiyatları görün". Daha fazla seçenek dikkati böler.

B2B ana sayfa kişiselleştirme rehberimiz, farklı ziyaretçi segmentleri için ana sayfada neyin değiştirileceğine daha ayrıntılı giriyor.

Çözüm ve sektör sayfaları: ilk satış görüşmesinin işini yapın

Bu sayfalar bir B2B web sitesi tasarımında yükün çoğunu taşır ve genellikle en zayıf olanlardır. İyi bir sektör sayfası bir keşif görüşmesinin ilk 15 dakikası gibi okunur: İşte sektörünüzün yaşadığı haliyle sorun, işte sizinki gibi ekiplerin bunu bizimle nasıl çözdüğü, işte sektörünüzden bir müşteri, işte uygulama sürecinin nasıl göründüğü. Sayfa, sektör adı bul-değiştir ile başka bir sektöre kopyalanabiliyorsa işini yapmıyor demektir. İçeriği dikey bazında nasıl yapılandıracağınız için sektöre özel web sitesi kişiselleştirme yazısına bakın.

Fiyatlandırma sayfası: Rakamları gizleseniz bile modeli açıklayın

Pek çok B2B şirketi tek bir fiyat yayımlayamaz. Bu sorun değil. İşe yaramayan şey, üç sütununda da "Bize ulaşın" yazan bir fiyatlandırma sayfasıdır. En azından fiyatın neye bağlı olduğunu (kullanıcı sayısı, hacim, modüller), tipik sözleşme süresini ve uygulamaya nelerin dahil olduğunu açıklayın. Bütçe sahipleri bu sayfayı, satın alma birimini sürece dahil etmeye değip değmeyeceğine karar vermek için kullanır. B2B fiyatlandırma sayfası kişiselleştirme yazımız sayfayı şirket büyüklüğüne göre nasıl uyarlayacağınızı anlatıyor.

Kanıt sayfaları: vaka çalışmalarını hızlı taranabilir hale getirin

Vaka çalışmalarını şüpheci okuyucular okur, çoğunlukla döngünün sonlarında. Bunları okuyucunun karşılaştırılabilir bir şirketi saniyeler içinde bulabileceği şekilde tasarlayın: sektöre ve şirket büyüklüğüne göre filtreler ve her çalışmanın başında başlangıç durumunu, neyin değiştiğini ve ölçülen sonucu içeren bir özet kutusu. Bir formun arkasındaki PDF indirme yığını bir kanıt kütüphanesi değildir.

Güvenlik, entegrasyon ve uygulama sayfaları

Bunlar B2B web sitelerinde en sık eksik olan sayfalardır ve anlaşmayı veto edebilecek satın alma komitesi üyeleri tarafından okunur. Gerçek kurulum ayrıntıları içeren bir entegrasyon dizini, sertifikaları ve veri işleme yöntemlerini açıkça listeleyen bir güvenlik sayfası ve gerçekçi bir zaman çizelgesi sunan bir uygulama sayfası, geç aşama dönüşümüne yeni bir özellik sayfasından çok daha fazla katkı sağlar.

Demo ve iletişim sayfaları: Talebi orantılı tutun

Dönüşüm sayfası, ziyaretçinin satın aldığı sonucu tekrarlamalı, formu gönderdikten sonra ne olacağını (kimin ve ne zaman iletişime geçeceğini) göstermeli ve yalnızca satış ekibinin ilk görüşme için ihtiyaç duyduğu alanları istemelidir. Alan seçimlerini lead toplama formları rehberimizde ayrıntılı olarak ele alıyoruz.

Birden Fazla Rol ve Sektör İçin Navigasyon

Navigasyon, bir B2B web sitesi tasarımının komiteye saygı gösterdiği ya da onu görmezden geldiği yerdir. Bu kalıplar yardımcı olur. (İçeriğin kendisini role göre değiştirmek için B2B web sitenizi unvana göre nasıl kişiselleştireceğinize bakın.)

1. Çözümler menüsünü ikiye ayırın. Bir sütun “Role göre” (Finans, Operasyon, BT), bir sütun “Sektöre göre”. Ziyaretçiler kendileri seçer ve siz de kim olduklarına dair bedava bir sinyal elde edersiniz.
2. Görünür bir "Neden biz" veya "Karşılaştır" girişi. Satın almaya yakın ziyaretçiler karşılaştırma ve geçiş içeriği arar. Bunu alt bilgiye gömmek, satın almaya en yakın kişilerden saklamak demektir.
3. Formata göre değil, işe göre bir kaynaklar menüsü. “İş gerekçesini oluşturun”, “Güvenliği değerlendirin”, “Uygulamayı planlayın”, “Blog, E-kitaplar, Webinarlar”dan daha kullanışlıdır.

Üst menüyü beş ya da altı öğeyle sınırlayın. Daha fazlasına ihtiyacınız varsa, sorun menüde değil bilgi mimarisindedir. Aynı yapı, arama motorlarının sayfalarınızı nasıl taradığını ve değerlendirdiğini de belirler; bu konuyu SEO için site mimarisi rehberimiz ele alıyor.

Anonim Ziyaretçiler İçin Tasarım

B2B web sitesi ziyaretçilerinin büyük çoğunluğu hiçbir zaman form doldurmaz; bu yüzden tasarımın hakkında hiçbir şey bilmediğiniz kişiler için işe yaraması gerekir. Bunun iki sonucu vardır.

Birincisi, her sayfanın makul bir varsayılanı olmalıdır. Varsayılan başlık, kanıt ve CTA genel bir "herkese" değil, en yaygın alıcınıza hizmet etmelidir. İkincisi, sayfalar varsayılanın daha sonra yeniden tasarım yapmadan değiştirilebileceği şekilde oluşturulmalıdır. Tasarım ile kişiselleştirmenin buluştuğu yer burasıdır.

Kişiselleştirmeye hazır tasarım: sayfaları slotlarla kurun

Kişiselleştirmeye hazır bir sayfa, sayfanın geri kalanı sabit kalırken değişebilen, sınırları net belirlenmiş az sayıda modülden oluşur. Pratikte değerin büyük kısmını üç alan karşılar:

• Başlık slotu: H1 ve alt başlık. Düzen kaymasın diye tüm varyantlarda aynı uzunluk aralığı.
• Kanıt alanı: Bir logo şeridi veya tek bir vaka çalışması kartı. Aynı anda tek bir sektörün logolarını veya tek bir müşteri hikâyesini taşıyacak şekilde tasarlanmış.
• CTA slotu: buton etiketi ve tek satırlık destekleyici bir cümle; örneğin orta ölçekli bir ziyaretçi için “Demo planlayın”, büyük bir hesap için “Kurumsal uzmanla görüşün”.

Bu alanları sabit boyutlar ve içerik sınırlarıyla tasarlayın (örneğin 40 ila 70 karakterlik başlık; logo, tek cümle ve bağlantı içeren kanıt kartı). Böylece içerik ekibi her seferinde tasarım ekibinden yeni bir düzen istemeden varyant yazabilir. Bu alanların içindeki belirli arayüz örüntüleri için kişiselleştirilmiş B2B web siteleri için tasarım örüntüleri yazımıza bakın.

Açıklamalı Örnek: Orta Ölçekli Bir B2B Ana Sayfası

Örnek (açıklayıcı, gerçek bir şirket değil): "Ledgerline", çalışan sayısı 200 ila 2.000 olan şirketlerin finans ekiplerine satış yapan kurgusal bir borç hesapları otomasyonu tedarikçisi. Ana sayfasının yukarıdan aşağıya nasıl düzenlenebileceği ve her bloğun gerekçesi şöyle.

1. Üst bilgi: Logo, Çözümler (Role göre / Sektöre göre), Fiyatlandırma, Müşteriler, Kaynaklar, Güvenlik. CTA butonu: "Demo ayarlayın." Güvenlik ana menüde yer alıyor, çünkü bu örnekte anlaşmaları geç aşamada genellikle durduran adım BT incelemesi.
2. Hero (başlık alanı): "Tablolarla yönetilemeyecek kadar büyüyen finans ekipleri için borç hesapları otomasyonu." Alt başlık: "Onaylar, eşleştirme ve ödemeler tek bir iş akışında; yaklaşık altı haftada kullanıma hazır." Kategori, kitle ve zaman çizelgesi; hepsi iki satırda.
3. Kanıt alanı: Ziyaretçinin en olası segmentinden beş logo ve tek bir satır: "Üretim, perakende ve lojistik sektörlerindeki finans ekipleri tarafından kullanılıyor." Daha sonra sektöre göre değiştirilebilir.
4. Yönlendirme bloğu: üç kart: “CFO'lar için: fatura başına maliyeti düşürün”, “Borç hesapları ekipleri için: onay peşinde koşmayı bırakın”, “BT için: entegrasyonlar ve güvenlik”. Her kart bir rol sayfasına bağlanır.
5. Nasıl çalışır: her biri bir ekran görüntüsüyle üç adım. Alıcıların demodan önce görmeyi beklediği ürünü gösterir.
6. Tek vaka çalışması kartı: benzer şirket, başlangıç durumu, sonuç. Logolardan daha derin ikinci bir kanıt.
7. Fiyat ön izlemesi: "Fatura hacmine göre fiyatlandırılır. Fiyatlandırmanın nasıl işlediğini görün." Ekonomik alıcının ilk eleme sorusunu yanıtlar.
8. Kapanış CTA alanı: "30 dakikalık bir demo ayarlayın. Genel bir SDR ile değil, bir finans uzmanıyla görüşeceksiniz." Bundan sonra ne olacağına dair beklentiyi belirler.

Öncesi ve Sonrası: Genel Bir B2B Ana Sayfasını Yeniden Tasarlamak

Örnek (temsili): aynı kurgusal şirketin yeniden tasarımdan önceki ana sayfası ve neyin değiştiği.

Yeniden tasarım tek bir animasyon bile eklemiyor. Her değişiklik, komitenin belirli bir üyesinin işini kolaylaştırıyor.

İyi Bir B2B Web Sitesini Ne Belirler: 12 Maddelik Kontrol Listesi

İyi bir B2B web sitesi örneği istendiğinde çoğu pazarlamacı görselliği nedeniyle bir site seçer. Alıcılara yardımcı olan özellikler ise çoğunlukla görsel değildir. İyi bir B2B web sitesi, tarzı ne olursa olsun aşağıdaki kontrolleri geçer. Kendi sitenizi dürüstçe puanlayın: her madde için bir puan; 9'un altındaki her sonuç, kimse bir tasarım aracını açmadan önce yeniden tasarım bütçesinin nereye gitmesi gerektiğini söyler.

1. Ana sayfa başlığı kategoriyi ve müşteriyi adlandırıyor. İlk kez gelen bir ziyaretçi beş saniye sonra ne sattığınızı ve kimin için olduğunu söyleyebiliyor.
2. Her iddianın yanında kanıtı var. Bir müşteri adı, bir ekran görüntüsü veya kaynağı belirtilmiş bir rakam ayrı bir sayfada değil, iddianın hemen yanında yer alır.
3. Her rol için bir yol var. Bütçe sahibi karar verici, günlük kullanıcı ve BT ekibi kendi sayfalarını ana menüden bulabiliyor.
4. Her sektör için bir yol var; en büyük iki ya da üç dikeyiniz için, her birinde sektöre özel bir müşteri hikâyesiyle.
5. Fiyatlandırma açıklanmış. Ya rakamlar ya da fiyatlandırma modeli ve tipik bir müşteri büyüklüğü için hesaplanmış bir örnek.
6. Güvenlik, entegrasyonlar ve uygulama kendi sayfalarına sahip. Bunlar, aksi takdirde satışa giden e-postalara dönüşecek son aşama sorularını yanıtlar.
7. Her sayfanın tek bir birincil CTA'sı ve en fazla bir ikincil CTA'sı vardır ve birincil talep, ziyaretçinin olası aşamasıyla uyumludur.
8. Demo formu yalnızca yönlendirmenin ihtiyaç duyduğu bilgileri istiyor ve gönderimden sonra ne olacağını söylüyor.
9. En çok ziyaret alan açılış sayfaları ana sayfa olmadan da işe yarar. Aramadan bir blog yazısına veya özellik sayfasına gelen bir ziyaretçi yine de ne yaptığınızı ve sonra nereye gideceğini görebilir.
10. Sayfalar telefonda hızlı yükleniyor. En önemli şablonlarınız mobil saha verilerinde Core Web Vitals testini geçiyor.
11. Karşılaştırma içeriği mevcut. Son aşamadaki alıcılar "X vs Y" ve "X alternatifleri" arar; sizin hazırladığınız adil bir sayfa, bir inceleme sitesinin sizin hakkınızdaki özetinden daha iyidir. Kendi Markettailor karşılaştırmalarımız bu yaklaşımı izliyor.
12. Dönüşüm segment bazında ölçülür. Yalnızca site genelindeki tek bir ortalamayı değil, sektöre, şirket büyüklüğüne veya hedef hesap listesine göre demo oranını görebilirsiniz.

On iki maddenin hiçbiri görsel stille ilgili değil. Gerçek şirketlerin 1., 2. ve 7. maddeleri nasıl ele aldığını görmek isterseniz B2B ana sayfa örnekleri analizimiz on bir SaaS ana sayfasını bölüm bölüm inceliyor. 9. madde çoğu ekibin beklediğinden daha önemlidir. Arama, ziyaretçileri doğrudan blog yazılarına ve özellik sayfalarına gönderdiğinde ana sayfa, oturumların yalnızca küçük bir kısmının giriş sayfası olabilir. Analitiğinizdeki açılış sayfası raporunu kontrol edin: kontrol listesi yalnızca yönetim kurulunun incelediği sayfa için değil, en çok giriş alan on sayfanız için de geçerli olmalıdır.

B2B Web Sitesi Tasarımınızı Denetlemek İçin 6 Adımlı İş Akışı

1. Komiteyi listeleyin. Tipik bir anlaşmada yer alan 4 ila 6 rolü ve her birinin sitenizde yanıtını araması gereken tek soruyu yazın.
2. Soruları sayfalarla eşleştirin. Her soru için onu yanıtlayan sayfayı bulun. Eksik sayfalar (güvenlik, uygulama, karşılaştırmalar) iş listesinin en üstüne gider.
3. En çok giriş yapılan sayfaları kontrol edin. Analitik aracınızda en sık kullanılan 10 açılış sayfasını listeleyin. Pek çok B2B ziyaretçisi ana sayfayı hiç görmez; bu yüzden bu sayfaların da aynı netliğe ihtiyacı vardır.
4. Her rol için 60 saniyelik bir test yapın. Bir çalışma arkadaşınıza bir rol ve bir soru verin ve tipik bir giriş sayfasından başlayarak yanıtı bulmasının ne kadar sürdüğünü ölçün.
5. En önemli sayfalarda alanları tanımlayın. Varyantların sonradan eklenebilmesi için başlık, kanıt ve CTA alanlarını içerik sınırlarıyla işaretleyin.
6. Yalnızca site genelinde değil, segmente göre ölçün. Tanımlayabildiğiniz yerlerde dönüşüm oranını sektöre ve şirket büyüklüğüne göre takip edin. Site geneli bir ortalama, tasarımın hangi segmentlerde başarısız olduğunu gizler.

Çoğu ekip 6. adımda takılır, çünkü dönüşüm verileri nadiren şirket özelliklerini içerir. Markettailor'ın ziyaretçi tanımlama özelliği anonim trafiği şirketlerle eşleştirir; böylece her sayfayla hangi sektörlerin ve şirket büyüklüklerinin etkileşime girdiğini görebilirsiniz. Alanlar hazır olduğunda, segmentasyon özelliği bunları segmente göre varyantlarla doldurmanızı ve diğer herkes için varsayılanı korumanızı sağlar.

Sırada Ne Var

Yukarıdaki denetim iş akışıyla başlayın, önce eksik sayfaları tamamlayın ve en çok trafik alan sayfalara alanlar yerleştirin. Açılış sayfaları ile ana sayfalar karşılaştırmamız, ücretli trafiğin nereye gelmesi gerektiğine karar vermenize yardımcı olur.

Sıkça Sorulan Sorular

B2B web sitesi tasarımı nedir?

B2B web sitesi tasarımı, tüketicilere değil işletmelere satış yapan bir web sitesinin yapısı, içeriği ve görsel tasarımıdır. Aynı satın alma komitesindeki birkaç role hizmet etmeli, birçok ziyarete yayılan uzun araştırma döngülerini desteklemeli ve ziyaretçileri doğrudan satın alma yerine demo taleplerine, iletişim taleplerine veya deneme hesaplarına dönüştürmelidir.

B2B web sitesi tasarımında en iyi uygulamalar nelerdir?

Başlıkta ne yaptığınızı ve kimin için olduğunu söyleyin, kanıtı doğrudan iddiaların yanına koyun, role ve sektöre göre navigasyon sunun, rakamlar özel olsa bile fiyatlandırmanın nasıl işlediğini açıklayın, güvenlik, entegrasyon ve uygulama sayfaları yayımlayın ve sayfa başına bir birincil ve bir ikincil CTA tutun.

B2B web sitesi tasarımının B2C'den farkı nedir?

B2C siteleri genellikle tek bir oturumda satın alabilen tek bir karar vericiye hizmet eder. B2B siteleri ise haftalar veya aylar boyunca bir komiteye hizmet eder; satın alma daha risklidir ve dönüşüm bir ödeme yerine bir toplantı ister. Bu da tasarımı role dayalı yollara, daha derin kanıtlara ve riski azaltan içeriğe doğru kaydırır.

İyi bir B2B web sitesini ne belirler?

İyi bir B2B web sitesi, satın alma komitesinin her üyesinin kendi sorusunu hızla yanıtlamasını sağlar: ne yaptığınız ve kimin için yaptığınız, her iddianın yanında kanıt, role ve sektöre göre yollar, açıklanmış bir fiyatlandırma modeli, güvenlik ve entegrasyon sayfaları, sayfa başına tek net bir CTA ve segmente göre ölçülen dönüşüm. Görsel cila, bu temellerden çok daha az önemlidir.

Bir B2B web sitesinde hangi sayfalar olmalı?

En azından: bir ana sayfa, role veya kullanım senaryosuna göre çözüm sayfaları, ana dikey pazarlarınız için sektör sayfaları, bir fiyatlandırma sayfası, müşteriler veya vaka çalışmaları sayfası, güvenlik ve entegrasyon sayfaları ve bir demo veya iletişim sayfası. Karşılaştırma ve uygulama sayfaları çoğu zaman eksiktir ve satın alma sürecinin son aşamasındaki alıcılar için en önemli sayfalardır.

Kişiselleştirme için bir B2B web sitesi nasıl tasarlanır?

Ana sayfalarınıza en yaygın alıcınız için güçlü bir varsayılan verin, ardından sabit boyutları ve içerik sınırları olan birkaç sınırlı alan tanımlayın; genellikle başlık, bir kanıt modülü ve CTA. Sektörler veya şirket büyüklükleri için varyantlar, sayfayı yeniden tasarlamadan bu alanlara yazılabilir.