Suchmaschinen-Optimierung (=SEO/Search Engine Optimization) hat zum Glück mit Grafik-Design nichts zu tun. Oder? Eigentlich doch! Denn beim Webdesign verschmilzt vieles miteinander: Design und Programmierung bilden ein Tandem. Was aber muss ein Designer, der eigentlich nur gestalten will, beachten, wenn er auch die Suchmaschine erreichen will? Unser Autor Ralf Wasselowski erklärts im Blog.

Gestaltung und Programmierung formen das Look&Feel einer Webseite. Erst das führt dazu, dass man sich als Nutzer mit der grafischen Benutzeroberfläche wohlfühlt. Dazu gehören bestimmte Funktionalitäten: Wie bequem lassen sich Videos abspielen? Wie schnell kann ich über Eingabefelder oder Buttons meine Fragen klären und zu wichtigen Informationen gelangen? Wie hürdenlos ist der Bestellprozess im Shop erledigt?

Synthese aus Inhalt, Design und Programmierung

Es geht also nicht nur darum, etwas zu designen, und auch nicht nur darum, wie das Gestaltete technisch realisiert wird – die komfortable Synthese aus beidem ist gewünscht. Zusätzlich zu den Bedürfnissen des menschlichen Nutzers will das technische Bedürfnis nach Auffindbarkeit befriedigt werden. Ein Suchroboter (=Web-Crawler) besucht die Webseite und scannt sie nach Begriffen. Inzwischen soll er im sogenannten “semantischen Web” sogar Bedeutungen erkennen. So unterscheidet er, dass eine Seite, auf der es um “Schimmel” geht, entweder eine Seite über weiße Pferde ist oder aber von Schimmelpilz handelt. Dabei setzt die Suchmaschine alle verbalen Informationen in Verbindung zueinander, um besser verstehen zu können, worum es auf der Seite geht und welche Informationen sie zur Beantwortung möglicher Fragen des Suchenden bereit hält. Aber wie sieht die Suchmaschine die Webseite und was muss der Designer berücksichtigen, um die Suchmaschine zufriedenzustellen? Wir behandeln nachfolgend 10 grundlegende Regeln für die Verbindung von SEO und Design.

 

1. Webdesgin: Für den Menschen und die Suchmaschinen

Alles im Web hat zwei Zielgruppen: Den Menschen und die Maschine. Die “Maschine”, das sind kleine Programme als “Suchroboter” (=Web-Crawler), die das Web nach Informationen durchforsten um ihre Suchmaschine damit zu füttern. Für den Menschen, der die Webseite betrachtet, sind andere Dinge wichtig als für die Suchmaschine. Deshalb ist der Beruf des Webdesigners an der Schnittstelle zwischen Gestaltung und Programmierung angesiedelt. Dem Leser und der Suchmaschine muss die Seite gleichermaßen gefallen, damit sie im Ranking auf den vorderen Plätzen erscheint. Der Designer ordnet über seine Gestaltung die Informationen und unterstützt so auch inhaltliche Zusammenhänge.

 

2. Struktur: Klarheit für eine gute Orientierung

Eine Suchmaschine soll die Nadel im Heuhaufen finden – jene Information nämlich, die den Suchenden wirklich interessiert. Damit Wichtiges von weniger Wichtigem oder Spezifisches von Allgemeinem getrennt werden kann, muss eine Webseite klar strukturiert sein. Das ist zuerst eine ordnende Tätigkeit und dann eine gestalterische. Denn erst Designtugenden wie Klarheit und Prägnanz verhelfen einer Seite zu einer übersichtlichen Gliederung. Im Web ist alles Struktur: Vom Design der kleinen Sinneinheiten bis zur Programmierung, von der Navigation bis zur Seitenabfolge ordnet sich alles einer Struktur unter. Das gilt auch für das Inhaltsgerüst mit Überschriften, Unterüberschriften und normalem Body-Text. Die Suchmaschine honoriert ein gut strukturiertes Design, weil es Sinneinheiten schafft, die sie einordnen kann.

 

3. Programmieren: Für die Augen der Suchmaschine

Unter der Motorhaube des schönen Designs liegt die Programmierung. Die ersten Webseiten wurden in reinem HTML (HyperText Markup Language) geschrieben. Das ist eine simple Programmiersprache, die gut für jede Suchmaschine zu verstehen ist. Inzwischen wird auf die eigentliche Programmiersprache wie eine Folie die Stil-Programmiersprache CSS gelegt. Sie enthält alle Gestaltungsvorgaben. HTML wäre so gesehen der unbekleidete Mensch, CSS seine Kleidung – die sich bequem jederzeit wieder austauschen lässt. Nicht immer kann der Web-Crawler der Suchmaschine sehen, was sich in CSS oder in Java-Script, einer anderen häufig verwendeten Sprache, verbirgt. Was aber unter einfachem HTML funktioniert, lässt auch das Herz der Suchmaschine höher schlagen. Gestaltet der Designer eine einfache Seite übersichtlich, kann der HTML-Quellcode der Webseite maschinenfreundlich ausfallen und mit weiteren Informationen zur Seite ergänzt werden.

 

4. Verlinkung: Wie ein internes Inhaltsverzeichnis

Sich auf einer Seite zurechtzufinden hat mit der Navigation der Seite zu tun. Wichtig ist zudem, von jeder Sinneinheit zur nächsten zu gelangen. “Sinneinheit”, das kann ein Video sein oder ein Textabschnitt, eine Grafik oder Teil einer Infografik. Von dort gelangt man über Links zu ergänzenden Informationen auf der eigenen Webseite. Die interne Verlinkung ist für Google eines der wichtigsten Rankingkriterien. Es kann sogar Unterseiten geben, die nicht über einen externen Link erreichbar sind, sondern nur über den internen auf der eigenen Webseite. Dass und wie der Designer Verlinkungen gestaltet, führt zu mehr Seitenaufrufen.

 

5. Interatkionen: Zielgruppen und Social Media-Reaktionen

Was der Betrachter einer Webseite an ihr mag, findet auch Google gut. Positive Bewertungen auf der Webseite, Kommentare oder Reaktionen über Social Media wie Facebook, Twitter, Instagram, YouTube oder Google+ sind für Google positive Zeichen. Sie zeigen an, dass die Seite wichtig ist. Darüber hinaus kann über Social Media ein aufmerksamkeitssteigernder Schneeballeffekt erzielt werden. Je zielgruppengerechter eine Webseite in Design und Funktionalität ist, desto mehr Interaktionen mit dieser Zielgruppe sind die Folge. Die Suchmaschine registriert, wenn der Designer eine Seite so gestaltet hat, dass sie die Zielgruppe anzieht und dort auf ihren Profilen für Aufmerksamkeit sorgt.

 

6. Mobile first: Das Internet in der Hosentasche

Das mobile Internet denkt nicht vom größten Bildschirm aus sondern vom kleinsten. Denn eine Internetseite sollte sich auf jeder Bildschirmgröße darstellen lassen. Der Webdesigner muss bei aller Mobilität die Konsequenzen für Aufbau und Gestaltung der Seite berücksichtigen. Geht er auf die Erfordernisse von Smartphone-Bildschirmen ein, geht er gleichzeitig auf seine Zielgruppe zu und beschert ihr ein positives Erlebnis. Mobil kommt das Internet noch schneller und flüchtiger daher als am Desktop-PC. Doch kann der Designer hier, auch über die positiven Rankings der Suchmaschinen, den meisten Nutzerzuwachs generieren. Das schafft er, indem er aus der Not eine Tugend macht und seine Seite auf den kleinen Bildschirm hin optimiert.

 

7. Anpassungsfähigkeit: Responsives Webdesign

Seit 2015 ist Mobilfreundlichkeit ein Rankingkriterium der mobilen Suche für Google. Dass sich die Webseite überall gut darstellen lässt, bringt fast zwangsläufig mehr Besucher. Google hat unter seinen Kriterien für seine Mobilrankings auch gestalterische Vorgaben, die erfüllt sein müssen. So soll der Text lesbar sein, ohne dass gezoomt werden muss. Auch der Abstand zwischen Textlinks muss so groß sein, dass der Nutzer nicht den falschen anklickt. Google belohnt die Einhaltung solcher Standards mit einem verbesserten Ranking.

 

8. Ladezeiten: Im Web auf der Überholspur

Durch immer bessere Mobilfunk-Bandbreiten laden auch mobil große, komplexe Webseiten schnell. Unterwegs gibt es aber nicht immer LTE, und im heimischen Wohnzimmer teilen sich manchmal mehrere Familienmitglieder die Bandbreite des W-LAN, was den Einzelzugriff verlangsamt. Damit eine Seite dennoch schnell lädt, sind verschiedene Einflussfaktoren wichtig: Der Designer kann Bilder auf geringere Dateigrößen hin optimieren. Oder er kann seine gestalterischen Mittel mit viel Ökonomie einsetzen, damit zu viele Seitenelemente die Webseite nicht verlangsamen und der Code der Seite schlank bleibt. Die kurze Ladezeit der Webseite ist ein Faktor, der die Seite im Ranking mit nach oben bringt.

 

9. Bilder: Dahinter stecken tausend Worte

Ein Bild im Web ist nicht nur ein Bild. Denn dem Bild zugeordnet sind sein Dateiname, die Title- und Description-Tags, die das Motiv des Bildes beschreiben, und die Exif-Daten. Diese enthalten neben fototechnischen Informationen auch solche wie Datum, Uhrzeit und geografische Koordinaten. Die Google-Suchmaschine kann solche Informationen lesen. Darüber hinaus bezieht sie zur Einordnung des Bildes auch den Text mit ein, der auf der Webseite in der Nähe des Bildes steht. Für den Designer bedeutet dies, Bildern über die Tags akkurate Bildbeschreibungen hinzuzufügen. Außerdem ist es aus SEO-Gründen sinnig, darauf zu achten, dass Bilder Sinneinheiten mit Texten bilden, die ihnen zuzuordnen sind. Am wichtigsten ist die Bildreadaktion: Denn wenn der Designer aussagekräftige Bilder einsetzt, werden diese über die Google-Bildersuche mehr angeklickt.

 

10. Content: Guter Inhalt, gutes Ranking

Der Designer schafft die Form für den Inhalt. Damit interpretiert er den Inhalt und bringt ihn zur Geltung. Wenn ein zielgruppenrelevanter, aussagekräftiger und serviceorientierter Inhalt kongenial gestaltet wird, spricht das auch die Suchmaschinen an. Wichtiger Content sollte, ohne scrollen zu müssen, auf den ersten Blick sichtbar sein. Wichtige Suchbegriffe sollten groß herausgestellt werden, indem sie in den Überschriften stehen. Webtexte befinden sich so an der Schnittstelle zwischen Texter und Designer. Der Designer ist jedoch dafür zuständig, dass alles, das wichtig ist, sofort wahrnehmbar ist – für den Leser und zunehmend auch für die Suchmaschine.

[av_button label=’Infografik zum Download‘ link=’manually,https://www.viaprinto.de/blog/wp-content/uploads/2017/08/blog_infografik_grundregeln_seo.pdf‘ link_target=’_blank‘ size=’medium‘ position=’center‘ icon_select=’no‘ icon=’ue800′ font=’entypo-fontello‘ color=’theme-color‘ custom_bg=’#444444′ custom_font=’#ffffff‘]