SlideShare une entreprise Scribd logo
1  sur  21
Rich Snippets & Co:
             HTML5 aus SEO-Sicht

SEO CAMPIXX 2012, 11. März 2012, Helge Cramer, Cramer & Consorten GmbH


                                                                         1
Ein paar Worte zu mir

Helge Cramer

-Studium Physik und Journalistik (Berufswunsch war Wissenschaftsjournalist)
-Seit 1996 geschäftlich im Internet unterwegs
-2000 Agenturgründung (Cramer & Consorten GmbH)
       - aktuell 16 Mitarbeiter, davon 6 in der Entwicklung tätig
       - Kunden: von ganz klein bis zu ganz groß ;-)



-eine Frau , ein Kind , kein Hund 
HTML4 zu HTML5

Wichtigste Änderungen in HTML5:

-Neue, beschreibende/semantische Tags (<nav>, <article>, <aside>, <footer>
-Neue Elemente zur Einbindung von Mediendaten ohne Plugins (<canvas>, <video>)
-Geo-Lokalisierung
-...
Einführung Rich Snippets bei Google

Google mochte strukturierte Daten schon immer

-Mai 2007: Einführung Universal Search
-Mai 2009: Einführung Rich Snippets (Bewertungen und Personen)
-Juni 2011: Einführung schema.org (mit Bing und Yahoo), Entfall der Anmeldung
Prinzipieller Aufbau (Microdata)

Neue globale Attribute (HTML5)

-itemscope              Kategorie der Informationen („Klammer“)
-Itemtype               Typ/Schema der Information (Beschreibung, Bild, Bewertung, Event etc)
-itemprop               (Priorisiertes) Informationsattribut
-itemid                 eindeutiger Bezeichner
-itemref                Information außerhalb der definierten Kategorie/des gewählten Scopes
Prinzipieller Aufbau (Microdata)

Wo ziehen Google & Co die Inhalte?

Netterweise gilt eine einfache Faustregel:
(In der Regel) ziehen die Suchmaschinen je nach (HTML5-) Tag die Infos immer von dort, wo man es erwarten darf:

-area, link u.ä:                        href-Attribut aus dem selben Tag
-meta                                   content-Attribut aus dem selben Tag
-audio, embed, img, track, video u.ä.   src-Attribut aus dem selben Tag
-time                                   datetime-Attribut aus dem selben Tag
-object                                 data-Attribut

Bei allen anderen HTML-Tags (span, p, div etc) wird der Content verwendet, der von dem Tag eingeschlossen ist.
Prinzipieller Aufbau (Microdata)

Die Mutter aller Dinge

<div itemscope itemtype=“http://schema.org/Thing“>
  <div itemprop=“name“>Name</div>
  <div itemprop=“url“>Deeplink</div>
  <div itemprop=“description“>Kurzbeschreibung</div>
  <div itemprop=“image“>Bild-URL</div>
</div>

Alle Kategorien leiten sich vom „Thing“-Objekt ab

- vollständiges Schema unter http://schema.org
Snippets – Event-Snippets

Was wird angezeigt?
                                                      Was kann das Objekt noch?
-Events (Einzelevent oder Eventliste)
                                                      -startDate (ISO 8601, 2012-03-05T13:42Z)
                                                      -endDate (ISO 8601)
                                                      -Duration (ISO 8601, , z.B. PT30M für 30 Minuten)
                                                      -Location (mit Unterobjekt Place oder PostalAdress)
                                                      -Offers (mit Unterobjekt offer)
                                                      -Performers (Person oder Organization)
                                                      -subEvents (wieder vom Typ Event)
Wie wird es implementiert?                            -superEvent (wieder vom Typ Event)

Eltern-Objekt Thing:
                                                      Spezifischere Unter-Objekte
<div itemscope itemtype=http://schema.org/Event>      -BusinessEvent
  <div itemprop=“name“>Name des Events</div>          -ChildrensEvent
  <div itemprop=“url“>Deeplink</div>                  -ComedyEvent
  <div itemprop=“description>Kurzbeschreibung</div>   -MusicEvent
  <div itemprop=“image“>Bild-URL</div>                -... (http://schema.org)
</div>
Snippets – aggregierte Bewertung

Was wird angezeigt?
                                                                           Darstellung auf der Website (sichtbarer Bereich!)
- Bewertungen (aggregiert)




Wie wird es implementiert?

<div itemscope itemtype="http://data-vocabulary.org/Review-aggregate">
 <span itemprop="v:itemreviewed"></span>
 <span itemprop="rating" itemscope itemtype="http://data-vocabulary.org/
Rating" class="text">
  <img src="http://1.2.3.13/bmi/www.ils.de/images/ILS2/sterne.png">
                &nbsp;Aktuell: Note 1,5 (
 <span itemprop="average">4.5</span> von
 <span itemprop="best">5</span>Sterne bei
 <span itemprop="votes">1096</span> Befragungen)</span>
</div>
Snippets – Erfahrungsbericht Detailansicht

Was wird angezeigt?
                                                                            Darstellung auf der Website (sichtbarer Bereich!)
-Ein konkreter Erfahrungsbericht




Wie wird es implementiert?

<div itemscope itemtype="http://data-vocabulary.org/Review">
 <span itemprop="itemreviewed">Geprüfte/r Fachpraktiker/in für Massage,
Wellness und Prävention</span>
 <time itemprop="dtreviewed" datetime="2012-01-25">25.01.12</time>
 <span itemprop="reviewer">Kristina S., Hannover</span>
 <span class="note_1">1</span> (
 <span itemprop="rating">5</span> von
 <span itemprop="best">5</span> Sternen)
 <span itemprop="summary">In die Selbstständigkeit starten<br/>....in die
Selbstständigkeit starten.</span>
</div>
Snippets – Produkte

Was wird angezeigt?
                                                         Wie wird es implementiert?
-Ein konkretes Produkt  sehr schöne Kombinationen mit
Bewertungen möglich:                                     Eltern-Objekt Thing:

                                                         <div itemscope itemtype=http://schema.org/Product>
                                                           <div itemprop=“name“>Name des Events</div>
                                                           <div itemprop=“url“>Deeplink</div>
                                                           <div itemprop=“description>Kurzbeschreibung</div>
                                                           <div itemprop=“image“>Bild-URL</div>
                                                         </div>

                                                         Was kann das Objekt noch?

                                                         -aggregateRating (vom Typ AggregateRating)
                                                         -brand (vom Typ Organization)
                                                         -manufacturer (vom Typ Organization)
                                                         -model (Text)
                                                         -offers (vom Typ Offer)
                                                         -productID (vom Typ Text, z.B. EAN/ISBN)
                                                         -reviews (vom Typ Review)
Snippets – Event-Snippets

Was wird angezeigt?
                                                      Was kann das Objekt noch?
-Events (Einzelevent oder Eventliste)
                                                      -startDate (ISO 8601, 2012-03-05T13:42Z)
                                                      -endDate (ISO 8601)
                                                      -Duration (ISO 8601, , z.B. PT30M für 30 Minuten)
                                                      -Location (mit Unterobjekt Place oder PostalAdress)
                                                      -Offers (mit Unterobjekt offer)
                                                      -Performers (Person oder Organization)
                                                      -subEvents (wieder vom Typ Event)
Wie wird es implementiert?                            -superEvent (wieder vom Typ Event)

Eltern-Objekt Thing:
                                                      Spezifischere Unter-Objekte
<div itemscope itemtype=http://schema.org/Event>      -BusinessEvent
  <div itemprop=“name“>Name des Events</div>          -ChildrensEvent
  <div itemprop=“url“>Deeplink</div>                  -ComedyEvent
  <div itemprop=“description>Kurzbeschreibung</div>   -MusicEvent
  <div itemprop=“image“>Bild-URL</div>                -... (http://schema.org)
</div>
Bevorzugt Google korrekt ausgezeichnete Seiten?

Der Mensch ist willig, doch die Maschine ist schwach

Man darf gesichert davon ausgehen, dass Google den Content möglichst komplett auslesen will und deswegen häufige Fehler
zu erkennen (und korrigieren) versucht. Ebenso wird sicher daran gearbeitet, semantische Informationen zu erkennen, auch
wenn der Content nicht semantisch ausgezeichnet wird.

-nicht geschlossene Tags
-Inkorrekte doctype-Deklarationen
-In Tabellen gegossene nicht-tabellarische Informationen
-Aufzählungen (z.B. Menus) ohne Listenauszeichnung
-...

Da die Anzahl möglicher Fehler und „Fehlerchen“ aber sogar die geballte Vorstellungskraft aller Google-Entwickler übersteigt
und Google auf der anderen Seite absolut datenhungrig ist, darf man ebenso gesichert davon ausgehen, dass

-der Google Crawler sich auch mal verschluckt und eine Seite somit nicht korrekt bzw. gar nicht indexiert
-(korrekt) implementierte Strukturelemente und Mikrodaten vom Bot gierigst aufgenommen werden
Bevorzugt Google korrekt ausgezeichnete Seiten?

Manipulation!?

Sehr häufig hört man den Einwand - besonders bei Bewertungen, die ja als Sternchen in den SERPs auftauchen – dass dem
Missbrauch Tür und Tor geöffnet ist, da man diese einfach so reinschreiben kann. Dazu lässt sich sagen:

-Es stimmt!
-Aber:
      - Die Mikrodaten müssen sich im sichtbaren Bereich der Seite befinden. Versteckte Informationen (z.B. durch
        display:none;) bekommen auch keinen RichSnippet
      - Google gibt damit nur wieder, was der Seiteninhaber selbst über seine Seite schreibt- also nichts anderes als das, was
        Google auch mit der Wiedergabe der description oder des titles tut...

Damit zieht Google sich bequem auf seine Rolle als Suchmaschine zurück: Schließlich kontrolliert man ja auch textlichen Inhalt
nicht auf den Wahrheitsgehalt, sondern straft nur ab, wenn die Maschine etwas anderes sieht als der User.

Persönliche Meinung:
Konsequent wäre es, wenn Google hinter dieser „Verteidigungslinie“ bleibt und sich nicht zum „Zensor“ aufschwingt, indem z.B.
nur noch Bewertungen zugelassen werden, die „gesichert“ sind durch Ciao, ekomi und Co. Sollten die SERPs irgendwann zu
„sternig“ werden, wäre ein Abschalten oder ein Zuspielen aus Google-eigenen Quellen die glaubwürdigste Alternative.
Bringen RichSnippets höhere Klickraten?

(Nicht-repräsentative) Messung

-Vergleichszeitraum Monat (mit Sternchen) mit Vormonat (ohne Sternchen)
-Beschränkt auf ausgewählte Keywords:
      - Keine Änderung im Ranking im Vergleich zum Vormonat
      - Keine wesentliche Schwankung im Suchvolumen lt. Google
-Ergebnis: Der auch im Schnitt sehr deutliche Zuwachs an Traffic muss (zumindest im Wesentlichen) von einer verbesserten
CTR und damit durch den Einsatz von RichSnippets kommen (im Schnitt etwa +20-25%)
Bringen RichSnippets höhere Klickraten?

Achtung, Gegenverkehr!

-Da RichSnippets für den User idR eine „positive Nutzererfahrung“ bieten, wird Google dies sicher weiter ausbauen
-Aus SEO- und Webmaster-Sicht sollte man sich also unbedingt – wenn nicht schon geschehen – da einarbeiten
-Sinnvoll im Sinne einer höheren CTR bei
      - Bewertungen (Per aspera ad astra)
      - Produkten
-Da Informationen, für die man sonst bei Google in den SERPs klicken musste, jetzt schon dort ohne weiteren Klick für den
User zu haben sind, kann es allerdings auch mal zu einer niedrigeren CTR und damit zu Trafficverlusten kommen,
insbesondere bei
      - Firmeninformationen
      - Rezepten
      - Events (Termin passt nicht)
      - Preisinformationen (andere Snippets mit niedrigeren Preisen)
      - ...
Fazit

Was nun, Herr SEO?

-Insgesamt syntaktisch korrektes und semantisch sinnvolles XHTML, HTML4, HTML5, HTMLwhatever tut nicht weh, dient der
Quellcode-Hygiene und verhindert, dass sich Crawler an hervorhängenden Nägeln weh tun.
-Aufmerksam verfolgen wohin die Reise geht
-Semantische Auszeichnung lt. schema.org oder data-vocabulary.org bei Bewertungen und Produkten können eigentlich
uneingeschränkt empfohlen werden- wenig Aufwand und teilweise starker Einfluss auf den Traffic, insbesondere bei den
Keywords, wo in den SERPs noch wenig oder keine Sterne auftauchen (ja, die gibt es...)
-Vorsichtig bei allen Informationen in den SERPs, aus denen der User alles das sieht, wozu er sonst die Seite aufgesucht hätte.
Links

Ressourcen zum Thema

- RichSnippet-Generatoren:
     - http://www.ebusiness-unibw.org/tools/grsnippetgen/
     - http://www.microdatagenerator.com/

-   Google Testing Tool http://www.google.com/webmasters/tools/richsnippets
-   Getting started: http://schema.org/docs/gs.html
-   schema.org FAQ: http://support.google.com/webmasters/bin/answer.py?hl=en&answer=1211158
-   Guter Einstieg bei t3n: http://t3n.de/news/html5-seo-rich-snippets-suchergebnisse-revolutionieren-323101/
Vielen Dank!


               19
Noch Fragen?



Helge Cramer

Cramer & Consorten GmbH
Papenreye 27
22453 Hamburg
Tel.: 040 411 6149-11
Fax: 040 411 6149-10
E-Mail: h.cramer@cramer-cons.de
Internet: www.cramer-cons.de
Rich snippets und Co

Contenu connexe

En vedette

Ads und Content auf Facebook
Ads und Content auf FacebookAds und Content auf Facebook
Ads und Content auf FacebooksocialBench
 
Export und Darstellung der Webanalyse Daten
Export und Darstellung der Webanalyse DatenExport und Darstellung der Webanalyse Daten
Export und Darstellung der Webanalyse DatenAT Internet
 
Feldinhalte berechnen access2007
Feldinhalte berechnen access2007Feldinhalte berechnen access2007
Feldinhalte berechnen access2007schulpraxis
 
PHOTOGRAPHIE Dieter Gotzen
PHOTOGRAPHIE Dieter GotzenPHOTOGRAPHIE Dieter Gotzen
PHOTOGRAPHIE Dieter GotzenDieter Gotzen
 
Multichannel analyse - AT Internet Marketing on Tour 2011
Multichannel analyse - AT Internet Marketing on Tour 2011Multichannel analyse - AT Internet Marketing on Tour 2011
Multichannel analyse - AT Internet Marketing on Tour 2011AT Internet
 
BewerbungStipendium
BewerbungStipendiumBewerbungStipendium
BewerbungStipendiumFunshy
 
Henrich, dieter hegel im kontext 1971
Henrich, dieter   hegel im kontext 1971Henrich, dieter   hegel im kontext 1971
Henrich, dieter hegel im kontext 1971Ryan Krahn
 
Designer Heizkörper
Designer HeizkörperDesigner Heizkörper
Designer HeizkörperHudson Reed
 
05_cadesignform_JoWitulski
05_cadesignform_JoWitulski05_cadesignform_JoWitulski
05_cadesignform_JoWitulskiClarionGermany
 
Los animales
Los animalesLos animales
Los animalesNOAMDIAZH
 
Nivelacion topografica
Nivelacion topograficaNivelacion topografica
Nivelacion topograficaalex4ander
 
Tabellen in ACCESS
Tabellen in ACCESSTabellen in ACCESS
Tabellen in ACCESSschulpraxis
 
Seguimiento del Capitulo 2
Seguimiento del Capitulo 2Seguimiento del Capitulo 2
Seguimiento del Capitulo 2Tatiana15Sanchez
 
Ley penal contra los delitos informaticos
Ley penal contra los delitos informaticosLey penal contra los delitos informaticos
Ley penal contra los delitos informaticoskimberly213
 

En vedette (20)

Weihnachstgruesse!
Weihnachstgruesse!Weihnachstgruesse!
Weihnachstgruesse!
 
B2B für Ärzte
B2B für ÄrzteB2B für Ärzte
B2B für Ärzte
 
Ads und Content auf Facebook
Ads und Content auf FacebookAds und Content auf Facebook
Ads und Content auf Facebook
 
Export und Darstellung der Webanalyse Daten
Export und Darstellung der Webanalyse DatenExport und Darstellung der Webanalyse Daten
Export und Darstellung der Webanalyse Daten
 
Feldinhalte berechnen access2007
Feldinhalte berechnen access2007Feldinhalte berechnen access2007
Feldinhalte berechnen access2007
 
PHOTOGRAPHIE Dieter Gotzen
PHOTOGRAPHIE Dieter GotzenPHOTOGRAPHIE Dieter Gotzen
PHOTOGRAPHIE Dieter Gotzen
 
Multichannel analyse - AT Internet Marketing on Tour 2011
Multichannel analyse - AT Internet Marketing on Tour 2011Multichannel analyse - AT Internet Marketing on Tour 2011
Multichannel analyse - AT Internet Marketing on Tour 2011
 
BewerbungStipendium
BewerbungStipendiumBewerbungStipendium
BewerbungStipendium
 
Philosophie 1ter teil
Philosophie 1ter teilPhilosophie 1ter teil
Philosophie 1ter teil
 
Henrich, dieter hegel im kontext 1971
Henrich, dieter   hegel im kontext 1971Henrich, dieter   hegel im kontext 1971
Henrich, dieter hegel im kontext 1971
 
Designer Heizkörper
Designer HeizkörperDesigner Heizkörper
Designer Heizkörper
 
Philosophie 3ter teil
Philosophie 3ter teilPhilosophie 3ter teil
Philosophie 3ter teil
 
05_cadesignform_JoWitulski
05_cadesignform_JoWitulski05_cadesignform_JoWitulski
05_cadesignform_JoWitulski
 
Los animales
Los animalesLos animales
Los animales
 
Bstographia
BstographiaBstographia
Bstographia
 
Rundbrief 12
Rundbrief 12Rundbrief 12
Rundbrief 12
 
Nivelacion topografica
Nivelacion topograficaNivelacion topografica
Nivelacion topografica
 
Tabellen in ACCESS
Tabellen in ACCESSTabellen in ACCESS
Tabellen in ACCESS
 
Seguimiento del Capitulo 2
Seguimiento del Capitulo 2Seguimiento del Capitulo 2
Seguimiento del Capitulo 2
 
Ley penal contra los delitos informaticos
Ley penal contra los delitos informaticosLey penal contra los delitos informaticos
Ley penal contra los delitos informaticos
 

Similaire à Rich snippets und Co

Dojo Und Notes
Dojo Und NotesDojo Und Notes
Dojo Und Notesdominion
 
SEO-Campixx 2022 | Suchoperatoren auf Steroiden
SEO-Campixx 2022 | Suchoperatoren auf SteroidenSEO-Campixx 2022 | Suchoperatoren auf Steroiden
SEO-Campixx 2022 | Suchoperatoren auf SteroidenPaul Schreiner
 
Schema.org 101: 
Warum die neuen Meta Daten wichtig sind - Mini FAQ & Impleme...
Schema.org 101: 
Warum die neuen Meta Daten wichtig sind - Mini FAQ & Impleme...Schema.org 101: 
Warum die neuen Meta Daten wichtig sind - Mini FAQ & Impleme...
Schema.org 101: 
Warum die neuen Meta Daten wichtig sind - Mini FAQ & Impleme...Timon Hartung
 
Slides__Splunk_UserGroup_20220407.pdf
Slides__Splunk_UserGroup_20220407.pdfSlides__Splunk_UserGroup_20220407.pdf
Slides__Splunk_UserGroup_20220407.pdfAlexanderStz1
 
Große Applikationen mit AngularJS
Große Applikationen mit AngularJSGroße Applikationen mit AngularJS
Große Applikationen mit AngularJSSebastian Springer
 
Continuous Delivery aus Sicht des Testers
Continuous Delivery aus Sicht des TestersContinuous Delivery aus Sicht des Testers
Continuous Delivery aus Sicht des TestersQAware GmbH
 
Google Analytics Konferenz 2019_App Tracking_Runa Reno (Booking.com) & Markus...
Google Analytics Konferenz 2019_App Tracking_Runa Reno (Booking.com) & Markus...Google Analytics Konferenz 2019_App Tracking_Runa Reno (Booking.com) & Markus...
Google Analytics Konferenz 2019_App Tracking_Runa Reno (Booking.com) & Markus...e-dialog GmbH
 
Python builds mit ant
Python builds mit antPython builds mit ant
Python builds mit antroskakori
 
Lightweight AOP with CDI and JPA
Lightweight AOP with CDI and JPALightweight AOP with CDI and JPA
Lightweight AOP with CDI and JPAmh0708
 
System-Management-Trio: Zentrale Verwaltung mit facter, puppet und augeas
System-Management-Trio: Zentrale Verwaltung mit facter, puppet und augeasSystem-Management-Trio: Zentrale Verwaltung mit facter, puppet und augeas
System-Management-Trio: Zentrale Verwaltung mit facter, puppet und augeasSpeedPartner GmbH
 
Schnelle Winkel: 10x schnellere Webapps mit AngularJS und JEE
Schnelle Winkel: 10x schnellere Webapps mit AngularJS und JEESchnelle Winkel: 10x schnellere Webapps mit AngularJS und JEE
Schnelle Winkel: 10x schnellere Webapps mit AngularJS und JEEBenjamin Schmid
 
Content Design und UI Architektur für Multiscreen-Projekte (Usability Profess...
Content Design und UI Architektur für Multiscreen-Projekte (Usability Profess...Content Design und UI Architektur für Multiscreen-Projekte (Usability Profess...
Content Design und UI Architektur für Multiscreen-Projekte (Usability Profess...Wolfram Nagel
 
MongoDB Munich 2012: Spring Data MongoDB
MongoDB Munich 2012: Spring Data MongoDBMongoDB Munich 2012: Spring Data MongoDB
MongoDB Munich 2012: Spring Data MongoDBTobias Trelle
 
CAMPIXX 2015: Traffic Änderung durch den Knowledge Graph
CAMPIXX 2015: Traffic Änderung durch den Knowledge GraphCAMPIXX 2015: Traffic Änderung durch den Knowledge Graph
CAMPIXX 2015: Traffic Änderung durch den Knowledge GraphMoritz Aubke
 
iDocIt - Ein Assistent zur API-Dokumentation
iDocIt - Ein Assistent zur API-DokumentationiDocIt - Ein Assistent zur API-Dokumentation
iDocIt - Ein Assistent zur API-DokumentationJan Christian Krause
 
System-Management-Trio: Zentrale Verwaltung mit facter, puppet und augeas
System-Management-Trio: Zentrale Verwaltung mit facter, puppet und augeasSystem-Management-Trio: Zentrale Verwaltung mit facter, puppet und augeas
System-Management-Trio: Zentrale Verwaltung mit facter, puppet und augeasSpeedPartner GmbH
 
Java Code Quality: Gute Software braucht guten Code - Regeln für verständlich...
Java Code Quality: Gute Software braucht guten Code - Regeln für verständlich...Java Code Quality: Gute Software braucht guten Code - Regeln für verständlich...
Java Code Quality: Gute Software braucht guten Code - Regeln für verständlich...GFU Cyrus AG
 

Similaire à Rich snippets und Co (20)

Dojo Und Notes
Dojo Und NotesDojo Und Notes
Dojo Und Notes
 
Backbase Intro
Backbase IntroBackbase Intro
Backbase Intro
 
SEO-Campixx 2022 | Suchoperatoren auf Steroiden
SEO-Campixx 2022 | Suchoperatoren auf SteroidenSEO-Campixx 2022 | Suchoperatoren auf Steroiden
SEO-Campixx 2022 | Suchoperatoren auf Steroiden
 
Schema.org 101: 
Warum die neuen Meta Daten wichtig sind - Mini FAQ & Impleme...
Schema.org 101: 
Warum die neuen Meta Daten wichtig sind - Mini FAQ & Impleme...Schema.org 101: 
Warum die neuen Meta Daten wichtig sind - Mini FAQ & Impleme...
Schema.org 101: 
Warum die neuen Meta Daten wichtig sind - Mini FAQ & Impleme...
 
Mvc public
Mvc publicMvc public
Mvc public
 
Slides__Splunk_UserGroup_20220407.pdf
Slides__Splunk_UserGroup_20220407.pdfSlides__Splunk_UserGroup_20220407.pdf
Slides__Splunk_UserGroup_20220407.pdf
 
Große Applikationen mit AngularJS
Große Applikationen mit AngularJSGroße Applikationen mit AngularJS
Große Applikationen mit AngularJS
 
Continuous Delivery aus Sicht des Testers
Continuous Delivery aus Sicht des TestersContinuous Delivery aus Sicht des Testers
Continuous Delivery aus Sicht des Testers
 
Google Analytics Konferenz 2019_App Tracking_Runa Reno (Booking.com) & Markus...
Google Analytics Konferenz 2019_App Tracking_Runa Reno (Booking.com) & Markus...Google Analytics Konferenz 2019_App Tracking_Runa Reno (Booking.com) & Markus...
Google Analytics Konferenz 2019_App Tracking_Runa Reno (Booking.com) & Markus...
 
Python builds mit ant
Python builds mit antPython builds mit ant
Python builds mit ant
 
Einführung in React
Einführung in ReactEinführung in React
Einführung in React
 
Lightweight AOP with CDI and JPA
Lightweight AOP with CDI and JPALightweight AOP with CDI and JPA
Lightweight AOP with CDI and JPA
 
System-Management-Trio: Zentrale Verwaltung mit facter, puppet und augeas
System-Management-Trio: Zentrale Verwaltung mit facter, puppet und augeasSystem-Management-Trio: Zentrale Verwaltung mit facter, puppet und augeas
System-Management-Trio: Zentrale Verwaltung mit facter, puppet und augeas
 
Schnelle Winkel: 10x schnellere Webapps mit AngularJS und JEE
Schnelle Winkel: 10x schnellere Webapps mit AngularJS und JEESchnelle Winkel: 10x schnellere Webapps mit AngularJS und JEE
Schnelle Winkel: 10x schnellere Webapps mit AngularJS und JEE
 
Content Design und UI Architektur für Multiscreen-Projekte (Usability Profess...
Content Design und UI Architektur für Multiscreen-Projekte (Usability Profess...Content Design und UI Architektur für Multiscreen-Projekte (Usability Profess...
Content Design und UI Architektur für Multiscreen-Projekte (Usability Profess...
 
MongoDB Munich 2012: Spring Data MongoDB
MongoDB Munich 2012: Spring Data MongoDBMongoDB Munich 2012: Spring Data MongoDB
MongoDB Munich 2012: Spring Data MongoDB
 
CAMPIXX 2015: Traffic Änderung durch den Knowledge Graph
CAMPIXX 2015: Traffic Änderung durch den Knowledge GraphCAMPIXX 2015: Traffic Änderung durch den Knowledge Graph
CAMPIXX 2015: Traffic Änderung durch den Knowledge Graph
 
iDocIt - Ein Assistent zur API-Dokumentation
iDocIt - Ein Assistent zur API-DokumentationiDocIt - Ein Assistent zur API-Dokumentation
iDocIt - Ein Assistent zur API-Dokumentation
 
System-Management-Trio: Zentrale Verwaltung mit facter, puppet und augeas
System-Management-Trio: Zentrale Verwaltung mit facter, puppet und augeasSystem-Management-Trio: Zentrale Verwaltung mit facter, puppet und augeas
System-Management-Trio: Zentrale Verwaltung mit facter, puppet und augeas
 
Java Code Quality: Gute Software braucht guten Code - Regeln für verständlich...
Java Code Quality: Gute Software braucht guten Code - Regeln für verständlich...Java Code Quality: Gute Software braucht guten Code - Regeln für verständlich...
Java Code Quality: Gute Software braucht guten Code - Regeln für verständlich...
 

Rich snippets und Co

  • 1. Rich Snippets & Co: HTML5 aus SEO-Sicht SEO CAMPIXX 2012, 11. März 2012, Helge Cramer, Cramer & Consorten GmbH 1
  • 2. Ein paar Worte zu mir Helge Cramer -Studium Physik und Journalistik (Berufswunsch war Wissenschaftsjournalist) -Seit 1996 geschäftlich im Internet unterwegs -2000 Agenturgründung (Cramer & Consorten GmbH) - aktuell 16 Mitarbeiter, davon 6 in der Entwicklung tätig - Kunden: von ganz klein bis zu ganz groß ;-) -eine Frau , ein Kind , kein Hund 
  • 3. HTML4 zu HTML5 Wichtigste Änderungen in HTML5: -Neue, beschreibende/semantische Tags (<nav>, <article>, <aside>, <footer> -Neue Elemente zur Einbindung von Mediendaten ohne Plugins (<canvas>, <video>) -Geo-Lokalisierung -...
  • 4. Einführung Rich Snippets bei Google Google mochte strukturierte Daten schon immer -Mai 2007: Einführung Universal Search -Mai 2009: Einführung Rich Snippets (Bewertungen und Personen) -Juni 2011: Einführung schema.org (mit Bing und Yahoo), Entfall der Anmeldung
  • 5. Prinzipieller Aufbau (Microdata) Neue globale Attribute (HTML5) -itemscope Kategorie der Informationen („Klammer“) -Itemtype Typ/Schema der Information (Beschreibung, Bild, Bewertung, Event etc) -itemprop (Priorisiertes) Informationsattribut -itemid eindeutiger Bezeichner -itemref Information außerhalb der definierten Kategorie/des gewählten Scopes
  • 6. Prinzipieller Aufbau (Microdata) Wo ziehen Google & Co die Inhalte? Netterweise gilt eine einfache Faustregel: (In der Regel) ziehen die Suchmaschinen je nach (HTML5-) Tag die Infos immer von dort, wo man es erwarten darf: -area, link u.ä: href-Attribut aus dem selben Tag -meta content-Attribut aus dem selben Tag -audio, embed, img, track, video u.ä. src-Attribut aus dem selben Tag -time datetime-Attribut aus dem selben Tag -object data-Attribut Bei allen anderen HTML-Tags (span, p, div etc) wird der Content verwendet, der von dem Tag eingeschlossen ist.
  • 7. Prinzipieller Aufbau (Microdata) Die Mutter aller Dinge <div itemscope itemtype=“http://schema.org/Thing“> <div itemprop=“name“>Name</div> <div itemprop=“url“>Deeplink</div> <div itemprop=“description“>Kurzbeschreibung</div> <div itemprop=“image“>Bild-URL</div> </div> Alle Kategorien leiten sich vom „Thing“-Objekt ab - vollständiges Schema unter http://schema.org
  • 8. Snippets – Event-Snippets Was wird angezeigt? Was kann das Objekt noch? -Events (Einzelevent oder Eventliste) -startDate (ISO 8601, 2012-03-05T13:42Z) -endDate (ISO 8601) -Duration (ISO 8601, , z.B. PT30M für 30 Minuten) -Location (mit Unterobjekt Place oder PostalAdress) -Offers (mit Unterobjekt offer) -Performers (Person oder Organization) -subEvents (wieder vom Typ Event) Wie wird es implementiert? -superEvent (wieder vom Typ Event) Eltern-Objekt Thing: Spezifischere Unter-Objekte <div itemscope itemtype=http://schema.org/Event> -BusinessEvent <div itemprop=“name“>Name des Events</div> -ChildrensEvent <div itemprop=“url“>Deeplink</div> -ComedyEvent <div itemprop=“description>Kurzbeschreibung</div> -MusicEvent <div itemprop=“image“>Bild-URL</div> -... (http://schema.org) </div>
  • 9. Snippets – aggregierte Bewertung Was wird angezeigt? Darstellung auf der Website (sichtbarer Bereich!) - Bewertungen (aggregiert) Wie wird es implementiert? <div itemscope itemtype="http://data-vocabulary.org/Review-aggregate"> <span itemprop="v:itemreviewed"></span> <span itemprop="rating" itemscope itemtype="http://data-vocabulary.org/ Rating" class="text"> <img src="http://1.2.3.13/bmi/www.ils.de/images/ILS2/sterne.png"> &nbsp;Aktuell: Note 1,5 ( <span itemprop="average">4.5</span> von <span itemprop="best">5</span>Sterne bei <span itemprop="votes">1096</span> Befragungen)</span> </div>
  • 10. Snippets – Erfahrungsbericht Detailansicht Was wird angezeigt? Darstellung auf der Website (sichtbarer Bereich!) -Ein konkreter Erfahrungsbericht Wie wird es implementiert? <div itemscope itemtype="http://data-vocabulary.org/Review"> <span itemprop="itemreviewed">Geprüfte/r Fachpraktiker/in für Massage, Wellness und Prävention</span> <time itemprop="dtreviewed" datetime="2012-01-25">25.01.12</time> <span itemprop="reviewer">Kristina S., Hannover</span> <span class="note_1">1</span> ( <span itemprop="rating">5</span> von <span itemprop="best">5</span> Sternen) <span itemprop="summary">In die Selbstständigkeit starten<br/>....in die Selbstständigkeit starten.</span> </div>
  • 11. Snippets – Produkte Was wird angezeigt? Wie wird es implementiert? -Ein konkretes Produkt  sehr schöne Kombinationen mit Bewertungen möglich: Eltern-Objekt Thing: <div itemscope itemtype=http://schema.org/Product> <div itemprop=“name“>Name des Events</div> <div itemprop=“url“>Deeplink</div> <div itemprop=“description>Kurzbeschreibung</div> <div itemprop=“image“>Bild-URL</div> </div> Was kann das Objekt noch? -aggregateRating (vom Typ AggregateRating) -brand (vom Typ Organization) -manufacturer (vom Typ Organization) -model (Text) -offers (vom Typ Offer) -productID (vom Typ Text, z.B. EAN/ISBN) -reviews (vom Typ Review)
  • 12. Snippets – Event-Snippets Was wird angezeigt? Was kann das Objekt noch? -Events (Einzelevent oder Eventliste) -startDate (ISO 8601, 2012-03-05T13:42Z) -endDate (ISO 8601) -Duration (ISO 8601, , z.B. PT30M für 30 Minuten) -Location (mit Unterobjekt Place oder PostalAdress) -Offers (mit Unterobjekt offer) -Performers (Person oder Organization) -subEvents (wieder vom Typ Event) Wie wird es implementiert? -superEvent (wieder vom Typ Event) Eltern-Objekt Thing: Spezifischere Unter-Objekte <div itemscope itemtype=http://schema.org/Event> -BusinessEvent <div itemprop=“name“>Name des Events</div> -ChildrensEvent <div itemprop=“url“>Deeplink</div> -ComedyEvent <div itemprop=“description>Kurzbeschreibung</div> -MusicEvent <div itemprop=“image“>Bild-URL</div> -... (http://schema.org) </div>
  • 13. Bevorzugt Google korrekt ausgezeichnete Seiten? Der Mensch ist willig, doch die Maschine ist schwach Man darf gesichert davon ausgehen, dass Google den Content möglichst komplett auslesen will und deswegen häufige Fehler zu erkennen (und korrigieren) versucht. Ebenso wird sicher daran gearbeitet, semantische Informationen zu erkennen, auch wenn der Content nicht semantisch ausgezeichnet wird. -nicht geschlossene Tags -Inkorrekte doctype-Deklarationen -In Tabellen gegossene nicht-tabellarische Informationen -Aufzählungen (z.B. Menus) ohne Listenauszeichnung -... Da die Anzahl möglicher Fehler und „Fehlerchen“ aber sogar die geballte Vorstellungskraft aller Google-Entwickler übersteigt und Google auf der anderen Seite absolut datenhungrig ist, darf man ebenso gesichert davon ausgehen, dass -der Google Crawler sich auch mal verschluckt und eine Seite somit nicht korrekt bzw. gar nicht indexiert -(korrekt) implementierte Strukturelemente und Mikrodaten vom Bot gierigst aufgenommen werden
  • 14. Bevorzugt Google korrekt ausgezeichnete Seiten? Manipulation!? Sehr häufig hört man den Einwand - besonders bei Bewertungen, die ja als Sternchen in den SERPs auftauchen – dass dem Missbrauch Tür und Tor geöffnet ist, da man diese einfach so reinschreiben kann. Dazu lässt sich sagen: -Es stimmt! -Aber: - Die Mikrodaten müssen sich im sichtbaren Bereich der Seite befinden. Versteckte Informationen (z.B. durch display:none;) bekommen auch keinen RichSnippet - Google gibt damit nur wieder, was der Seiteninhaber selbst über seine Seite schreibt- also nichts anderes als das, was Google auch mit der Wiedergabe der description oder des titles tut... Damit zieht Google sich bequem auf seine Rolle als Suchmaschine zurück: Schließlich kontrolliert man ja auch textlichen Inhalt nicht auf den Wahrheitsgehalt, sondern straft nur ab, wenn die Maschine etwas anderes sieht als der User. Persönliche Meinung: Konsequent wäre es, wenn Google hinter dieser „Verteidigungslinie“ bleibt und sich nicht zum „Zensor“ aufschwingt, indem z.B. nur noch Bewertungen zugelassen werden, die „gesichert“ sind durch Ciao, ekomi und Co. Sollten die SERPs irgendwann zu „sternig“ werden, wäre ein Abschalten oder ein Zuspielen aus Google-eigenen Quellen die glaubwürdigste Alternative.
  • 15. Bringen RichSnippets höhere Klickraten? (Nicht-repräsentative) Messung -Vergleichszeitraum Monat (mit Sternchen) mit Vormonat (ohne Sternchen) -Beschränkt auf ausgewählte Keywords: - Keine Änderung im Ranking im Vergleich zum Vormonat - Keine wesentliche Schwankung im Suchvolumen lt. Google -Ergebnis: Der auch im Schnitt sehr deutliche Zuwachs an Traffic muss (zumindest im Wesentlichen) von einer verbesserten CTR und damit durch den Einsatz von RichSnippets kommen (im Schnitt etwa +20-25%)
  • 16. Bringen RichSnippets höhere Klickraten? Achtung, Gegenverkehr! -Da RichSnippets für den User idR eine „positive Nutzererfahrung“ bieten, wird Google dies sicher weiter ausbauen -Aus SEO- und Webmaster-Sicht sollte man sich also unbedingt – wenn nicht schon geschehen – da einarbeiten -Sinnvoll im Sinne einer höheren CTR bei - Bewertungen (Per aspera ad astra) - Produkten -Da Informationen, für die man sonst bei Google in den SERPs klicken musste, jetzt schon dort ohne weiteren Klick für den User zu haben sind, kann es allerdings auch mal zu einer niedrigeren CTR und damit zu Trafficverlusten kommen, insbesondere bei - Firmeninformationen - Rezepten - Events (Termin passt nicht) - Preisinformationen (andere Snippets mit niedrigeren Preisen) - ...
  • 17. Fazit Was nun, Herr SEO? -Insgesamt syntaktisch korrektes und semantisch sinnvolles XHTML, HTML4, HTML5, HTMLwhatever tut nicht weh, dient der Quellcode-Hygiene und verhindert, dass sich Crawler an hervorhängenden Nägeln weh tun. -Aufmerksam verfolgen wohin die Reise geht -Semantische Auszeichnung lt. schema.org oder data-vocabulary.org bei Bewertungen und Produkten können eigentlich uneingeschränkt empfohlen werden- wenig Aufwand und teilweise starker Einfluss auf den Traffic, insbesondere bei den Keywords, wo in den SERPs noch wenig oder keine Sterne auftauchen (ja, die gibt es...) -Vorsichtig bei allen Informationen in den SERPs, aus denen der User alles das sieht, wozu er sonst die Seite aufgesucht hätte.
  • 18. Links Ressourcen zum Thema - RichSnippet-Generatoren: - http://www.ebusiness-unibw.org/tools/grsnippetgen/ - http://www.microdatagenerator.com/ - Google Testing Tool http://www.google.com/webmasters/tools/richsnippets - Getting started: http://schema.org/docs/gs.html - schema.org FAQ: http://support.google.com/webmasters/bin/answer.py?hl=en&answer=1211158 - Guter Einstieg bei t3n: http://t3n.de/news/html5-seo-rich-snippets-suchergebnisse-revolutionieren-323101/
  • 20. Noch Fragen? Helge Cramer Cramer & Consorten GmbH Papenreye 27 22453 Hamburg Tel.: 040 411 6149-11 Fax: 040 411 6149-10 E-Mail: h.cramer@cramer-cons.de Internet: www.cramer-cons.de