Articulate Marketing'de web sitelerini nasıl oluşturuyoruz?

Öncelikle HubSpot CMS web siteleri oluşturuyoruz. HubSpot'un ne olduğunu bilmiyorsanız endişelenmeyin. Kolay bir giriş için buraya gidin. Hâlâ bizimle olanlarınız için, bugün müşterilerimiz için web siteleri oluşturma sürecini özetliyoruz.

Bu makale, Articulate Marketing Stüdyo Başkanı Ioana Negulescu tarafından düzenlenen web seminerlerimizden birine dayanmaktadır. Aşağıdaki videoyu izleyebilir ve slaytları indirebilirsiniz:

Web sitesi oluşturma zorlukları

Yeni bir web sitesi oluşturmak (veya mevcut bir siteyi taşımak) söz konusu olduğunda genellikle bir ilk adım vardır. Bazı korkuları hafifletmemiz gerekiyor. Daha önceki ajanslarla deneyimlerden daha önce yakılan müşterilere sahip olmak nadir değildir.

Duyduğumuzda...

'Yeni bir web sitesi alma konusunda endişeleniyoruz çünkü sonuncusu çok acı vericiydi.'

Biz bunu yaparız...

Bunu çok kez duyduk. Dolayısıyla daha iyisini yapmak için çalışıyoruz.

Örneğin, Gantt Grafiklerini kullanmak yerine, kilometre taşlarını kullanmayı seviyoruz. Odaklandığımız şeylerden biri, ilerlemeyle ilgili sürekli güncellemelerle şeffaf bir sürece sahip olmaktır. Bu, müşterilerimize bir güvenlik duygusu verir.

Web tasarım sürecinde bizim için gerçekten çok önemli olan bir şey şudur: e-posta üzerinden görüntülü aramalar . Bu önemlidir çünkü müşterilerimizin tepkilerini ölçebiliriz. Biraz sessizlerse, çok heyecanlılarsa vb. Bu sayede beklentilerine uygun önerilerde bulunabiliriz. Ve elbette, sahip olabilecekleri soruları da yanıtlayın.

Duyduğumuzda...

"Geliştiriciyi o kadar çok takip etmeye çalıştık ki bize geri dönmeyecekler."

Biz bunu yaparız...

İlerlemeyi işaretlemek için düzenli proje yönetimi çağrıları kullanıyoruz ve bunlar ilk günden itibaren takvimde yer alıyor. Bu proje yönetimi çağrıları sırasında yeni çalışmalar sunar ve engelleyicileri tespit ederiz.

Tasarımcıların ve geliştiricilerin işi gerçekten halletmek için zamana ihtiyaçları vardır, bu nedenle bu tür her çağrıya katılmaları her zaman mantıklı değildir. Gerektiğinde onları getiriyoruz.

Duyduğumuzda...

'Ya yeni web sitesi beklentilerimizi karşılamazsa?'

Biz bunu yaparız...

Herhangi bir web sitesi tasarımı projesine başlamadan önce pazarlama stratejisi temellerini inceleriz. Bu çok önemlidir çünkü bu aşamada müşterinin müşterileri, alıcının yolculuğu ve işletmenin pazarlama hedefleri hakkında bilgi ediniriz. Bu, web sitesi hakkında aldığımız birçok stratejik karar hakkında bilgi verecek ve beklentileri en baştan belirleyecektir.

Ardından marka mimarisine geçiyoruz. Burada, web sitesinin temellerini ortaya koyuyoruz. Renkler, resimler veya çizimler, UX/UI öğeleri, yazı tipleri - web sitesinin genel estetiği. Bu son derece işbirlikçi bir süreçtir. Müşterilerimiz her adımda yer alır, bu nedenle girdileri ve gereksinimleri son ürüne dahil edilir.

Bir örnek: HTG

HTG için ödüllü bir web sitesi oluşturduk, bu nedenle bunları örnek olarak kullanacağız.

Kendileriyle ilk konuştuğumuzda bu korkularını dile getirdiler ve zorluklarını özetlediler. Bunlar B2B teknoloji şirketleri arasında oldukça yaygın sorunlardır:

• Hırslı iş büyüme hedefleri
• Eski web sitesi (ve marka)
• Birkaç kurşun yakalama fırsatı
• hantal navigasyon
• Kötü kullanıcı deneyimi
• Kötü site performansı

Bu size benziyorsa, web sitenizi puanlamak için buraya gidin.

Eklem süreci

Kısaca sürecimiz şöyle. Daha ayrıntılı görüntülemek için bu resme tıklayın:

HTG örneğine dönelim. Onlarla birlikte, her zamanki yedi aşamalı sürecimizi izledik:

1. Başlama vuruşu

Başlangıç, web sitesi projesi için ilk etkileşimdir. Bu görüşme sırasında, müşterilerimizin tasarım ve marka beklentileri konusundaki tercihlerini ölçmeye çalışıyoruz. Bu tercihleri, herhangi bir Articulate web sitesi için nihai hedefle stratejik olarak uyumlu hale getirmek istiyoruz: iyi işleyen bir pazarlama motoru oluşturmak.

2. Moodboard'lar ve web sitesi yapısı

Burada iki dahili süreç çalıştırıyoruz. Bunlardan biri, ruh hali panolarını, yazı tipi önerilerini, renk önerilerini, görüntüleri vb. bir araya getirmektir.

Diğeri ise pazarlama metin yazarlarından oluşan ekibimizle site haritası önerilerini bir araya getiriyoruz. Bu, navigasyonun yapısı ve oluşturmamız gereken sayfalardır.

Ardından, ilk büyük dönüm noktamız olan bir müşteri inceleme görüşmemiz var. Her aşamanın sonunda bir inceleme çağrımız var. Her şey onaylanırsa bir sonraki aşamaya geçiyoruz. Değilse, geri dönüp yineliyoruz.

3. İlk tasarımlar ve tel kafesler

Burada, web sitesinin estetiğini göstermenin bir yolu olarak ana sayfayı tasarlıyoruz. Tipik olarak, müşterinin seçim yapması için bazı farklı seçenekler yaratırız. Modüler bir şekilde tasarladığımız için , bunu en önemli 'Lego tuğlalarından' bazılarının nasıl görüneceğini sergilemek için bir adım olarak düşünüyoruz.

Paralel olarak, sayfa yapısı etrafında stratejiler oluşturuyoruz. Yani hangi sayfaya ne tür içerik giriyor? Hangi Lego tuğlalarına ihtiyacımız var?

Ekibimiz daha sonra hiçbir tasarım öğesi içermeyen web sitesi sayfalarının kaba taslakları gibi tel kafesler oluşturur.

4. Tüm modülleri tasarlayın ve taslak web kopyası yazın

Bu aşamada, tasarım ekibi web sitesi için gerekli tüm modülleri tasarlamaya devam ederken, metin yazarlarından oluşan ekibimiz metin taslağı oluşturmaya başlar. Müşterilerimizin web sitelerinde her zaman tüm kopyaları yazmıyoruz, ancak bunu yaptığımızda, önceden kararlaştırılmış bir site haritasına dayalı olarak sayfa başına şeffaf bir ücret alıyoruz.

5. Web sitesini geliştirin

Modül tasarımlarını yerinde göstermek için, tüm sayfaları lorem ipsum kopyası ve yer tutucu resimlerle geliştiriyor ve oluşturuyoruz, böylece müşterilerimizin nihai sonuç hakkında doğru bir fikir edinebilmesini sağlıyoruz.

Bir geliştiriciyle, herhangi bir geliştiriciyle çalışırken, onlara birkaç uygun soru sormak istersiniz:

• Web sitemizi kodlamak için attığınız ana adımlar nelerdir?
• Kodun düzenli olduğundan nasıl emin oluyorsunuz? (Şablon web siteleriyle ilgili önemli bir sorun.)
• Hız ve genel performansı ne zaman ve ne sıklıkla kontrol ediyorsunuz?
• Web sitesi geliştirildikten sonra bir sayfa oluşturmak nasıl görünür? Sayfayı oluşturanlar için kullanıcı dostu bir deneyim mi?

Veya Articulate ile çalışıyorsanız, 'Bir Rubik küpünü en hızlı çözdüğünüz zaman nedir?' Bu tür soruları memnuniyetle karşılıyoruz.

Geliştirme sürecimiz, çalışmalarımızı planladığımız Notion'da başlar. Ardından, navigasyonlar ve bazı global modüller için temel kodu belirledik. Ardından, söz konusu web sitesi için oluşturmamız gereken her tasarım öğesi ve işlevsellik için bir Kalite Güvencesi kontrol listesi hazırlarız. Bu, tüm yapı boyunca bizi doğru tutacaktır.

Tüm modülleri HTML'de bir araya getiriyoruz, ardından stile bakmaya başlıyoruz. Yani tuğla, sıva, boya ve dekorasyon düşünün.

Baştan sona her şeyi test eder, performansı kontrol eder ve iyileştirmeler yaparız. Çoğu zaman, daha iyi bir şeyi nasıl yapacağımızı öğreneceğiz ve bu uzmanlığı bir sonraki web sitemize taşıyacağız.

6. Sayfaları doldurun

Bu aşamada, birkaç yineleme ve müşteri incelemesinden sonra sayfaları onaylanmış kopya ve görüntülerle doldururuz. Bu aşamada, web sitesi lansman için neredeyse hazır. Başka bir müşteri inceleme aşamasından geçiyoruz ve bundan sonra kapsamlı bir lansman öncesi KG kontrol listesi yürütüyoruz.

7. Başlat!

Başlatırız ve ardından başka bir lansman sonrası KG kontrol listesi çalıştırırız, çünkü web sitesinin işlevsel olduğundan ve hazırlık aşamasından canlıya kadar hiçbir şeyin bozulmadığından emin olmak çok önemlidir.

Sonunda, elbette kutluyoruz!

Harika web sitesi tasarımı için 10 ipucu

İşte yıllar içinde öğrendiğimiz birkaç kural ve düzinelerce web sitesi yapısı:

1. Tercihlerinizi ikinci sıraya koyun ve kişiliğinizin acı noktalarını ilk sıraya koyun.
2. Yalnızca hizmetlerinizi listelemek yerine müşterilerinize nasıl yardımcı olduğunuza odaklanın.
3. Tekerleği yeniden icat etmeye çalışmayın. Ne işe yarar, bir neden için çalışır. Örneğin, yalnızca ekranın üst kısmına odaklanmak bir efsanedir. Herkes kaydırmayı bilir. Bununla ilgili bir web sitesi bile var: http://abovethefold.fyi/
4. Navigasyonu kısa ve basit tutun.
5. Düğmeleri değer odaklı yapın. Mümkünse genel kopyalardan kaçının.
6. Daha fazla içeriğe sahip bir sayfa varsa, her zaman ilgili sayfaya bağlantı verin.
7. Anahtar sayfalarda çok fazla harici bağlantıya sahip olmaktan kaçının. (Blogunuz farklı bir hikaye.)
8. Sayfayı her zaman bir veya daha fazla CTA (harekete geçirici mesaj) ile sonlandırın ve kullanıcıyı süreçteki bir sonraki adıma taşıyın.
9. Bir iletişim sayfasının gücünü hafife almayın - çoğu zaman bu bir çıkış noktasıdır, ancak gerçekten, gerçekten insanları o sayfada tutmak istersiniz.
10. Az ama öz!

Bonus: logonun kötü bir tasarımı dikte etmesine izin vermeyin

HTG'nin web sitesini tasarladığımızda logoları eskiydi ve artık hedeflediğimiz markaya uymuyordu. Birkaç basit değişiklikle modernize ettik:

İşte düşünmek için yiyecek. Dijital çağımızda, markanız büyük olasılıkla logonuz yerine web sitenizdir. Yani, önce web sitesini, sonra logoyu düşünün.

Lansmandan sonra ne olacak?

Pekala. Yeni bir web siteniz var. Şimdi ne olacak? Söylediğimiz gibi, Articulate'de web sitelerini pazarlama motorları olarak görüyoruz, bu nedenle katılımımızın lansmanla bitmesi gerekmiyor. Aslında bu, müşterilerimizin çoğu için yolculuğun sadece başlangıcıdır.

Bloglar, sütun sayfaları, kapılı teklifler ve 'sıkıştırılmış' sayfalar gibi yeni içerik oluşturmaktan davranış izleme ve çok değişkenli testler çalıştırmaya kadar, web sitenizin yapabileceği çok daha fazlası var.

Gizli zirve: Çekirdek

Peki bir HubSpot web sitesine nasıl sahip olabilirsiniz ? Ismarlama bir web sitesi oluşturma gibi birkaç seçenek vardır, ancak bir yol bir HubSpot teması kullanmaktır. Nucleus, Articulate'in bu tür bir temasıdır.

Bir tema, çok daha karmaşık bir web sitesi şablonu gibidir. Kendi web sitemiz Nucleus üzerine kuruludur ve onu çok çeşitli tasarım stillerine sahip birkaç müşteri için kullandık. 2022'de HubSpot Marketplace'te piyasaya sürüyoruz. Nucleus ile müşterilerimiz için haftalar, hatta günler içinde yüksek düzeyde optimize edilmiş web siteleri oluşturabiliyoruz. Hepsi oldukça heyecan verici!

>> Nucleus'u keşfetmek için buraya tıklayın <<