Logische Struktur festlegen – Navigationsmenü
Willkommen zum Kapitel Eigene Webseite erstellen Teil 2. Nimm Dir ein paar Post-it, und suche Dir eine Wand oder Fenster. Schreibe Dir Deine Webseitenstruktur mit dieser Hilfe auf. Fange klein und bescheiden an. Vermeide zu viele Unterthemen, das kann man anders lösen. Es darf für Deine Webseitenbesucher auf keinen Fall zu kompliziert und unübersichtlich werden. Du musst Deine Besucher führen. Du möchtest sie zu einer Aktion bewegen – diese Aktion sollte sich mit Deinen Zielen decken.
Wähle prägnante Menübezeichnungen, so dass Deine Interessenten und Kunden verstehen an welche Informationen sie gelangen werden. Überlege Dir dazu:
- welche Inhalte möchtest Du präsentieren?
- welche Funktionen muss Deine Webseite beherrschen?
- mit welchen Partnern, Diensten etc. möchte ich meine Webseite verknüpfen?
- wie muss ich meiner Zielgruppe gerecht werden?
- wie kann ich meine Webseitenbesucher durch meine Webseite führen und sie so schnell wie möglich zu ihren gewünschten Informationen, Dienstleistungen oder Produkte leiten?
Ein Grund-Set an Seiten, welche jede Webseite benötigt sind folgende (beachte die gesetzlichen Vorgaben):
- Startseite/Home
- Angebot/Leistungsbeschreibung
- Über mich/About us
- Kontakt
- Impressum (gesetzliche Vorgabe)
- Datenschutz (gesetzliche Vorgabe)
Optional ergänzen lassen sich:
- Blog/News
- Kontaktformular
- Newsletteregistrierung
- Google Maps Anzeige
- Webshop
- Allgemeine Geschäftsbedingungen (AGB)
- Bildergalerie
- Mitgliederbereich
- Downloadbereich
- Online-Training
- Suchfunktion
- und vielem mehr
Deine Inhaltsseiten
Dank Deinem neu erstellten Konzept aus Teil 1 und Deinem Wissen das Du hier auf onlinemacher.ch erworben hast, erkennst Du, welche Inhalte Du benötigst, um Deine eigene Webseite zu erstellen und Deinen Interessenten und Kunden gerecht zu werden – in ihrer Sprache. Da Du Dir eine genaue Vorstellung erarbeitest hast, weisst Du nun genau, wie Du sie erreichen und ansprechen möchtest. Du kannst sie nun auf Deiner Webeseite führen und ihrem Bedarf gerecht werden. Das hilft Dir in der Strukturierung. Schreibe Dir mit Stift und Papier auf welche für Seiten welchen Zweck erfüllen. Wenn Du Dir sicher bist, dann könnte eine Seitenbeschreibung so aussehen:
- Seitentitel (Titel der Seite)
- Kurzbeschreibung (welchen Zweck hat diese Seite?)
- Seiteninhalt (Auflistung der Funktionen wie z.B. Kontaktformular, Bildergalerie, Testimonimal etc.)
- Struktur der Seiten? Wie viele Spalten sollten angezeigt werden?
- Verlinkung zu internen Posts, externe Seiten, oder Social-Media-Profilen
Die Startseite
Die Startseite Deiner Webseite ist äusserst wichtig, sie ist Dein Aushängeschild und dient als Einfallstor. Sie verschafft Deinen Webseitenbesucher einen Überblick und Ihnen bestätigen, dass sie am richtigen Ort gelandet sind. Sie sollten gleich wissen um was geht und welche Informationen, Dienstleistungen oder Produkte sie auf Deiner Webseite finden.
„die Startseite ist Dein Aushängeschild und das Einfallstor für Deine Interessenten und Kunden“
Sandro | onlinemacher.ch
Ganz wichtig, Deine Webseitenbesucher müssen sich auf eine einfache und intuitive Weise zu recht finden. Sie müssen sich angesprochen und sich in Ihrem Problem verstanden fühlen. All diese Erkenntnisse versetzen Dich in die Lage, zu entscheiden welche Handlungsaufforderungen Du herbeiführen willst (z.B. Kontaktiere mich, Trage Dich in den Newsletterservice ein etc.). Gute Voraussetzungen bieten auch bereits vorhandene Kundenmeinungen und Referenzen, welche Du auf Deiner Webseite veröffentlichen kannst und darfst.
Fertige Entwürfe mit Papier und Stift an
Lege nun für Deine zukünftige Webseite und Unterseiten Entwürfe an, denn Du kennst nun Dein Konzept und Dein Ziel, die Struktur und der Inhalt Deiner Webseite. Du kannst nun Deine eigene Webseite erstellen. Mit Deiner Analyse Deiner Mitbewerbern erhältst Du Ideen, wie Du Deine eigene Webseite erstellen und gestalten möchtest. Halte diese Eindrücke fest und entwickle sie für Dich weiter.
Halte auf Deiner Skizze im Groben fest, wie der Kopfbereich (Navigation), das Menü (Benutzerführung), die Seitenfunktionalität (Kontaktformular, Newsletterregistrierung etc.) und der Inhalt (Texte, Bilder etc.) ausschauen sollte. Auch kannst Du Dir bereits Gedanken über Effekte (Slider, Texteinblendungen etc.) machen.
Halte Dein Design fest
Nun sind wir an den Punkt gelangt, wo wir uns Gedanken über Dein Webdesign mache können. Aus Deinem Konzept, Recherchen und Gedankengänge zur Zielgruppe kannst Du erschliessen:
- welche Farben passen zur Zielvorgabe?
- welche Formen und Schriften möchtest Du einsetzen und passen zu Deiner Marke?
- welche Grafikelemente möchte ich einsetzen? (z.B. Fotos, Grafiken etc.)
- welches Design setzen meine Konkurrenten ein?
„die Startseite ist Dein Aushängeschild und das Einfallstor für Deine Interessenten und Kunden“
Sandro | onlinemacher.ch
Farben
Es gibt im Internet viele Möglichkeiten, sich über Farbpaletten zu informieren. Ich nutze oft das Angebot von coolors.co. Diese bieten einen kostenlosen Generator für zusammenpassende Farben an. Einmal gestartet kannst Du mit der Leertaste auf Deiner Tastatur die Farbpalette wechseln und erhältst die Farbcodes. Einfacher geht es kaum.
Wähle Deine Farben für die vier wichtigsten Farbelemente Deiner Webseite:
- Primär (bildet die vorherrschende Farbe ab, z.B. für Titel, Farbboxen etc.)
- Sekundär (bildet oftmals einen Kontrast gegenüber der primären Farbe, z.B. wenn Du etwas vom allgemeinen Abgrenzen oder Hervorheben möchtest)
- Textfarbe (achte möglichst auf einen guten Kontrast gegenüber der Hintergrundfarbe)
- Akzentfarbe (sollte herausstechend sein und zu einem Klick einladen, z.B. ein Call-to-action-Button wie beim Absenden einer Nachricht über das Kontaktformular)
Achte Dich stets darauf, nicht zu viele verschiedene Farben einzusetzen. Hast Du bereits ein Logo kreiert, gibt dieses meist die Farben für Deine Marke und Webseite vor. Versuche einheitlich Farben einzusetzen, setze beispielsweise immer der selbe Rotton ein.
Ausserdem senden Farben Signale und spielen in der Psychologie eine wichtige Rolle. Farben können einen Eindruck vermitteln, wie zum Beispiel:
- Rot – Energie, Leidenschaft, Dynamik
- Orange – Fröhlichkeit, Optimismus
- Gelb – Positive Lebenseinstellung, Wärme
- Grün – Gesundheit, Natur
- Blau – Kompetenz, Professionalität
Du hast auf einer Webseite schöne Farben entdeckt und möchtest herausfinden, wie diese Farbcodes heissen? Ich kann Dir dazu eine Browser-Erweiterung namens „ColorZilla“ für Google-Chrome empfehlen. Diese Erweiterung hat über 2Mio. Installationen.
Schriftarten
Das selbe trifft für Schriftarten zu. Auch hier gibt es im Internet viele Dienste welche Dich dabei unterstützen, passende Schriftarten für Deine Webseite zu finden. Einer dieser Dienste ist fontpair.co.
Ich empfehle Dir zwei Schriftarten, eine für Titel und eine weitere für Texte zu wählen. Achte Dich, dass diese zwei Schriftarten gut mit einander harmonieren.
Du hast auf einer Webseite schöne Schriftarten entdeckt und möchtest herausfinden, wie diese Schriftarten heissen? Ich kann Dir dazu eine Browser-Erweiterung namens „WhatFont“ für Google-Chrome empfehlen. Diese Erweiterung hat über 1Mio. Installationen.
Inhalte
Es erweist sich als sehr nützlich, wenn Du Dir eine Check- und To-Do-Liste anlegst. Halte für Dich fest,
- welche Informationen und welches Material für Deine Inhalte werden benötigt?
- Logo
- Texte
- Bilder (bitte nur hochauflösendes Material, welches dann internetgerecht aufbereitet werden muss)
- Video (auch hier, nur hochauflösendes Material verwenden)
- was hast Du an Informationen bereits gesammelt?
- was fehlt Dir noch an Informationen?
- wer und bis wann beschafft Dir die fehlenden Informationen und Materialien?
- erstellst Du alles selber oder benötigst Du externe Hilfe von einem Texter, Fotografen, Videoproduzenten, Grafiker oder Webdesigner?
- der Einbezug von professionellen Dienstleistern kann Dir von Anfang an dazu verhelfen, dass Deine eigene Webseite professioneller erscheinen wird. Natürlich wird das etwas Geld kosten, aber wenn Du Dir ein Budget für das Erstellen Deiner eigenen Webseite erstellt hast und Du Dir hierzu einen Batzen mit kalkuliert hast, wird Dich das später unterstützen, Zeit und Geld einzusparen
Möchtest Du mehr erfahren? Hast Du bereits konkrete Pläne und Vorstellungen? Teile mir doch diese mit und lass uns über ein persönliches und kostenloses Erstgespräch darüber unterhalten!
Hat Dir dieser Blogbeitrag gefallen oder weiterhelfen können? Hast Du Bock mehr über dieses Thema zu erfahren, dann empfehle ich Dir folgende Kapitel:
- Wann und warum brauche ich eine eigene Webseite
- Eigene Webseite erstellen – wie starten
- Eigene Webseite erstellen – die Struktur
Hinterlasse doch bitte gerne einen kurzen Kommentar. Ich freue mich auch, wenn Du diesen Beitrag teilst oder weiterleitest. Bestimmt kann dieser auch jemanden anderem weiterhelfen.
