Zum Hauptinhalt springen
HochladenSprache (DE)Support
BusinessMobilSoziale MedienMarketingTechnologieKunst & FotosKarriereDesignBildungPräsentationen & VorträgeRegierungs- und gemeinnützige OrganisationenGesundheitswesenInternetRechtLeadership & ManagementAutomobilIngenieurwesenSoftwarePersonalbeschaffung & PersonalwesenEinzelhandelVertriebServiceleistungenWissenschaftKleinunternehmen & UnternehmertumLebensmittelUmweltschutzWirtschaft & FinanzenDaten & AnalysenInvestorbeziehungenSportSeele & GeistNews & PolitikReisenWeiterbildung und PersönlichkeitsentwicklungImmobilienUnterhaltung & HumorGesundheit & MedizinGeräte & HardwareLifestyle
Bastian Grimm, profile picture
Hochgeladen vonBastian Grimm
4,992 aufrufe

Welcome to a New Reality - SEO goes Mobile First in 2017

Das Dokument behandelt das Thema Mobile First Indexing, bei dem Google Inhalte bevorzugt, die für mobile Geräte optimiert sind. Es wird erklärt, dass mobile Suchanfragen seit 2015 die von Desktop-Geräten übertreffen und dass Google plant, die Indexierung auf mobile Versionen von Websites umzustellen. Außerdem werden Herausforderungen und Best Practices hervorgehoben, um eine optimale Nutzererfahrung auf mobilen Geräten zu gewährleisten.

Marketing◦
Verwandte Themen:
Mobile Marketing Insights• Search Engine Optimization•
Bastian Grimm, Peak Ace AG | @basgr Crawling, Indexing & Ranking in the age of a mobile first world. Welcome to a New Reality!
2 pa.ag@peakaceag Keine Lust mitzuschreiben? https://pa.ag/mobidx
3 pa.ag@peakaceag Zusammengefasst geht es beim Mobile First Indexing darum, dass Google Cross Device kompatiblen Content vorziehen wird und so organisiert, dass er von vielen verschiedenen Geräten möglichst einfach abgefragt und angezeigt werden kann. Crawling Indexing Ranking Mobile Was ist Mobile First Indexing?
4 pa.ag@peakaceag Warum macht Google das? Mobile schlägt Desktop! Seit 2015 gibt es mehr mobile Suchanfragen als über Desktop. Hitwise berichtete in 08/2016, dass fast 60 Prozent aller Anfragen von mobilen Geräten ausgehen. Quellen: Hitwise (http://pa.ag/2qofNNV) & SearchEngineLand (http://pa.ag/2pT2OA7) Anteil der Online Suchanfragen ausgehend von mobilen Geräten, nach Industrie:
5 pa.ag@peakaceag Unterschiedliche Nutzererfahrung je nach Suchanfrage
6 @peakaceag pa.ag Mobile Suchergebnisse zu “Game of Thrones” (US) Source: Google US, Mobile SERP on iPhone6 – 24/08/2017 Klassische, organische Suchergebnisse? Fehlanzeige!
7 pa.ag@peakaceag Fragen werden im mobilen Chrome direkt beantwortet Via Twitter: http://pa.ag/2tQfXA9
Zukünftig werdet ihr auf der Basis eurer mobilen Seite gerankt Von Desktop zu Mobile
9 pa.ag@peakaceag Google kündigte Mobile First Indexing im Nov. 2016 an Wie und Wann? Sogar Google weiß vieles noch nicht sicher! Chaos pur…
10 pa.ag@peakaceag Google bestätigt: Weiterhin nur einen Suchindex! Quelle: http://pa.ag/2fVfl5q
11 pa.ag@peakaceag Googles Mobile First Indexing Roadmap #1 Letztes Update 15/06/17 Quelle: SMX Advanced 2017, Seattle Die Änderung wird global durchgeführt, nicht schrittweise nach Sprachen oder Ländern. Zeitrahmen: „Wir sind noch einige Zeit davon entfernt“, Umsetzung also nicht vor 2018 „Es könnte noch vier bis fünf Jahre dauern, bis es einen kompletten Mobile First Index geben wird” so Illyes. 3 12 6 9
12 pa.ag@peakaceag Vielleicht wird‘s auch einfach das „Trial & Error“ Prinzip? Quelle: http://pa.ag/2rmNU6m It's also possible that we'll say well this batch of sites works perfectly fine on mobile first indexing so we'll just switch that over and wait with the next batch.” „
13 pa.ag@peakaceag Googles Mobile First Indexing Roadmap #2 Letztes Update 15/06/17 Quelle: SMX Advanced 2017, Seattle Für Desktop-Seiten bleibt die Indexierung gleich; doch gecrawlt wird per mobilem User Agent: „Wir indexieren mobile Inhalte, wenn es keine gibt werden die Desktop-Inhalte herangezogen. Niemand rutscht also aus dem Index!“ Kann ich Accordion Tabs, Hidden Tabs, usw. auf meiner mobilen Website nutzen? Google wird diese genauso wie Non-Hidden Content bewerten. Illyes: „Google is going to ensure that hidden content is not valued less on a mobile site.“ + - + Lorem Ipsum dolor Lorem Ipsum dolor Lorem Ipsum dolor Lorem Ipsum dolor Lorem Ipsum dolor Lorem Ipsum dolor
14 pa.ag@peakaceag Googles Mobile First Indexing Roadmap #3 Letztes Update 15/06/17 Quelle: SMX Advanced 2017, Seattle Was ist, wenn die mobile Website weniger Content aufweist als die Desktop Page? Das Ranking wird auf „kürzerem“ Content basieren! Somit muss sichergestellt werden, dass die Inhalte, die gerankt werden sollen, auf der mobilen Seite zu finden sind. Mobile Ranking Faktoren Diese bleiben generell unverändert, inklusive des Mobile-Friendly-Testings.
15 @peakaceag pa.ag Mobile First Indexing – Die Herausforderungen #1 Quelle: Gary Illyes @ SMX Advanced Seattle 2017 Figuring out for 18-year-old desktop signals: How can this be used for the mobile web? E.g. the link graph/PR is different and totally messed up; how can Google make this work?” „
16 @peakaceag pa.ag Mobile First Indexing – Die Herausforderungen #2 Quelle: Gary Illyes @ SMX Advanced Seattle 2017 Google never had to swap over an entire index to something new, this is completely new and doing that without experimentation is not possible. And sites should not be hurt, therefore large scale indexing experiments will be conducted.” „
17 pa.ag@peakaceag Sh*t just got real! ~4.500 Visibility auf Desktop! Mobile Subdomain beginnt auf Desktop zu ranken: Real-World Testing!?
18 @peakaceag pa.ag Erste Seiten wurden bereits umgestellt: Quelle: Gary Illyes @ International Search Summit 2017, Barcelona I don’t believe we will be giving you any type of notification once you have been switched to mobile-first indexing. „
19 pa.ag@peakaceag Aber was ist denn überhaut „Mobile“ (für Google)? iPhone, iPad oder noch größer? Welche Bildschirmauflösung gilt als Standard?
Bedenkt, dass Google beim Rendern (fast) alles abfragt, was zu einer Seite gehört, JavaScript, CSS, usw. Bevor wir einsteigen:
…aller Seiten nutzen JavaScript – deswegen rendert Google Websites jetzt auch, anstatt sie nur zu crawlen! 93,7 %
22 pa.ag@peakaceag Die Zeiten von „View Source“ sind endgültig vorbei: Rendered Un-rendered
23 pa.ag@peakaceag JS Frameworks und deren Kompatibilität für SEO? Schaut euch Bartosz‘ umfangreiches Experiment zu Crawlability und Indexability an! Mehr erfahren: http://pa.ag/2qLqlqH
Rendering: Welche Auflösung?
25 pa.ag@peakaceag 1024 x 768 = (noch) Desktop! Warum ist das so wichtig? Achtet auf responsive Breakpoints, Portrait vs. Landscape, usw. – alles Wichtige muss richtig gerendert werden!
26 pa.ag@peakaceag Bonus > GSC Fetch & Render für (fast) alles, was ihr wollt! Mit dem 100 Prozent iFrame seht ihr, wie Google eine (beliebige) Website rendert.
Auflösung ist nicht das Wichtigste…
28 pa.ag@peakaceag Der durchschnittliche Konsument nutzt fünf Devices! Du kannst nicht für alle Geräte perfekt angepasste Websites bauen und pflegen, z.B. eine für das iPad und verschiedene Seiten für alle Smartphone Bildschirmauflösungen! Quelle: http://pa.ag/2ffuGNp & http://pa.ag/2fHvLhz 90 % aller User beginnen Online Tasks auf einem Gerät und beenden diese auf einem anderen.
29 @peakaceag pa.ag Proper Responsive Aus SEO Gesichtspunkten bietet Responsive Design diverse Vorteile!
30 pa.ag@peakaceag Was bedeutet Responsive Webdesign? #1 ▪ Vor allem: Content auf verschiedene Arten anzeigen, je nach Auflösung (Gerät). Designt das kleinste Ansichtsfenster zuerst, arbeitet euch dann nach oben; achtet auch auf Quer- und Hochformate. ▪ Bilder: Bestmögliche Größe, Auflösung & Format. Das neue <picture> Element ist perfekter Ausgangspunkt, aber es gibt noch viele andere Lösungen. Denkt an „Fluid Images“, die sich an ihren Container anpassen. <picture>
31 pa.ag@peakaceag Was bedeutet Responsive Webdesign? #2 ▪ Critical Rendering Path: Optimiere für ein schnellstmögliches „Time to meaningful Paint“. Round Trips beachten; offloading von JS & Inline CSS für all Breakpoints (je nach Auflösung). ▪ Conditional Loading von Komponenten (bspw. nur wenn sichtbar), kombiniert mit Pre-Fetching und Pre-Rendering (bei hohen Auflösungen).
32 pa.ag@peakaceag Was bedeutet Responsive Webdesign? #3 ▪ Optimiert Paint und Re-Paint, besonders für niedrige Auflösungen/Breakpoints. CSS Media Queries können eine große Hilfe sein. ▪ Haltet euren DOM sauber (Versteckte Elemente sind nur die halbe Wahrheit bzw. keine gute Idee!). 1 2 3 4 5 6 7 8 9 10 11 <!DOCTYPE html> <html> <head> <title>Page Title</title> </head> <body> <h1>Heading</h1> <p>Paragraph</p> </body> </html>
33 pa.ag@peakaceag Googles Mobile First Indexing Roadmap #4 Letztes Update 15/06/17 Quelle: SMX Advanced 2017, Seattle Für die Ladegeschwindigkeit (Scoring) wird die mobile Version anstatt der Desktop Version geprüft.
Insbesondere Mobil! Effizienteres Crawling ist als netter Nebeneffekt… Performance = User Experience
35 pa.ag@peakaceag Die Erwartungshaltung eurer Besucher ist klar: Langsame Ladezeiten sind der meistgenannte Grund, eine Seite zu verlassen! According to a Nielsen report, 47 % of people expect a website to load within two seconds, and 40 % will leave a website if it does not load fully within three seconds.” „
36 @peakaceag pa.ag Google forciert das Thema Site Speed immer wieder: Quelle: http://pa.ag/1cWFCtY
37 pa.ag@peakaceag Die Basics sind natürlich (weiterhin) super wichtig: ▪ Bildoptimierung: Reduziert Overheads für JPGs & PNGs (Metadaten, usw.), beachtet neue Formate (WebP) ▪ Effektives Caching und HTTP Komprimierung sollten impementiert werden ▪ Wenn möglich, nutzt asynchrone Requests ▪ Verkleinert CSS und JavaScript Dateien (minify) ▪ Nutzt ein Content Distribution Network (CDN) oder einen Asset Server (sowie cookie-less Domains) um parallele Requests zu optimieren ▪ Lean Markup (Keine Kommentare, nutzt Inline CSS/JS nur wenn unbedingt notwendig) ▪ Optimiert den Critical Rendering Path (Google interessiert hauptsächlich „Above The Fold“ Content) Alle Folien auf SlideShare: http://pa.ag/iss17speed
HTTPS & HTTP/2! Denn das HTTP Protokoll ist einfach uralt! Viel spannender als die Basics:
39 @peakaceag pa.ag Die Top-3 der High Volume Keywords: >60 % HTTPS! Quelle: SEMrush Ranking Factors 2017 - https://semrush.com/ranking-factors
40 @peakaceag pa.ag Meine Prognose für dieses Jahr: Wir werden bis Ende 2017 mehr als 90 Prozent aller Top 10 Ergebnisse auf HTTPS sehen!” „
41 @peakaceag pa.ag HTTPS Ranking „Boost?“ Vielleicht…vielleicht auch nicht! Quelle: http://pa.ag/2ekj4Gi & http://pa.ag/2pRq0PS
42 pa.ag@peakaceag Chrome mit (noch) mehr Warnungen ab Oktober 2017! Chrome 62 wird jede einzelne HTTP-URL im Inkognito-Modus als unsicher flaggen! Quelle: http://pa.ag/2rmIAjg
43 @peakaceag pa.ag Für alle, die das (immer noch) nicht verstanden haben: Nutzt HTTPS nicht ohne HTTP/2 (SPDY)!” „
Eine weitere „Neuheit“ in den mobilen SERPs Accelerated Mobile Pages (AMP)
45 pa.ag@peakaceag AMP: Kastriertes HTML für maximale Performance Google ist Geschwindigkeit deutlich wichtiger als (HTML-) Features Nicht erlaubt: ▪ externes CSS ▪ JavaScript (außer Async JS) ▪ Flash, Java & Co. Maximale mobile Performance: ▪ weniger CPU und Memory ▪ geringere Bandbreite ▪ niedrigerer Batterieverbrauch ▪ verbesserte Usererfahrung Beachte: ▪ nur Text und Bilder, alles andere ist limitiert ▪ CSS nur inline (non-blocking) ▪ CSS mit Größenlimitierung ▪ benötigt Breiten- und Höhenangaben (z.B. Bilder)
46 pa.ag@peakaceag AMP ist zwar sehr schnell… …aber bietet eine komplett andere UX, derzeit landen nur 3 % der AMP Besucher auf der non-AMP URL. Quelle: http://pa.ag/2fkyXLJ 6231 929 Regular AMP Ladezeit der mobilen Seite 0 2000 4000 6000 8000 (ms) Real-World Data: Mobile Ladezeiten 5,7 x schneller
47 pa.ag@peakaceag …und AMP erhält weiterhin einiges an Aufmerksamkeit: Quelle: http://pa.ag/2qoc2bh & http://pa.ag/2qoaOwc & http://pa.ag/2rmWGRN
48 pa.ag@peakaceag WSJ: Publisher trotzdem nicht 100 % zufrieden AMP Seitenaufrufe generieren nur halb so viel Erträge wie „echte“ mobile Websites Quelle: http://pa.ag/2fzOWK3 Diverse Zeitungen verkünden, dass ein AMP Seitenaufruf momentan nur etwa halb so viel Revenue generiert wie der Seitenaufruf einer vollständig mobilen Website.” „
49 pa.ag@peakaceag Aber… AMP ist doch nur für Publisher?! Hervorragende Präsentation zu Advanced AMP von @fighto – don‘t miss it! Mehr: http://pa.ag/2xWPD5q
Kein AMP? Google hilft:
51 pa.ag@peakaceag Google konvertiert non-mobile-friendly Websites (wieder) automatisch: Quelle: http://pa.ag/2sorYbC
10 Tipps, um eure Websiten vorzubereiten:
53 pa.ag@peakaceag #1 Erkennt die Stärken & Schwächen eures mobilen Setups Was wird genutzt und wieso? Ist die Website richtig konfiguriert? www.example.com x www.example.com x www.example.com x m.example.com x Responsive Web Design Dynamic Serving Independent Mobile Site Vermeidet es, Bilder, CSS & JS zu blockieren Beachtet die Variable: HTTP-User- Agent-Header Identifikation und Zuordnung der relevanten Web Version anhand des richtigen User Agent Implementiert Rel-Alternate & Canonical Tags zwischen mobilen & Desktop URLs. Nutzt 301-Redirects zwischen mobiler Ansicht & Desktop um den User Agent der relevanten Web Version zuzuordnen Responsive Web Design Dynamic Serving Independent Mobile Site
54 pa.ag@peakaceag #2 Nutzt ihr die richtigen Keywords für Mobile? Prüft welche Suchbegriffe für verschiedene Devices passen! Selling (transactional) Buying (transactional) VS
55 pa.ag@peakaceag #3 Ist eure Website wirklich mobile friendly? Schnelltest: Prüfe die Kompatibilität mit den Chrome DevTools (Windows: Ctrl+Shift+I)!
56 pa.ag@peakaceag Hier könnt ihr direkt mehrere URLs gleichzeitig prüfen: Probiere es aus: https://technicalseo.com/seo-tools/mobile-friendly/
57 pa.ag@peakaceag #4 Interstitials können mobile Zugriffe verhindern Auch andere Overlay/Pop-Ups wirken sich negativ auf die User Erfahrung aus! Quelle: http://pa.ag/2tPmhIi Beispiele für Unterbrecherwerbung (Interstitials), die Content schwer zugänglich machen Beispiel: Intrusives Popup Beispiel: Intrusives, alleinstehendes Interstitial Beispiel: Intrusives, alleinstehendes Interstitial Beispiel: Interstitials für Cookie Nutzung Beispiel: Interstitials für Altersverifikation Beispiel: Banner, der nur einen Teil des Bildschirms nutzt Beispiele für Interstitials, die bei richtiger Nutzung keine negativen Auswirkungen haben
58 pa.ag@peakaceag #5 Habt ihr an alle GSC Reports gedacht? Neben dem Mobile Usability Report vergesst nicht Rich Cards & Structured Data Tests!
59 pa.ag@peakaceag #6 Extra Check: GSC Fetch & Render für mobile Ansicht! Details beachten: Identischer Content? Fehlt etwas? Sind Ressourcen geblockt?
60 pa.ag@peakaceag Schon gesehen? Ein neues Testing Tool von Google: Probiere es aus: https://testmysite.thinkwithgoogle.com/intl/en-us
61 pa.ag@peakaceag #7 Macht den Komplettcheck mit Fokus auf mobilen Reports: DeepCrawl bietet ausführliches Reporting rund um das Thema „Mobile“!
62 pa.ag@peakaceag #8 Simuliert Googlebot für mobile mit JS Rendering! Mit ScreamingFrog geht das ganz leicht – Achtung bei gerendertem Output! Auch hilfreich: Extract > Xpath > //head/link[@rel="amphtml"]/@href
63 pa.ag@peakaceag #9 Prüft den gesamten Content eurer mobilen Website! Ist das schema.org Markup auch auf der mobilen Seite verfügbar? Was ist mit Indexierungsregeln, Canonical Tags, usw.? Usually, rel-canonicals, structured data, hreflang, other annotations and even images are missing! Copy everything you want to rank for over to mobile (for now)!” „
#10 Don‘t f*cking panic!
65 pa.ag@peakaceag Wir wachsen: 25+ Performance Marketing Jobs in Berlin! Sprecht mich gerne jederzeit an - oder meldet euch via jobs.pa.ag. Wir freuen uns!
66 pa.ag@peakaceag Bastian Grimm bg@pa.ag twitter.com/peakaceag facebook.com/peakaceag www.pa.ag Fragen? Let‘s go! Always looking for talent! Check out jobs.pa.ag https://pa.ag/mobidx