Wie wir bei Articulate Marketing Websites erstellen

Zunächst erstellen wir HubSpot-CMS-Websites. Wenn Sie nicht wissen, was HubSpot ist, machen Sie sich keine Sorgen. Hier finden Sie eine einfache Einführung. Für diejenigen unter Ihnen, die noch bei uns sind, skizzieren wir heute den Prozess zum Erstellen von Websites für unsere Kunden.

Dieser Artikel basiert auf einem unserer Webinare, das von mir, Ioana Negulescu, Studioleiterin bei Articulate Marketing, moderiert wurde. Sie können das Video sehen und die Folien unten herunterladen:

Herausforderungen beim Erstellen von Websites

Es gibt oft einen ersten Schritt, wenn es darum geht, eine neue Website zu erstellen (oder eine bestehende Website zu migrieren). Wir müssen einige Ängste nehmen. Es ist nicht ungewöhnlich, Kunden zu haben, die zuvor durch Erfahrungen mit früheren Agenturen verbrannt wurden.

Wenn wir hören...

„Wir machen uns Sorgen, eine neue Website zu bekommen, weil die letzte so mühsam war.“

Wir machen das...

Das haben wir schon so oft gehört. Also bemühen wir uns, es besser zu machen.

Anstelle von Gantt-Diagrammen verwenden wir beispielsweise gerne Meilensteine ​​. Eines der Dinge, auf die wir uns konzentrieren, ist ein transparenter Prozess mit kontinuierlichen Fortschrittsaktualisierungen. Das gibt unseren Kunden ein Gefühl der Sicherheit.

Eine Sache, die für uns während des Webdesign-Prozesses wirklich, wirklich wichtig ist, ist Folgendes: Videoanrufe über E-Mails. Das ist wichtig, weil wir die Reaktionen unserer Kunden abschätzen können. Wenn sie ein bisschen ruhig sind, wenn sie sehr aufgeregt sind und so weiter. Auf diese Weise können wir Empfehlungen aussprechen, die ihren Erwartungen entsprechen. Und beantworten natürlich auch alle Fragen, die sie haben könnten.

Wenn wir hören...

"Wir haben so oft versucht, den Entwickler zu jagen, sie werden sich einfach nicht bei uns melden."

Wir machen das...

Um den Fortschritt zu markieren, führen wir regelmäßige Projektmanagement- Anrufe durch, und wir haben diese vom ersten Tag an im Kalender. Während dieser Telefonkonferenzen zum Projektmanagement stellen wir neue Arbeiten vor und identifizieren Blockaden.

Designer und Entwickler brauchen Zeit, um die Arbeit tatsächlich zu erledigen, daher ist es nicht immer sinnvoll, dass sie an jedem dieser Anrufe teilnehmen. Wir bringen sie ein, wenn es relevant ist.

Wenn wir hören...

„Was ist, wenn die neue Website unsere Erwartungen nicht erfüllt?“

Wir machen das...

Bevor wir mit einem Website-Designprojekt beginnen, gehen wir die Grundlagen der Marketingstrategie durch. Dies ist sehr wichtig, da wir in dieser Phase etwas über die Kunden eines Kunden, die Reise des Käufers und die Marketingziele des Unternehmens erfahren. Dies wird viele strategische Entscheidungen, die wir über die Website treffen, beeinflussen und die Erwartungen von Anfang an festlegen.

Dann gehen wir zur Markenarchitektur über. Hier legen wir die Grundlagen der Website dar. Die Farben, die Bilder oder Illustrationen, die UX/UI-Elemente, die Schriftarten – die Gesamtästhetik der Website. Dies ist ein äußerst kooperativer Prozess. Unsere Kunden sind bei jedem Schritt involviert , sodass ihre Beiträge und Anforderungen in das Endprodukt einfließen.

Ein Beispiel: HTG

Wir haben eine preisgekrönte Website für HTG erstellt, daher verwenden wir sie durchgehend als Beispiel.

Sie drückten diese Befürchtungen aus und skizzierten ihre Herausforderungen, als wir zum ersten Mal mit ihnen sprachen. Dies sind ziemlich häufige Probleme bei B2B-Technologieunternehmen:

• Ehrgeizige Ziele für das Unternehmenswachstum
• Veraltete Website (und Marke)
• Nur wenige Lead-Capture-Möglichkeiten
• Umständliche Navigation
• Schlechte Benutzererfahrung
• Schlechte Leistung der Website

Wenn das nach Ihnen klingt, dann gehen Sie hier, um Ihre Website zu bewerten.

Der Articulate-Prozess

Hier ist unser Prozess in Kürze. Klicken Sie auf dieses Bild, um es genauer anzuzeigen:

Kehren wir zum Beispiel HTG zurück. Mit ihnen folgten wir unserem üblichen siebenstufigen Prozess:

1. Anpfiff

Der Kick-Off ist die erste Interaktion für das Website-Projekt. Während dieses Anrufs versuchen wir, die Präferenzen unserer Kunden für Design und Markenansprüche einzuschätzen. Wir möchten diese Präferenzen strategisch mit dem ultimativen Ziel für jede von Articulate erstellte Website in Einklang bringen: den Aufbau einer gut funktionierenden Marketing-Engine.

2. Moodboards und Website-Struktur

Hier führen wir zwei interne Prozesse aus. Eine besteht darin, Moodboards, Schriftempfehlungen, Farbempfehlungen, Bilder und so weiter zusammenzustellen.

Die andere ist, dass wir mit unserem Team von Marketingtextern Sitemap-Empfehlungen zusammenstellen. Dies ist die Struktur der Navigation und der Seiten, die wir erstellen müssen.

Dann haben wir einen Anruf zur Kundenbewertung, der unser erster großer Meilenstein ist. Am Ende jeder Phase führen wir einen Review-Call durch. Wenn alles genehmigt wird, fahren wir mit der nächsten Stufe fort. Wenn nicht, gehen wir zurück und iterieren.

3. Erste Designs und Wireframes

Hier gestalten wir die Homepage, um die Ästhetik der Website zu zeigen. Normalerweise erstellen wir einige verschiedene Optionen, aus denen der Kunde wählen kann. Da wir modular designen , betrachten wir dies als einen Schritt, um zu zeigen, wie einige der wichtigsten „Lego-Steine“ aussehen werden.

Parallel dazu entwickeln wir Strategien rund um die Seitenstruktur. Das heißt, welche Art von Inhalt kommt auf welche Seite? Welche Legosteine ​​brauchen wir?

Unser Team erstellt dann Wireframes, die wie grobe Skizzen der Website-Seiten ohne Designelemente sind.

4. Entwerfen Sie alle Module und schreiben Sie einen Webtextentwurf

In dieser Phase beginnt unser Texterteam mit dem Entwurf von Texten, während das Designteam mit der Gestaltung aller für die Website erforderlichen Module fortfährt. Es ist nicht immer so, dass wir den gesamten Text auf die Websites unserer Kunden schreiben, aber wenn wir das tun, berechnen wir auf transparenter Basis pro Seite basierend auf einer vorab vereinbarten Sitemap.

5. Entwickeln Sie die Website

Um die Modulentwürfe vor Ort zu zeigen, entwickeln und bauen wir alle Seiten mit Lorem-Ipsum-Kopien und Platzhalterbildern aus, damit sich unsere Kunden eine richtige Vorstellung vom Endergebnis machen können.

Wenn Sie mit einem Entwickler zusammenarbeiten, sollten Sie ihm ein paar relevante Fragen stellen:

• Was sind die wichtigsten Schritte, die Sie unternehmen, um unsere Website zu codieren?
• Wie stellen Sie sicher, dass der Code aufgeräumt ist? (Ein großes Problem bei Template-Websites.)
• Wann und wie oft überprüfen Sie die Geschwindigkeit und Gesamtleistung?
• Wie sieht das Erstellen einer Seite aus, nachdem die Website entwickelt wurde? Ist es eine benutzerfreundliche Erfahrung für denjenigen, der die Seite erstellt?

Oder wenn Sie mit Articulate arbeiten: „Wann haben Sie am schnellsten einen Rubik's Cube gelöst?“ Wir begrüßen solche Fragen.

Unser Entwicklungsprozess beginnt in Notion, wo wir unsere Arbeit planen. Dann legen wir den Basiscode für die Navigationen und einige globale Module fest. Als nächstes erstellen wir eine Qualitätssicherungs-Checkliste für jedes Designelement und jede Funktionalität, die wir für diese spezifische Website erstellen müssen. Dies wird uns während des gesamten Builds auf dem Laufenden halten.

Wir rüsten alle Module in HTML und beginnen dann mit dem Styling. Denken Sie also an Ziegel, Putz, Anstrich und Dekoration.

Währenddessen testen wir alles, überprüfen die Leistung und nehmen Verbesserungen vor. Oft lernen wir, wie wir etwas besser machen können, und bringen dieses Fachwissen in unsere nächste Website ein.

6. Seiten füllen

In dieser Phase füllen wir nach mehreren Iterationen und Kundenprüfungen die Seiten mit genehmigten Texten und Bildern. Zu diesem Zeitpunkt ist die Website fast startbereit. Wir durchlaufen eine weitere Kundenprüfungsphase und führen danach eine gründliche QA-Checkliste vor der Markteinführung durch.

7. Starten Sie!

Wir starten und führen dann eine weitere QA-Checkliste nach dem Start durch, da es sehr wichtig ist, sicherzustellen, dass die Website funktionsfähig ist und nichts vom Staging bis zum Live-Betrieb unterbrochen wurde.

Zum Schluss feiern wir natürlich!

10 Tipps für großartiges Website-Design

Hier sind ein paar Regeln, die wir im Laufe der Jahre und über Dutzende von Website-Builds gelernt haben:

1. Stellen Sie Ihre Vorlieben an zweiter Stelle und die Schmerzpunkte Ihrer Personas an erste Stelle.
2. Konzentrieren Sie sich darauf, wie Sie Ihren Kunden helfen, anstatt nur Ihre Dienstleistungen aufzulisten.
3. Versuchen Sie nicht, das Rad neu zu erfinden. Was funktioniert, funktioniert aus einem bestimmten Grund. Beispielsweise ist es ein Mythos, sich ausschließlich auf den Bereich „above the fold“ zu konzentrieren. Scrollen kann jeder. Es gibt sogar eine Website darüber: http://abovethefold.fyi/
4. Halten Sie die Navigation kurz und einfach.
5. Gestalten Sie Schaltflächen wertorientiert. Vermeiden Sie nach Möglichkeit generische Kopien.
6. Verlinken Sie immer auf eine relevante Seite, wenn eine Seite mit mehr Kontext vorhanden ist.
7. Vermeiden Sie auf Schlüsselseiten zu viele externe Links. (Ihr Blog ist eine andere Geschichte.)
8. Beenden Sie die Seite immer mit einem oder mehreren CTAs (Calls to Action), die den Benutzer zum nächsten Schritt im Prozess führen.
9. Unterschätzen Sie nicht die Macht einer Kontaktseite – zu oft ist sie ein Ausstiegspunkt, aber Sie möchten wirklich, wirklich, dass die Leute auf dieser Seite bleiben.
10. Weniger ist mehr!

Bonus: Lassen Sie sich nicht vom Logo ein schlechtes Design diktieren

Als wir die Website von HTG gestalteten, war ihr Logo veraltet und passte nicht mehr zu der Marke, die wir anstrebten. Wir haben es mit ein paar einfachen Änderungen modernisiert:

Hier ein paar Denkanstöße. In unserem digitalen Zeitalter ist Ihre Marke höchstwahrscheinlich eher Ihre Website als Ihr Logo. Denken Sie also zuerst an die Website und dann an das Logo.

Was passiert nach dem Start?

Gut. Sie haben eine neue Webseite. Was jetzt? Wie wir bereits gesagt haben, sehen wir bei Articulate Websites als Marketingmaschinen, sodass unser Engagement nicht mit der Markteinführung enden muss. Tatsächlich ist dies für die meisten unserer Kunden erst der Anfang der Reise.

Von der Erstellung neuer Inhalte wie Blogs, Pillar-Seiten, geschlossenen Angeboten und „Squeeze“-Seiten bis hin zur Durchführung von Verhaltens-Tracking und multivarianten Tests – Ihre Website kann noch so viel mehr.

Sneakpeak: Kern

Wie erhalten Sie also eine HubSpot-Website? Es gibt einige Optionen, wie z. B. den Aufbau einer maßgeschneiderten Website, aber eine Möglichkeit ist die Verwendung eines HubSpot-Designs. Nucleus ist Articulates ganz eigenes Thema.

Ein Theme ist wie eine viel ausgefeiltere Website-Vorlage. Unsere eigene Website basiert auf Nucleus und wir haben sie für mehrere Kunden mit einer großen Auswahl an Designstilen verwendet. Wir führen es 2022 auf dem HubSpot Marketplace ein. Mit Nucleus können wir für unsere Kunden in Wochen, sogar Tagen, hochoptimierte Websites erstellen. Es ist alles ziemlich aufregend!

>> Klicken Sie hier, um Nucleus zu erkunden <<