Lektion 08: Wie Du das Layout und die Struktur deiner Nischenseite anpasst.

Alle wichtigen Einstellungen auf einen Blick

SEOHunter
Werbung
Wordpress Settings
Hat dir dieser Beitrag geholfen? Teile diesen Beitrag!

In Lektion 7 habe ich dir gesagt, was ein WordPress Theme für Nischenseiten mitbringen muss. Jetzt beschäftigen wir uns mit dem Layout und der Grundstruktur der Seite. Außerdem will ich dir zeigen, welche Anpassungen ich an meinem Theme vorgenommen habe.

Minimales Design mit maximaler Wirkung

Ziel unserer Nischenseite ist es, am Ende eine Coversion zu erreichen und Geld zu verdienen. Sei es durch die Vermittlung von Produkten über Affiliate Marketing oder eigenen digitalen Produkten. Eine unruhige Gestaltung wirkt sich negativ auf die Besucherführung aus. Blinkende Banner, Newsticker, Pop-ups oder zu viele verschiedene Menüpunkte verwirren den Besucher.

Ein minimales Design hat wenig Ablenkungen. Der Besucher konzentriert sich auf deine hoffentlich nützlichen und überzeugenden Inhalte. Mit dem Einsatz von kontrastreichen Farben erhöhst Du gezielt die Aufmerksamkeit von Links und Buttons, die zu deinen Produkten führen.

Was gehört in den Header?

In den Header deiner Nischenseite gehört ein thematisch passendes Logo. Der Besucher muss direkt erkennen, um was es auf deiner Seite geht. Im WordPress Backend kannst Du unter Design > Header ein Headerbild (Logo) einfügen. Das Logo sollte möglichst Links im Header platziert sein. Die Internetnutzer haben sich daran gewöhnt, links oben ein Logo zu finden. Das ist ein ungeschriebenes Gesetz, an das Du dich halten solltest.

Eine Reihe von Themes bieten die Möglichkeit, ein Banner in den Header einzufügen. In der Regel wird ein 468×60 Banner oben rechts eingeblendet. Keine Frage, die Position ist es beim Aufruf deiner Nischenseite im sofort sichtbaren Bereich. Die Klickrate ist höher als an anderen Stellen. Ich nutze diese Position nicht überall. Ich mag keine Seiten auf denen mich die Banner fast schon anspringen. Das Werbemittel muss schon sehr gut zu deiner Nischenseite passen. Außerdem funktionieren Banner im Vergleich zu Affiliate-Textlinks wesentlich schlechter. Google mag Banner Above the Fold auch nicht mehr so gerne.

Logo oder nur Schriftzug

Es ist möglich nur einen Schriftzug, als Logo für die Nischenseite zu nutzen. Ein reines Textlogo vermittelt keine Bootschaft und wirkt lieblos. Wenn ich auf meine Seite Funkklingel-Ratgeber.de in den Header schreibe, weiß der Besucher, um was es geht. Mehr bringst Du aber nicht rüber. Besser ist eine Kombination aus Schriftzug und einer Grafik. Ein thematisch passendes Logo gibt deiner Seite ein seriöses Gesicht und baut vertrauen auf.

Wenn Du magst, schreibe unter das Logo noch einen Slogan (Claim). Ein kurzer Satz, der den Inhalt deiner Seite auf den Punkt bringt. Slogans bestehen mehrheitlich aus 3 bis 7 Wörtern. Aber bitte nicht länger.

Welche Größe muss mein Logo haben?

Je nach Theme wird dir eine Header-Größe empfohlen. Bei meinem MHTheme sind das 300×100 Pixel. Ich verwende auch Header Grafiken mit bis zu 1000 Pixel breite. Wichtiger als die Breite ist die Höhe des Logos. Nicht höher als 150 bis 200 Pixel. Du willst ja das deine Besucher möglichst viel vom Inhalt sehen. Von einem Monster Header können sie sich nichts kaufen und Du nichts verdienen.

Neben den Abmessungen ist die Dateigröße ebenfalls wichtig. Meine Logos bewegen sich im Bereich von 20 bis 50 Kilobyte. Du musst definitiv versuchen das Logo so gut zu optimieren, wie Du kannst. Die Qualität darf unter keinen Umständen sichtbar darunter leiden. Dein Logo ist das Aushängeschild deiner Nischenseite.

Ich optimiere die Dateigröße im ersten Schritt mit Gimp. Das WordPress Plugin EWWW Image Optimizer reduziert die Größe nach dem Hochladen. Wenn Du mit Google PageSpeed Insights deine Seite analysierst, werden dir optimierte Bilddaten zum Download angeboten. Das Thema werde ich in einer anderen Lektion noch beleuchten.

Die Grafik für meine Funkklingel Nischenseite habe ich auf Fotolia* gekauft, weil es auf Pixabay nichts Passendes gab. Mit Canva wurde die Grafik mit dem Schriftzug zusammengebaut. Mit dem Browser Plugin ColorZilla habe ich den exakten HEX Farbcode aus der Grafik geholt und für die Schriftart verwendet. Im Anschluss daran wurde der Hintergrund der Grafik mit Gimp transparent gemacht. Der transparente Hintergrund ist wichtig, falls Du dem Header eine andere Farbe geben willst.

Mit dem Ergebnis werde ich zwar nicht zur Akademie der Künste zugelassen. Für eine Nischenseite reicht das Design aber definitiv aus. Die komplette Arbeit inklusive Suche hat weniger 30 Minuten gedauert. Falls Du das Logo Design auslagern willst, empfehle ich dir Fiverr*. Dort kannst Du für fünf Dollar ein Logo erstellen lassen. Professionelle Logos bekommst Du bei Designenlassen.de*.

Funkklingel-Ratgeber.de
© nuiiun – Fotolia.com

Favicon

Ein Favicon ist ein weiterer Baustein, um deiner Nischenseite ein seriöses Erscheinungsbild zu geben. Dein Besucher kann sich bei mehreren geöffneten Browser Tabs besser zurechtfinden. Zusätzlich wird das Icon in den Lesezeichen angezeigt. Verzichte auf zu kleine Details im Favicon. Bei dieser Größe ist nichts zu erkennen. Die Abmessungen des Icons sollten 32×32 Pixel groß sein. In der Vergangenheit haben 16×16 Pixel gereicht. Der Einsatz des Favicons hat sich mittlerweile verändert. Es gibt spezielle Größen für Touch Icons. Wenn dich das interessiert und Du eine Anleitung suchst, schau mal HIER. Nach passenden Icons suche ich zuerst auf Pixabay. Wenn ich dort nichts finde, kaufe ich mir ein Passendes auf Fotolia*.

Falls dein Theme keine Auswahlfunktion für ein Favicon bietet, kannst Du die Code Zeile unten in die header.php einfügen.

<link rel="icon" href="http://deine-nischenseite.de/wp-content/uploads/favicon.ico" type="image/x-icon">

Hintergrund: Bild oder Farbe?

Ein thematisch sinnvolles Hintergrundbild, ist der perfekte Emotionsträger. Ein schönes Bild wertet die Qualität deiner Nischenseite auf. Verwendest Du ein schlechtes Bild, hat es genau den gegenteiligen Effekt. Wenn Du kein passendes Bild findest, verwende als Hintergrundfarbe Weiß, Hellgrau oder Creme. Damit machst Du in den meisten Fällen nicht viel Falsch. Bitte keine grellen Farbtöne. Das ist für die Augen viel zu anstrengend – Augenkrebs Gefahr!

Das Hintergrundbild darf nicht mitscrollen und muss fixiert sein. Daneben darf das Hintergrundbild nicht wiederholt werden (Kacheln). Außer Du verwendest spezielle Grafiken, die zum Kacheln geeignet sind. Das Hintergrundbild sollte auch auf großen Geräten den Bildschirm komplett ausfüllen. Ich verwende Bilder mit einer Breite von mindestens 2048 Pixeln.

Das Schwierigste ist es bei diesen Abmessungen die Dateigröße klein zu halten. Ein guter Richtwert sind 150 bis 300 KB. Größer sollten die Bilder nicht werden. Das hört sich viel an. Die Datei muss aber nur einmal geladen werden und befindet sich hinterher im Cache. Bilder mit bewussten Unschärfen, wie man sie von Spiegelreflexkameras kennt, können besser verkleinert werden. Oder Du färbst dein Hintergrundbild ein. Es lenkt nicht vom Content ab, sieht gut aus und Komprimierungen fallen nicht nennenswert auf.

Quellen für Bilder und Grafiken

Wenn ich Bilder suche, ist meine erste Anlaufadresse Pixabay. Die Datenbank steht komplett unter der Public Domain Lizenz. Die Bilder sind kostenlos, es muss kein Fotograf oder die Quelle genannt werden. Du kannst die Bilder auch kommerziell verwenden.

Sollte ich da nichts finden, kaufe ich meine Bilder bei Fotolia oder iStockphoto. Achte bitte immer darauf, was für Lizenzen die Bilddatenbanken anbieten. Wie muss der Hinweis des Bildnachweises aussehen? Informiere dich vorab, um Abmahnungen zu vermeiden. Hier ist große Vorsicht geboten. Wenn Du sichergehen willst, frag einen Anwalt, der sich damit auskennt.

Harmonische Farben

Die Farben auf deiner Nischenseite müssen zum Thema passen oder zumindest harmonisch wirken. Mein Barcelona Blog war in der Anfangszeit mit verschiedenen Blautönen gestaltet. Bis mich Peer von Selbständig im Netz mit seiner Seiten Analyse auf die richtige Spur gebracht hat. Zu Barcelona bzw. Spanien passen viel besser rote Farben. Ich mag zwar Blau, nur bei diesem Thema passt das nicht. Wenn Du mehr über die Wirkung von Farben erfahren willst, schau mal HIER. Verwende auf deiner Seite maximal 3 bis 4 verschiedene Farben. Nicht mehr – sonst wirkt das Design nicht rund. Mir reichen fast immer 2 oder 3 Farben.

Flat Design wirst Du heute überall antreffen. Kennst Du auch die passenden Flat Colors? Ich mag diese Farben. Sie sehen modern und stimmig aus. Inspirationen und Farbcodes bekommst Du HIER und HIER. Um den exakten Farbcode als HEX oder RGB-Farbwert zu bestimmen, nutze ich wieder das Browser Plugin ColorZilla. Damit kannst Du von jedem Element, dass Du auf deinem Bildschirm siehst, den Farbwert auslesen.

Mit Adobe Color CC findest Du neue Farbkombinationen, die zueinander passen. Du kannst auch dein Logo hochladen. Adobe ermittelt automatisch die passenden Farben.

Adobe Color CC - Aus Bild erstellen
Adobe Color CC – Aus Bild erstellen

Die richtige Schriftart

MHThemes - Typographie Optionen
MH Themes – Typographie Optionen

Verwende „eine“ Schriftart für den Content und die Navigation. Für das Logo oder bei Schriften in Grafiken kannst Du gerne eine andere verwenden. In vielen Themes sind bereits Schriftarten integriert. Bei meinem Theme habe ich Zugriff auf die Google Webfonts. Die Sammlung ist weit verbreitet und sieht auf fast allen Geräten gleich aus. Es ist möglich, die Google Webfonts mit dem WordPress Plugin Easy Google Fonts für dein Theme nachzurüsten.

Große Schriftgrößen liegen voll im Trend. Stelle mindestens die Schriftgröße 16px ein. Die Lesbarkeit deiner Inhalte wird verbessert und deine Texte wirken länger. 😉 Die Schriftart muss auf allen Geräten lesbar sein. Teste deine Nischenseite auf verschiedenen Geräten. Schreibe keine Sätze mit durchgehend Großbuchstaben. Das erschwert die Lesbarkeit. Um weiterführende Links unterzubringen, schreibe ich HIER manchmal groß. Das ist aber die Ausnahme.

Mehr über Websichere-Schriftarten erfährst Du bei WebTypoBuch.de und auf Emotion-im-Web.de.

Was gehört in die Sidebar?

Ich setzte die Sidebar auf fast allen meinen Nischenseiten ein. Je mehr Content Du hast und der Community Gedanke bei dir verankert ist, desto sinnvoller ist eine Sidebar. Von zwei Sidebars würde ich abraten. Das brauchen nur ganz große Projekte.

  • dem Besucher weitere Navigationsmöglichkeiten bieten.
  • den Besucher über Social Media und Newsletter an dich binden.
  • die interne Verlinkung stärken, was gut für dein Google Ranking ist.
  • Platz zum Bewerben von Produkten

Es geht auch ohne Sidebar. Wenn Du wenig Ablenkung willst und Du eine andere Strategie verfolgst, blende die Sidebar aus.

Suchbox

Ganz oben baue ich in aller Regel eine Suchbox ein. Bei einer kleinen Nischenseite mit wenigen Unterseiten darfst Du gerne darauf verzichten. Bei regelmäßig neuen Inhalten ist eine Suche nützlich. Wenn Du Google Analytics benutzt, kannst Du unter Verwalten > Einstellungen der Datenansicht > Site Search-Einstellungen die interne Suche von WordPress auswerten. Das hilft dir rauszufinden was deine Besucher bei dir Suchen und welche Inhalte es bei dir noch nicht gibt. Hier findest Du mehr zu diesem Thema.

Google Analytics - Site Search Einstellungen
Google Analytics – Site Search Einstellungen

Das beste Produkt deiner Nische

Zeige das beste Produkt deiner Nische in der Sidebar an. Wenn Du erst gestartet bist und das Amazon Partnerprogramm nutzt, blende den Bestseller oder das am besten bewertete Produkt ein. Nach ein paar Monaten kannst Du in deiner Amazon Statistik (Homepage > Berichte > Bestellberichte) nachschauen, welches Produkt sich tatsächlich über deine Nischenseite am besten verkauft. Verwende dieses Produkt oben im sofort sichtbaren Bereich. Ich nutze dafür die Widgets vom Plugin AAWP*. Du kannst auch eigene Produkte wie Ebooks in der Sidebar promoten.

Bannerwerbung

Du kannst für Banner ein einfaches Text Widget verwenden. Dieses kann mit HTML oder Java Script umgehen. Es gibt umfangreiche Plugins wie AdRotate, um mehrere Banner abwechselnd einzublenden. Views und Klicks können damit überwacht werden.

Ich verzichte auf meinen Nischenseiten fast komplett auf Bannerwerbung. Banner haben im Vergleich zu Textlinks eine deutlich schlechtere Klickrate. Die meisten Internetnutzer sind bannerblind oder fühlen sich gestört. Viele nutzen außerdem einen Adblocker, um Werbebanner auszublenden. Die Zahlen reichen von 25 bis 80 %. Die Quellen schwanken HIER und HIER sehr stark. Fakt ist, dass immer mehr Menschen die Technik einsetzen.

Auch Google findet zu viel Bannerwerbung auf deiner Seite nicht gut. HIER kannst Du nachlesen warum. Banner beeinflussen negativ die Ladegeschwindigkeit deiner Seite.

Social Media Links

Wenn Du für deine Nischenseite Social Media Kanäle nutzen willst, packe die passenden Icons in die Sidebar. Bei den MH Themes* ist bereits ein Social Widget integriert. Du kannst die Verlinkungen auch über das Text Widget oder ein andere Social Plugin nachrüsten. Denk daran, dass die Nutzung von Social Media Kanälen auf Nischenseiten nur sinnvoll ist, wenn Du regelmäßig Inhalte veröffentlichst und eine Community aufbauen willst. Sonst ist das Zeitverschwendung.

Autorenbox

Gleiches gilt für eine Autorenbox. Wenn Du mit deinen Besuchern eine Beziehung aufbauen willst, zeig dich und schreibe etwas über dich. Ansonsten verzichte darauf.

Newsletter Optin

Wenn Du Newsletter Marketing verwenden willst, ist das Anmeldeformular für die Newsletter Liste in der Sidebar gut aufgehoben. Als Newsletter Anbieter benutze ich Aweber*.

Weitere Anbieter

Neue Artikel & beliebte Artikel

Die beiden Widgets blende ich weiter unten in der Sidebar ein. Je nach länge deiner Inhalte lasse ich 5 bis 10 Ergebnisse anzeigen. Du bietest deinem Leser mehr Content an und stärkst die interne Verlinkung.

Was gehört nicht in die Sidebar?

  • Kalender Widget: Nutzt niemand zum Navigieren
  • Letzte Kommentare Widget: Nutzt niemand, um bei Kommentaren auf dem laufenden zu bleiben
  • Meta Widget: Um sich direkt über das Frontend einzuloggen. Sieht komisch aus. Reicht nur noch, das jemand seine Login Daten neben dran schreibt 😉
  • Schlagwörter Wolke: Für die interne Verlinkung zwar gut, aber kein Mensch klickt da drauf.

Was gehört in den Footer?

Den Footer nutze ich kaum. Weitere Social Media Icons zu deinen Kanälen und ein Newsletter Anmeldeformular wären vorstellbar. Mir reicht eigentlich die Sidebar aus. Es geht nicht darum, alle Plätze auf deiner Nischenseite vollzustopfen. So viel wie nötig, so wenig wie möglich!

Was gehört in die Hauptnavigation?

Die Hauptnavigation muss leicht zu bedienen sein. Menüs, die mit dem Mouse Over Effekt vergrößert werden, lassen sich auf einem Touchdisplay nur schwer bedienen. Einzelne Menüpunkte sollten kurz gehalten werden. Verwende maximal drei Wörter pro Menüpunkt. Meine Navigationen auf Nischenseiten haben fast nie mehr als sieben Menüpunkte.

Damit Du ohne Inhalte zum Start deine Navigation erstellen kannst, lege dir leere Dummy Seiten, Kategorien und Beiträge an. Mit Inhalt kannst Du diese immer noch füllen oder Du verwendest Blindtext.

Hauptnavigation meiner Funkklingel Nischenseite
Hauptnavigation meiner Funkklingel Nischenseite

Verwende…

  • einen direkten Weg zur Startseite
  • deine wichtigsten Keywords. Diese müssen einen eigenen Punkt in der Navigation haben.
  • für zukünftige Artikel eine Kategorie als Menüpunkt. Diese kannst Du Blog, Ratgeber oder Tipps nennen.
Wordpress - Menüstruktur - Hauptnavigation
WordPress – Menüstruktur – Hauptnavigation

Pflichtmenü: Was ist das und wo hin damit?

Neben der Hauptnavigation musst Du noch ein Pflichtmenü für die rechtlichen Unterseiten anlegen. Dort wird das Impressum, Datenschutzerklärung, Kontaktformular und die Kennzeichnung von Werbung verlinkt. Blende es am besten in der Fußzeile ein.

Pflichtmenü
Pflichtmenü
Wordpress - Menüstruktur - Pflichtmenü
WordPress – Menüstruktur – Pflichtmenü

Beiträge oder Seiten

Ich verwende für meine Hauptkeywords bei WordPress Seiten. Die ich direkt in der Hauptnavigation verlinke. Beiträge verwende ich vor allem für zukünftige Artikel und um Longtail Traffic zu generieren.

Kommentare erlauben: ja oder nein?

Nur wenn Du dich mit dem Thema auskennst und antworten kannst. Sonst bringt dir das nichts und deinen Besuchern auch nicht. Für den Aufbau einer Community sind Kommentare Pflicht. Bei produktbezogenen Nischenseiten würde ich sagen, nein. Bei Ratgeber Nischenseiten, ja! Deaktiviere die Kommentare bei deinen rechtlichen Pflichtseiten. Du willst schließlich keine Kommentare im Impressum.

Weitere Einstellungen am MHTheme – MH Magazin 3.0

MHThemes - Anpassen - Allgemein
MH Themes – Anpassen – Allgemein
MHThemes - Anpassen - Layout
MH Themes – Anpassen – Layout

Ich nutze zwei Sidebars, um das Layout auf 1300 Pixel umzustellen. Das Suchfeld im Header deaktiviere ich, weil ich dies über ein Widget in der Sidebar veranker. Breadcrumb Navigation für eine gute interne Verlinkung. Social Buttons verwende ich über das datenschutzkonforme Plugin Shariff Wrapper. Da ich eine produktbezogene Nischenseite aufbaue, deaktiviere ich die Autorbox und blende das Datum, Autor und Kommentare auf den Unterseiten aus.

MHThemes - Anpassen - Benutzerdefiniertes CSS
MH Themes – Anpassen – Benutzerdefiniertes CSS

Mit diesen beiden Zeilen Code in der CSS-Datei, kannst Du die zweite Sidebar ausblenden. Die 1300 Pixel Layout Breite bleiben erhalten.

MHThemes - Anpassen - Statische Startseite
MH Themes – Anpassen – Statische Startseite

Welche Anpassungen nimmst Du an deiner Nischenseite vor? Was machst Du anders?

Artikelserie: Schritt für Schritt Anleitung für Nischenseiten. Verpasse keinen Artikel!
Schließen Sie sich über 3000 Besuchern an, welche unseren Newsletter erhalten, und lernen Sie, wie Sie Ihren Blog für Suchmaschinen optimieren, gratis Traffic finden und Ihre Website vermarkten.
Wir hassen Spam. Ihre Email Adresse wird nicht verkauft oder an Drittparteien weitergegeben.
Hat dir dieser Beitrag geholfen? Teile diesen Beitrag!
content.de

Werbung

Über Johannes 53 Artikel
Johannes ist der Gründer der Nischenpresse. Wenn du Fragen hast oder dein Wissen mit mir teilen möchtest, dann schreib doch einen Kommentar oder klicke auf Kontakt.

14 Kommentare

  1. Hallo Johannes,
    wenn ich mich im Internet so umgucke und sehe welch Klientel (Alter) sich im Bereich „Geldverdienen im Internet“ bewegt, komme ich mir mit meinen >50 Jahren ziemlich „alt“ vor.
    Auf Deiner Seite bin ich eine ganze Zeit lang hängen geblieben um mir Deine interessanten Ausführungen von Lektion 1 bis 8 zu lesen. Doch nun zu meine Frage: Wann geht’s weiter? Oder hat sich das Thema bei Dir erledigt?
    MfG.
    Carsten

  2. Hallo Johannes,

    vielen Dank für deine guten und hilfreichen Erklärungen! Es ist eine Superarbeit, die du hier machst!

    Würde gerne wissen, wie du bei deiner „Funkklingel“ die Breadcrumps in ausführlicherer Länge hast, als den Seitentitel? Gibts da einen Trick? Ich benutze das MH Magazine Theme und habe diese Einstellung leider noch nicht gefunden.

    Gruß und alles Gute
    Wolf

      • Hallo Johannes,
        danke für die Antwort, aber ich stelle gerade fest, dass ich meine Frage nicht konkret genug formuliert habe 😉

        Hier an einem Beispiel deines „Funkklingel-Blogs“ was ich meinte:
        Wenn ich dort im Navigationsmenü: „Bestseller“ anklicke, sehe ich, dass deine Seite den Namen: http://funkklingel-ratgeber.de/bestseller/ trägt.
        Der Breadcrump lautet aber: Startseite > Die Funkklingel Bestseller – mit diesen Funkklingeln machst du nichts falsch!

        Bei mir erscheint zwar auch ein Breadcrump, aber nur der Seitentitel, wie ich ihn ins Menü geschrieben habe.

        Ich finde deine Methode jedoch besser. Wie funktioniert das? Ich komme momentan nicht drauf.

        Gruß
        Wolf

        • Hallo Wolf,

          doch Du hast deine Frage schon konkret formuliert. Nur stelle ich hier nichts ein. Das läuft alles automatisch bei dem Theme. Komisch das bei dir was anderes raus kommt. Hast Du mal den Support von MHThemes angeschrieben?

  3. Hallo Johannes,

    ich bin zufällig auf deiner Seite gelandet – und hängen geblieben.
    Jetzt wollte ich einfach nur kurz DANKE sagen, für die vielen super Tipps. Ich bin dabei, eine Nischenwebsite zu erstellen und da kommen deine Erklärungen natürlich gerade richtig.

    Herzliche Grüsse aus der Schweiz
    Tanja

  4. Hi Johannes,

    aber ein kostenloses Theme gewählt und es gibt keine Möglichkeit im Footer die Pflichtmenüs unterzubringen, da es gar keinen Footer gibt. Kennst du vielleicht irgendeine Möglichkeit das Impressum etc. trotzdem dort zu platzieren?

Kommentar hinterlassen

E-Mail Adresse wird nicht veröffentlicht.


*