WordPress Gutenberg
Auf Nutzerfreundlichkeit, klare Strukturen, geringe Ladezeiten und Verminderung von Absprungraten achte ich besonders. Dazu gehören auch inhaltlich gute Texte und passende Snippets. Und das von Anfang an, anstatt ein Projekt nach Abschluss mühsam optimieren zu müssen. Häufig erlebe ich, dass Webseiten erst, nachdem Sie programmiert wurden und online gegangen sind, optimiert werden (sollen). Sei es wegen zu großer Bilder, nicht durchdachtem Marketing oder wenig erfolgversprechender Texte. All dies steht für mich jedoch bereits am Anfang und falls wir gemeinsam beginnen ist dies alles Teil der Konzeptionsphase.
Themen dieses Beitrags
Einige Hilfestellungen aus meiner Praxis
- Texte erstellen, strukturieren und auszeichnen
- Texte bzw. Absätze hervorheben
- Texte fehlerfrei halten mit einem Plugin für den Browser
- Texte und Blöcke in WordPress
- Snippets als Aushängeschild bei Suchergebnissen
- Snippets erfolgreich texten
- Snippets und Verwendung von Sonderzeichen
- Snippets optimieren
- Linktipps
Websitetexte
Texte erstellen
Ziel einer Suchmaschine wie Google ist nicht einzelne Schlüsselbegriffe zu finden, sondern ganze Themenkomplexe zu erkennen und zu verstehen, sodass es überaus hilfreich sein kann, diese sogenannten Topics, als einzelne Artikel zu integrieren. Der Fokus sollte nicht auf ein oder zwei Varianten von womöglich Hunderten eines Suchbegriffs liegen, sondern auf dem gesamten Thema mit relevanten Inhalten, die dann die Website stärken. Gemeinsam entwickeln wir daher eine Content-Strategie, bei der unter anderem festgelegt wird, für wen wer wo wann welche Inhalte erstellt.
Überschriften
Texte strukturieren
Eine gute Seite bzw. ein Beitrag zu einem Thema enthält idealerweise mindestens 300 bis 800 Wörter. Die Überschrift H1 wird dabei nur ein Mal und nicht weiter verwendet. In WordPress wird diese über den Titel vergeben und kommt, analog eines Buchtitels, nur einmal vor. In passender Folge werden im Text nur noch H2 bis H6 ähnlich dem Inhaltsverzeichnis eines Buchs verwendet. Überschriften sollten mindestens 20 Zeichen lang sein und auf einer Seite bzw. einem Bereich immer unterschiedlich lauten. Keywords aus der Überschrift sind dann auch im Text zu verwenden, je nach Textlänge rund 7 bis 8 Mal. Das wichtigste Keyword sollte in der Meta Description für das Snippet und in den ersten 120 Zeichen des Textes enthalten sein sowie idealerweise als Alt-Attribut des Bildes der Seite sowie ggf. innerhalb des Beitrags fett hervorgehoben sein.
Hervorheben
Texte auszeichnen
Texte, die beispielsweise mit einer Textverarbeitung geschrieben wurden und von dort kopiert werden, immer als unformatierten Text einsetzen, da ansonsten die in der Regel Formatierungsanweisungen übernommenen und nicht überschrieben werden können. Markierung Fett, also b bzw. strong, einzelner Wörter oder von Phrasen, dabei wenn möglich zusammenhängend max. ca. 7 bis 8 Wörter bzw. unter 70 Zeichen. Werden längere Passagen, wie oftmals zum Beispiel bei Testimonials, in Fett benötigt, so berücksichtigte ich dies bereits bei Programmierung, sodass die Ausgabe (über das Stylesheet) zwar in Fett erfolgt, aber ohne die o.g. Schriftauszeichnungen (sogenannte Tags) benutzen zu müssen.
Revier markieren
Hervorhebung einzelner Wörter im Fließtext, optimalerweise nicht mehr als rund siebzig Zeichen je Phrase, durch Nutzung von Strong- bzw. Bold-Tags (circa ein Mal je fünfzig Wörter bzw. maximal ein Mal je Absatz).
Durch Dick und Dünn
Ganze Absätze, aber auch Überschriften, die dünner oder dicker dargestellt werden sollen, ohne dass wir die Optimierung für Suchdienste negativ beeinflussen, lässt sich in WordPress über Typografie bewerkstelligen (ggf. über die drei Punkte im Menü „Design“ einblenden).
Bunt und in Farbe
Soll von den mittels Advanced Custom Fields, Syntactically Awesome Style Sheets bzw. Cascading Style Sheets zugewiesenen Farben abgewichen werden, lässt sich das an dieser Stelle ebenfalls für einen ganzen Block vornehmen.
Exkurs zu Rechtschreibung und Grammatik
Schreibassistent als Browser-Plugin
Längere Texte schreibe ich in einer Office-Anwendung, lass diese dann erst mal über Nacht liegen und gehe diese am nächsten Tag noch ein Mal durch bevor ich diese Online stelle. Manchmal bin ich ungeduldig oder es steht ein kurzer Artikel für Social Media an.
Hervorragende Dienste leistet mir dabei seit kurzer Zeit der “Schreibassistent” LanguageTool, den es u.a. für Google Chrome und Firefox gibt. Bereits in der kostenfreien Version macht er auf Rechtschreibung, Grammatik, aber auch auf Stilfehler wie z.B. Redundanzen im Text aufmerksam ➤ www.languagetool.org. Die Einbindung in gängige Office- und Mailprogramme ist ebenfalls möglich, allerdings hält sich meine Begeisterung – im Gegensatz zur Integration in Browser und Mailprogramm – im Falle von LibreOffice in Grenzen.
Gutenberg
Standard Blöcke
Im Gegensatz zum bisherigen klassischen Editor verwendet WordPress im seit Version 5 erhältlich Editor Gutenberg sogenannte Blöcke, wobei es letztendlich um nichts weiter handelt als einzelne Elemente der Website.
Zu den Standardblöcken gehören u.a. die am meisten gebrauchten Funktionen wie Überschriften, ein simpler Absatz für den Fließtext, Listen, Tabellen, ein Bild oder eine Bildergalerie.
Bausteine
Wiederverwendbar
Diese ähneln, obwohl sie deutlich komplexer gestaltet werden können, einem Textbaustein. Ändert sich ein wiederverwendbarer Block, aktualisieren sich auch alle Verknüpfungen. Er kann an globaler Stelle angepasst werden und ändert sich auf allen Unterseiten, auf denen der er eingefügt wurde und die Verknüpfung noch besteht. Praxisbeispiel Öffnungs- und Sprechzeiten. Bei einer Veränderung muss nur ein Element geändert werden, die Seite mit den Sprechzeiten ändert sich ebenso automatisch wie auch die Fußzeile. Ideal auch für Praxisvertretungen zu Urlaubszeiten. Die einzelnen Ärzte und Ärztinnen sind als wieder verwendbarer Block hinterlegt und müssen nur jeweils aktiviert werden, anstatt diese jedes Mal mühsam einzugeben.
Vorlagen
Vorlagen bzw. Patterns
Vordefinierte, individuell für Ihr Projekt erstellte Block Layouts, die sehr einfach eingefügt und dann angepasst werden können. Diese werden auch als Patterns bezeichnet. Grundgedanke ist z.B. für einzelne Varianten von Kästchen entsprechende Vorlagen zu programmieren, die alle Formatierungen ebenso enthalten wie Blindtext und ggf. Bilder. Diese können an passender Stelle auf der Seite ausgewählt, eingesetzt und bearbeitet werden. Die als Vorlagen (Pattern) eingefügten Blöcke sind nach dem Einfügen nicht mehr mit ihrem Original verknüpft. Sollte sich das Pattern ändern, bleiben die bereits eingefügten, im Gegensatz zu wieder verwendbaren Blöcken, unverändert.
Bausteine
Blockkonzept in WordPress
Mehr Informationen zum Thema Blöcke, wie man diese einsetzt sowie zu Vorlagen und wiederverwendbaren Bausteinen in WordPress unter www.servicepraxis.com/themes.
Snippets
Optimierung für Suchdienste
Snippets sind Ihr Aushängeschild auf der Suchergebnisseite (SERP) schlechthin und wichtiger Bestandteil jeder Art von Content-Marketing. Aufbau: Überschrift (Titel) | Website, Marke, (Firmen-) Name o.ä. Adresse der Website. Beschreibung bzw. Meta Description. Auf der Start- bzw. Homepage werden i.d.R. Titel und Name bzw. Brand in der ersten Zeile getauscht:
Beispiel Homepage
www.servicepraxis.com
Servicepraxis | Web Service für die Praxis
Sie suchen eine Website, die es nicht im Regal gibt, jemand der Ihnen den Rücken frei hält, Ihre Homepage betreut? Mach’ ich ☏ 0911 49 75 58.
Beispiel Seite bzw. Beitrag
www.servicepraxis.com > webkonzepte
Webkonzepte für die Praxis | Servicepraxis
Ich erstelle nicht nur die Website ✓ Sondern sichere von Anfang an Ihren Erfolg mit ausgefeilten Konzepten, Individualität und Optimierung.
Grob vereinfacht kann man auch hier die Website für alle Kategorien, Seiten bzw. Beiträge wie ein Buch auffassen: Das Snippet setzt sich zusammen aus Kapitel, Buchtitel und der Beschreibung als extrem gekürzter Klappentext.
Schnippsel erstellen und optimieren
Erfolgreiche Snippets texten
In Überschrift (Titel) sollte unbedingt das wichtigste Keyword des Artikels platziert sein, die Beschreibung (Description) mag für den Suchdienst weniger Gewicht haben. Geschickte Formulierungen erhöhen deutlich potenzielle Nutzeraktionen (CTR, Click-Through-Rate bzw. Kickrate). Meist ist ein Suchdienst erster Kontakt eines Interessenten mit Ihnen. Hier entscheidet sich bereits, ob Nutzer:innen Ihre Website besuchen und Sie ggf. kontaktieren. Daher sollte dieser Teil der Optimierung auf keinen Fall vernachlässigt werden.
Die ideale Länge von Snippets beträgt im Titel 580 Pixel (Desktop) beziehungsweise 920 Pixel (Mobile) sowie für die Description 990 Pixel (Desktop) beziehungsweise 1.300 Pixel (Mobil). Als maximale Länge des Titels werden ca. 70 Zeichen empfohlen, als ideale Länge 55 bis 65 Zeichen, für die Beschreibung maximal 160 Zeichen, als optimal gelten 150 bis 155 Zeichen. Die Chance, dass Suchdienste unsere eigene Meta Descriptions anzeigen werden, sinken in der Desktopversion ab 165 Zeichen und mobil ab 118 Zeichen.
Search Engine Result Page SERP
Sonderzeichen in Snippets
Sich von Wettbewerbern abheben? Das geht! Beispielsweise durch Nutzung von Sonderzeichen sowie Icons und Emojis, um die Aufmerksamkeit des Nutzers einer Suchmaschine zu erhöhen. Beim Einsatz von Emojis rate ich aber zur Vorsicht, es sei denn, Sie verkaufen kunterbunte Comics online.
Häkchen sind ideal in bzw. hinter Aufzählungen.
Pfeile erhöhen die Aufmerksamkeit für die nun folgende Aussage.
Sterne stellen Qualitätsmerkmale heraus bzw. suggerieren solche.
Verkehrssymbole wie ein Flugzeug sind ideal für die entsprechenden Branchen.
Bei Telefon oder Briefumschlag wissen Nutzer:innen sofort, worum es geht.
Wie so oft gibt uns Google die wichtigsten Regeln vor. Am Anfang und am Ende werden Sonderzeichen nicht angezeigt. Ggf. werden mehrfach, sich wiederholende Zeichen entfernt, was sich durch Kombination von Sonder- mit Standardzeichen vermeiden lässt. Da im Titel und in der Beschreibung unterschiedliche Zeichen erlaubt sind, sollten beide Elemente (separat) optimiert werden. Sistrix bietet eine Liste mit z.Zt. über 800 Symbolen auf ➤ Google Docs.
Snippets Optimieren
Tipps aus der Praxis
Ansprechende Titel, die zum Klicken anregen; Brand- oder Unternehmensnamen nennen, um die eigene Marke zu stärken. Beschreibung kurz, knapp, informativ halten und ggf. Inhalte mit Sonderzeichen trennen. Auf Lesbarkeit und Attraktivität des Snippets achten statt den Versuch zu unternehmen möglichst viele Keywords unterzubringen, am Schluss klickt immer der Mensch und nicht die Maschine.
Auch wenn nicht unter den ersten drei Ergebnissen nicht verzagen, denn optisch ansprechende und informative Snippets werden in der Praxis durchaus häufiger geklickt als schnöder, womöglich automatisch generierter und abgeschnittener Text.
Das Snippet wird nicht angezeigt? Selbst bei optimiertem Vorgehen kommt es häufig vor, dass für die Beschreibung Suchdienste sich einen Teil des Textes ziehen statt unserer Metabeschreibung, wenn der Algorithmus der Meinung ist, dass dieser Ausschnitt besser zur Suchanfrage passt.
Ihnen ist das alles viel zu aufwändig? Sie haben weder Zeit noch Lust? Sie benötigen jemanden, der Ihnen das alles abnimmt. Buchen Sie formlos ein kostenfreies Erstgespräch mit mir.
Tools
Keywords
Keywords bzw. semantisch passende Suchbegriffe finden Sie u.a. via Hypersuggest oder Ubersuggest. Vorschläge als auch monatliches Suchvolumen zeigt keyword-tools.org.
Optik
Website
Wie schaut die Seite auf unterschiedlichen Geräten aus? Man kann hierzu die Konsole des jeweiligen Browsers nutzen oder alternativ z.B. bluetree.ai/screenfly oder responsinator.com.
Check Up
Optimierung
Prüfung Seitenaufbau etc. für Suchmaschinenfreundlichkeit unter anderem seobility.net, Snippets Tool zur Vorschau und zur Optimierung zum Beispiel app.sistrix.com.