Embed Size (px)
DESCRIPTION
Slides zur Session "Search Engine Friendly Design für Content Provider" auf der SMX München 2014 von Daniel Herndler. Inhalte: - HTML & Aufbau von SEFD - Struktur & Content - Les- & Crawlbarkeit - Schema.org & Rich Snippets - Zusammenfassung
Citation preview
Search Engine Friendly Design
Für Content-Provider
Daniel Herndler
Daniel Herndler
google.com/+DanielHerndler
SEFD
• aus Salzburg, Österreich
• seit 2010 im Bereich SEM
• seit 2011 SEO bei ncm
• mit Schwerpunkt Tourismus
Daniel Herndler
+DanielHerndler
@DanielHerndler
Übersicht
google.com/+DanielHerndler
SEFD
• HTML & Aufbau
• Website-Struktur
• Lesbarkeit
• Schema.org
• Zusammenfassung
SEFD
HTML & Aufbau
google.com/+DanielHerndler
Search Engine Friendly Design
SEFD
HTML-Code
google.com/+DanielHerndler
<head>
<body>
Metadaten
Inhalte & Funktionen
HTML & Aufbau
HTML & Aufbau
google.com/+DanielHerndler
SEFD
<head>
</head>
Titel Beschreibung Stylesheet Sprache Robots …
<head>
HTML & AufbauSEFD
<body>
</body>
Header Navigation Inhaltselemente Sidebar Footer …
google.com/+DanielHerndler
<body>
HTML & AufbauSEFD
google.com/+DanielHerndler
Wikipedia.org
Main Content
Footer 1
Header
Sidebar
Footer 2
Main Content
Side-bar
Footer 1
Footer 2
Header
HTML & AufbauSEFD
CSS auslagern
google.com/+DanielHerndler
<head>
<link rel="stylesheet" type="text/css" href="/styles.css">
</head>
HTML & AufbauSEFD
JavaScript auslagern
google.com/+DanielHerndler
<head>
<script type="text/javascript" src="/beispiel.js"></script>
</head>
Search Engine Friendly DesignSEFD
Struktur
google.com/+DanielHerndler
StrukturSEFD
google.com/+DanielHerndler
Startseite
Thema 1 Thema 2 Thema 3
1
2
3
1
2
3
1
2
3
StrukturSEFD
google.com/+DanielHerndler
http://www.city-guide-salzburg.com/altstadt/salzburger-festspiele/
Thema 1
1
Startseite
StrukturSEFD
google.com/+DanielHerndler
google.com
Navigationselemente
SEFD
google.com/+DanielHerndler
Struktur
Immer in den HTML-Code!
Navigationselemente
SEFD
google.com/+DanielHerndler
Struktur
<h1>
Intro
ContentStrukturiert durch <h2>, <h3>, …
• Einzigartig• Enthält Keywords• Blickfang
• Zusammenfassend• Zum Lesen anregen• Kernaussage des Inhalts
• Inhalt / Inhaltselemente• Strukturiert durch
Überschriften• Auf das Thema optimiert
Content-Struktur
SEFD
google.com/+DanielHerndler
Struktur
Content-Struktur
<h1>
Intro
Verzeichnis
SEFD
google.com/+DanielHerndler
Struktur
Content-StrukturContent
StrukturSEFD
google.com/+DanielHerndler
Für alle Endgeräte optimieren!
StrukturSEFD
google.com/+DanielHerndler
StrukturSEFD
Breadcrumb-Navigation
google.com/+DanielHerndler
StrukturSEFD
Breadcrumb-Navigation
google.com/+DanielHerndler
StrukturSEFD
HTML-Sitemap
google.com/+DanielHerndler
StrukturSEFD
HTML-Sitemap
google.com/+DanielHerndler
StrukturSEFD
google.com/+DanielHerndler
Suchmaschinen lieben …
Saubere URL-Struktur Einfache Navigation Klare Content-Strukturen Übersichtliche Sitemaps
SEFD
Lesbarkeit
google.com/+DanielHerndler
Search Engine Friendly Design
SEFD
google.com/+DanielHerndler
!!!
Lesbarkeit
SEFD
google.com/+DanielHerndler
Lesbarkeit
Flash-Websites
SEFD
google.com/+DanielHerndler
92% = Flash
Lesbarkeit
SEFD
google.com/+DanielHerndler
Lesbarkeit
Flash-Websites
Text-Version
SEFD
google.com/+DanielHerndler
Lesbarkeit
Flash-Websites
Text-Version
SEFD
Die Lesbarkeit wird beeinflusst durch:
google.com/+DanielHerndler
Lesbarkeit
• Robots.txt• " noindex "• " nofollow "• Redirects• Canonical-Tag
SEFD
Schema.org
google.com/+DanielHerndler
Search Engine Friendly Design
SEFD
google.com/+DanielHerndler
Schema.org
<p>00436643890776</p>
Was ist gemeint?
SEFD
google.com/+DanielHerndler
Schema.org
<p itemprop="telephone">00436643890776</p>
Eindeutig!
SEFD
google.com/+DanielHerndler
Schema.org
Vorteile von Schema.org
Inhalte verstehen Hinweise auf wichtige Informationen Rich Snippets
SEFD
Original HTML
google.com/+DanielHerndler
Schema.org
SEFD
Mit Schema.org
google.com/+DanielHerndler
Schema.org
SEFD
Schema.org Beispiele
google.com/+DanielHerndler
Schema.org
SEFD
Schema.org Testing
google.com/+DanielHerndler
Testing Tool: http://goo.gl/yoPlrU
Schema.org
SEFD
Zusammengefasst:
google.com/+DanielHerndler
1. Sauberer HTML-Code & Aufbau
2. Crawlbare, einfache & verständliche Struktur
3. Les- & indexierbare Webseiten und Inhalte erstellen
4. Schema.org verwenden
Überblick
www.danielherndler.com
Search Engine Friendly DesignSEFD
+DanielHerndler
@DanielHerndler
