SEO: OnPage Optimierungen erfolgreicher Webseiten, Gastvortrag Uni Bayreuth 2013

Preview:

DESCRIPTION

Einleitung in das Thema SEO anhand einiger Praxis-Beispiele. Fokus auf Google konforme OnPage Optimierungen. Mehr Infos zu OnPage.org: http://de.onpage.org/ Mehr Infos zu Jan Hendrik Merlin Jacob: http://hjacob.com/

Citation preview

Wie optimieren erfolgreiche Unternehmen Ihre Webpräsenz?

Jan Hendrik Merlin Jacob

! @jhmjacob" fb.me/jhmjacob# hjacob.com/

!

Studium:

» Wirtschaftsinformatik (Universität Marbug / Fernuniversität Hagen)

» Dialog- & Online-Marketing (Bayerische Akademie für Werbung & Marketing)

Entrepreneur:

» 2002: Gamona.de

» 2006: JobAustralia Ltd.

» 2008: Evenity GmbH

» 2012: OnPage.org GmbH

Über mich

Sonstiges:

» 2003/2004: Worldtravel

» 2013: Young-Entrepreneur of the Year, Startup of the Year (Verband der dt. Internet Wirtschaft, eco)Bestes Startup, Bayern(kfw Bank)

Wir bauen innovative Tools für bessere Webseiten!

Just kidding :-)

Die nächsten 2 Stunden

1. Basics

2. Google Updates

3. Beispiel: High Quality Websites

4. Seitenarchitektur / Crawlability

5. Website Quality Management

6. Beispiel: Workflow

Basics1. Was ist HTML

2. Wie ist eine Webpage aufgebaut

3. Was ist der DOM Tree

4. (Responsive) Design

5. Crawler

6. Search Index

7. Page Scoring / Pagerank

8. SEO

<b class=“green“>Dicker Text!</b>

Tag Start

Tag Inhalt

Tag Ende

Attribut- Name

Attribut-Wert

HTMLBasics

Eine WebsiteBasics

<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Seiten Titel</title> <meta name="description" content="Beschreibung!"/> </head> <body> <h1>Hallo Welt</h1> <p>Ich bin der Text</p> </body> </html>

<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Seiten Titel</title> <meta name="description" content="Beschreibung!"/> </head> <body> <h1>Hallo Welt</h1> <p>Ich bin der Text</p> </body> </html>

Eine WebsiteBasics

Eine WebsiteBasics

firebug: Ansicht des DOM Trees getfirebug.com <- Must have für Webworker! (Firefox plugin)

Benutzer via Browser

Server

1. Request

2. Response

Anfrage bURL, Cookies, erlaubte Verschlüsselung, etc.

Antwort bStatus Code, Komprimierung, Redirect Ziel, Dokumentinhalt,

Cache-Settings

Ein Request: „Gib mir Dokument X“Basics

Responsive Design

Desktop

Basics

Tablet

Basics

Responsive Design

Smartphone

Basics

Responsive Design

Responsive Design

Media Queries Automatische Anpassung! Gleicher HTML Code

Basics

(Web-) CrawlerBasics

Bild-Quelle: MetroPublisher

Reverse Index

Basics

Bild-Quelle: Apple

PageRankBasics

Bild-Quelle: Wikipedia

SEOBasics

Suchmaschinenoptimierung !

„Wie werde ich bei Google angezeigt?“

OnPage OptimierungBasics

Alles was auf der eigenen Seite passiert

OffPage OptimierungBasics

Alles was abseits der eigenen Seite passiert

Google Updates

„Ultimately, the process resulted in 516 changes that were determined to be useful to users based on the data

and, therefore, were made to Google‟s algorithm.“Eric Schmidt, 2010

Ehemaliger CEO von Google

!

Quelle: selnd.com/1avLbJ6Bild-Quelle: BusinessInsider.com

Google Updates

Ausführliche Liste der Google Updates: http://moz.com/google-algorithm-change

2011 2012 2013

Panda Update Penguin Update Hummingbird

Search Quality UpdatesGoogle Updates

Panda Update (2011)

Primäres Ziel Bessere Ergebnisse für Google KundenWas ist „Content-Spam“?

• „Thin Content“ Seiten

• Viele Anzeigen „above the fold“

• Schlechte User Intent Daten (z.B. „Bouncerate“)

• Keyword Spamming

• Viele Unterseiten & wenige eingehende Links

Wie? Content-Spam bekämpfen

Google Updates

Penguin Update (2012)

Primäres Ziel Bessere Ergebnisse für Google KundenWie bestimmt man „gekaufte Links“?

• Brandname kommt nicht in Anchors vor

• Anchor Text bestehen vorwiegendaus Money Keywords

• Vermehrte Links von offtopic Seiten

• Links aus Content Farms / Link Networks

• Überdurchschnittlicher Anteil von Links aus ArtikelverzichnissenPresseportalen, etc.

Wie? Gekaufte Links bestrafen

Google Updates

Hummingbird Update (2013)

Primäres Ziel Bessere Ergebnisse für Google KundenWie kann eine Maschine „verstehen“?

• Linguistic Data Mining

• Bessere Synonym-Erkennung

• „Conversational Queries“

• „Knowledge Graph“

!

Wie? Semantische Analysen

Google Updates

Status Quo

„Welcome to the Internet of strings Things“

Matt Cutts, 2013

Leiter von Googles Webspam Team

!

Quelle: PubCon Keynote 2013 Bild-Quelle: Google Inc.

Google Updates

Internet of ThingsTerm Vector Modell v(„Capital“) + v(„Germany“) = v(„Berlin“) !

v(„Berlin“) - v(„Germany“)+ v(„France“) = v(„Paris“)

Bild-Quelle: Wikipedia

Google Updates

Internet of ThingsConversational Queries

Anfrage 1: „Was ist die Hauptstadt von Deutschland?“

Ergebnis 1 (Knowledge Graph): Berlin

Anfrage 2: „und von Frankreich?“

Ergebis 2 (Knowledge Graph): Paris

Google Updates

Butter bei die Fische

1. Fokussierung auf hochqualitativen InhaltQualität statt Quantität, Ausarbeitung von Content Strategie hilft

2. „Crawlability“ sicherstellen + monitoren

3. Technisches Qualitäts-Management

4. Klassisches PR mit Fokus auf Kontaktaufbau statt auf Linkaufbau

5. Nicht versuchen Google etwas vorzumachen

Google Updates

Butter bei die Fische

Beim SEO geht es nicht darum zu betrügen - es ist ein Handwerk.

Google Updates

Beispiel: High Quality Websites

Muss Traffic via SEA dazukaufen Bekommt kostenlosen Traffic via SEO (Nebeneffekt: Vorteile in SEA,

weil QualityScore gefördert wird)

• Relevante und gutgeschriebene Texte

• Intuitives Benutzer-Interface das auf allen Geräten funktioniert („Responsive Design“)

• Multi-Media: Ansprechender Mix von Text, Bildern und Videos

• Performance optimiert (Schnelles Laden und Rendern)

• „Walking the extra Mile“ (Feature-Set)

• PS: Kein Flash :) Solange man in den mobile Google Search Results ranken will

Worauf man achten sollteBeispiel: High Quality Websites

Resultat

• Bessere User Intent Daten (Bounce-Rate etc.)

• Förderung der Social Signals

Lieber möglichst wenig Unterseiten, dafür mit informativeren und schöneren Inhalten

als die Konkurrenten

Beispiel: High Quality Websites

Seitenarchitektur / Crawlability

„Speaking URLs“

http://www.quelle.de/is-bin/INTERSHOP.enfinity/WFS/QuelleDe-Shop-Site/de_DE/-/EUR/ViewProductDetail-Start;sid=zQY_W-2Chg8.... $

%http://www.quelle.de/electronics/samsung/galaxy-note-10.html

Seitenarchitektur / Crawlability

„Hackable URLs“

%

http://www.quelle.de/electronics/samsung/galaxy-note-10.html

http://www.quelle.de/electronics/samsung/

-> Übersicht der Elektronik Produktedes Herstellers Samsung

%

http://www.quelle.de/electronics/

-> Übersicht aller Produkte der Kategorie „Elektronik“

Seitenarchitektur / Crawlability

Horizontale Navigationhttp://www.quelle.de/electronics/ samsung/galaxy-note-10.html

links

links

http://www.quelle.de/electronics/ samsung/galaxy-note-9.html http://www.quelle.de/electronics/

samsung/galaxy-tab-3.html

Seitenarchitektur / Crawlability

Kurze Klickpfade

Inhalte sollte maximal 4 Klicks von der Startseite entfernt sein.

Seitenarchitektur / Crawlability

Crawlability

Websites needs to be architectured Hyperlinks help search engines to understand what

pages are importantQuelle: spottedpanda.com

Crawler optimierte VerzeichnisseSeitenarchitektur / Crawlability

Crawler optimierte VerzeichnisseSeitenarchitektur / Crawlability

ZusammenfassungBei vielen Unterseiten (1.000+):

Crawl Budget schonen

• Unnötige (oder „thin“) Unterseiten mit robots.txt blockieren

• Die sitemap.xml erstellen und sauber halten

• Zusätzliche vertikale Navigationen / Links erstellen

• URLs sollten konstant bleiben nicht alle paar Tage ändern

Seitenarchitektur / Crawlability

Website Quality Management

Status Codes

• Keine „toten“ (404, etc.) oder defekte (500) Seiten

• Unnötige Redirects vermeiden / eliminieren

• Verstehen wann 302 besser ist als 301

Website Quality Management

Meta Tags

• Klarer inhaltlicher Fokus auf jeder Seite

• Texteinzigartigkeit im Auge behalten („Duplicate Content“)

Website Quality Management

Canonical Tag

• http://www.quelle.de/

• http://www.quelle.de

• http://www.quelle.de/index.html

• http://quelle.de/

• http://www.quelle.de/?utm_campaign=adwords

• http://www.quelle.de/Index.html

Theoretisch erreichbar unter:

Der Canonical Tag hilft (alternativ per robots.txt komplett sperren)

Website Quality Management

Inhaltliche Relevanz

• Fragen der Zielgruppe abdecken (Google Trends, Suggest, „Did you mean“)

• Aber vorsichtig: Dabei nicht spammy werden (aus Versehen)

Website Quality Management

Alte MethodenWebsite Quality Management

“Neue“ MethodenWebsite Quality Management

Beispiel zur Revelanzberechnung

Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah

Blah Blah Blah Blah BLUB Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah

„BLUB“ hat eine KW-Density von 2%

Website Quality Management

BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB Blah BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB

Beispiel zur Revelanzberechnung

„BLUB“ hat eine KW-Density von 98% Dieser Text wäre 49 mal relevanter als der erste Text

Website Quality Management

Beispiel zur RevelanzberechnungWebsite Quality Management

„BLUB“ hat einen WDF-Wert von 0,18 log_2(1+1)/log_2(50)

„BLUB“ hat einen WDF-Wert von 1Dieser Text wäre 5,5 mal relevanter als der erste Text

Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah

Blah Blah Blah Blah BLUB Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah

BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB Blah BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB BLUB

Performance Optimierung

Zum Beispiel: Image Sprites

1 Request statt 83 (!) !

=> Page lädt 1 Sekunde schneller (0,1 Sek * 83 Req. / 8 parallele Downloads)

!

=> Seiteneffekt: Conversionrate steigt !

Website Quality Management

Performance OptimierungWebsite Quality Management

Zweites Beispiel: Caching !

Besonders für statische Assets ( Javascript, CSS und Bilder) ist Browser Caching ein Muss. !

Dabei wird im Response Header mitgeteilt wie lange der Browser die Daten lokal speichern und verwenden soll - dadurch müssen sie nicht bei jedem Request neu geladen werden.

37 Elemente (Bilder, CSS, JS, etc.) -> Insgesamt 380 kb. !Bei 2000 Visitors & 5 Seitenaufrufen pro Visitor. !Einsparpotential: = 380kb * (5-1) * 2000 !=> 2,9 GB am Tag => 87 GB pro Monat

<ifModule mod_expires.c> ExpiresActive On ExpiresByType image/gif "access plus 1 month 1 hour" ExpiresByType image/jpg "access plus 1 month 1 hour“ </ifModule>

Performance OptimierungWebsite Quality Management

Drittes Beispiel: Komprimierung

Einsparpotential: = 559kb * 5 * 2000 !=> 5,3 GB am Tag => 159 GB pro Monat

<ifModule mod_gzip.c> mod_gzip_on Yes mod_gzip_dechunk Yes mod_gzip_item_include file \.(html?|txt|css|js|php|pl)$ </ifModule>

567 kb ohne gzip (Nur HTML Code!)

8 kb mit gzip (98% Ersparnis!)

Das „nofollow“ Attribut ist nicht für den internen Gebrauch geeignet.

!

!

Wenn man Seiten blockieren will, robots.txt benutzen

(-> Crawl Budget effektiv nutzen)

„nofollow“ LinksWebsite Quality Management

Workflow Beispiel

Workflow Beispiel

Workflow Beispiel

Workflow Beispiel

Workflow Beispiel

Workflow Beispiel

/blog/tipps-fur-den-lebenslauf/ /blog/page/6/

Duplicate Content!Workflow Beispiel

/blog/tipps-fur-den-lebenslauf/

Duplicate Content!

%

/blog/page/6/

• Speaking URL

• Hackable URL

$• Canonical

• Redirect

• Block per robots.txt

• Alle Links eingehenden entfernen(= Seite entfernen)

Workflow Beispiel

Diese Seite behalten, weil:

Diese Seite entfernen, z.B. durch:

Danke!Jan Hendrik Merlin Jacob

! @jhmjacob" fb.me/jhmjacob# hjacob.com

!

OnPage.org GmbH

! @onpage_org " fb.me/onpage.org # de.onpage.org

PS: We are hiring :)