Hilfreiche Tipps & Tricks rund um das Thema technische Suchmaschinenoptimierung
Der technischer Part oder die Qualität des erstellten Codes ist ein wichtiger Bestandteil jeder guten Suchmaschinenoptimierung und sollte nicht vernachlässigt werden.
Überschriften
Damit Suchmaschinen Ihre Inhalte besser interpretieren können, sollten Sie darauf achten Überschriften richtig zu verwenden: So ist eine H1 die oberste Überschrift und sollte auch nur einmal pro Seite verwendet werden. Anschließend verwenden Sie H2 usw.
Falsch:
<h1>Meine Überschrift</h1>
<h1>Meine Überschrift</h1>
<h3>Meine Überschrift</h3>
Richtig:
<h1>Meine Überschrift</h1>
<h2>Meine Überschrift</h2>
<h3>Meine Überschrift</h3>
Alternativtexte für Bildmaterial
Es kann passieren, dass Bildmaterial mal nicht ordentlich geladen werden kann. Das kann verschieden Gründe haben. Nun ist es aber wichtig, dem Besucher und auch den Suchmaschinen mitzuteilen, was das Bild für eine Aussage hat.
Falsch:
<img src="BILDPFAD"/>
Richtig:
<img title="Bauteil Ansicht von vorne" alt="Bauteil Ansicht von vorne" src="/bauteil-ansicht-vorne.jpg"/>
Titel für Verlinkungen
Jeder Link sollte einen Titel besitzen, der etwas über die Verlinkte Seite aussagt. Also wenn Sie auf "Leistungen" verlinken, sollten Sie einen Titel mit "Hier finden Sie alles über unsere Leistungen" verwenden.
Falsch:
<a href="DEINLINK">TEXT</a>
Richtig:
<a href="DEINLINK" title="Beschreibender Text">Über uns</a>
HTML5 - Elemente nutzen
Dank HTML5 ist es noch einfacher Ihren Content für Suchmaschinen aufzubereiten. So können Sie nun sagen, hier ist mein Header, mein Footer, meine Navigation usw.
Falsch:
<body>
<div></div>
<div></div>
<div></div>
</body>
Richtig:
<body>
<header></header>
<main></main>
<footer></footer>
</body>
HTML - Komprimierung
Ein wichtiger Bestandteil ist die Komprimierung der HTML-Ausgabe. Je weniger unnötige Zeichen Ihr Code enthält umso schneller kann Ihre Seite geladen werden.
Falsch:
<div>
<div>
<div><p>Text</p></div>
</div>
</div>
Richtig:
<div><div><div><p>Text</p></div></div></div>
CSS/JS Zusammenfassen
Alles CSS-Datein sollten in einer zusammengelegt werden. Ebenso auch die JS-Datein. Dies gibt Ihnen nochmal einen ordentlichen Schupser nach oben!
Falsch:
<!-- CSS -->
<link rel="stylesheet" type="text/css" href="HIER DER PFAD" media="all">
<link rel="stylesheet" type="text/css" href="HIER DER PFAD" media="all">
<link rel="stylesheet" type="text/css" href="HIER DER PFAD" media="all">
<!-- JS -->
<script src="HIER DER PFAD" type="text/javascript"></script>
<script src="HIER DER PFAD" type="text/javascript"></script>
<script src="HIER DER PFAD" type="text/javascript"></script>
Richtig:
<!-- CSS -->
<link rel="stylesheet" type="text/css" href="HIER DER PFAD" media="all">
<!-- JS -->
<script src="HIER DER PFAD" type="text/javascript"></script>
CSS/JS Komprimierung
Ein wichtiger Bestandteil ist die Komprimierung der CSS/JS-Ausgabe. Je weniger unnötige Zeichen Ihr Code enthält umso schneller kann Ihre Seite geladen werden.
Falsch:
.news_card {
display:block;
}
.news_card p {
font-size: 14px;
line-height: 20px;
}
$(document).ready(function(){
$('.sub_caret').click(function(e){
e.preventDefault();
$(this).closest('li').addClass('subOpen');
});
});
Richtig:
.news_card {display:block;} .news_card p {font-size: 14px;line-height: 20px;}
$(document).ready(function(){$('.sub_caret').click(function(e){e.preventDefault();$(this).closest('li').addClass('subOpen');});});
Meta-Daten
Eine ordentliche Beschreibung jeder Seite ist zwingend erforderlich. Beschreibe kurz und knackig was auf deiner Seite passiert. Zudem solltest du Keywords verwenden, auch wenn Google diese nicht mehr berücksichtigt.
<meta name="description" content="UND HIER DIE BESCHREIBUNG" />
<meta name="keywords" content="KEYWORD1, KEYWORD2, KEYWORD3, KEYWORD4, KEYWORD5">
Sitemap.xml
Erstellen Sie eine ordentliche Sitemap, damit Suchmaschinen alle Ihre Inhalte ordentlich auffinden.
Robots.txt
Im Internet gibt es viele Bots (kleine Programme), die jeden Tag nichts anderes tun als sich im Internet umzusehen. Mit einer ordentlich erstellten robots.txt sagen Sie den Bots welche Seiten diese besuchen und ggf. indexieren dürfen oder eben nicht.
Favicon/Appleicons
Nicht zwingen erforderlich aber sehr empfohlen. Ein Favicon ist das kleine Bild, welches Sie in Ihrem Tab im Browser angezeigt bekommen.
<link rel="apple-touch-icon" sizes="180x180" href="PFAD ZUM ICON">
Richtige Anordnung aller verwendeten Skripte
So wird CSS oben im Header eingebunden und JS unten im Footer
<!DOCTYPE html>
<html lang="de">
<head>
<!-- HIER GEHÖRT DAS CSS HIN! -->
<link rel="stylesheet" type="text/css" href="PFAD ZUR CSS-DATEI" media="all">
</head>
<body>
<!-- HTML-->
<main>
<p>TEXT</p>
</main>
<!-- UND ERST DANN DAS JS! -->
<script src="PFAF JS-DATEI" type="text/javascript"></script>
</body>
</html>
Hreflang-Links
Sofern du eine Inalte in unterschiedlichen Sprachen ausgibst, solltest du unbedingt Hreflang-Links angeben.
<head>
<!-- hreflang -->
<link rel="alternate" hreflang="en-gb" href="https://DEINE-SEITE.com/en-gb/DEINEUNTERSEITE/" />
<link rel="alternate" hreflang="fr-fr" href="https://DEINE-SEITE.com/fr-fr/DEINEUNTERSEITE/" />
<link rel="alternate" hreflang="de-de" href="https://DEINE-SEITE.com/de-de/DEINEUNTERSEITE/" />
<link rel="alternate" hreflang="x-default" href="https://DEINE-SEITE.com/en-en/DEINEUNTERSEITE/" />
<!-- hreflang -->
</head>
Canonical-Link
Und um Duplicate Content zu vermeiden, solltest du stets die Originalquelle mit einem Canonical-Link im HEAD eintragen.
<link rel="canonical" href="https://DEINEHOMEPAGE.com/de-de/DEINEUNTERSEITE/" />
Verwende Rich Snippets
Ein ganz wichtiger Punkt ist das Verwenden von Rich Snippets. Damit kannst du deine Inhalte sehr genau auszeichnen und für erleichterst Suchmaschinen die Zuordnung deiner Inhalte.
Hier zwei Ergebnisse meiner Optimierungen
Hier siehst du wie die Besucherzahlen jeden Monat steigen! Dadurch wird eine höhere Reichweite erzielt und Neukunden generiert!
Die Ergebnisse sprechen Bände! Neue Kunden können so schneller gefunden werden und Kosten für Werbekampagnen können so reduziert werden.
Allgemeine Tipps zum Thema Suchmaschinenoptimierung findest du hier.
Sie können Ihre bestehende Homepage auch einfach mal testen und schauen wie diese bewertet wird:
https://www.advertising.de/oneproseo/
Sie können Ihr Design auf responsives Verhalten hier testen:
http://www.responsive-tester.com/website-testen/
Sei der erste der kommentiert