Mobile first index?
Heb je al gehoord van “Mobile first index”? Bereid je nu maar voor op de “mobile first index” voor SEO ik geef je 7 tips dat erg handig kunnen zijn voor in de toekomst.
Het is al een tijd geleden bekend gemaakt dat Google over gaat van een Desktop-First naar “Mobiel first index.” Het gaat niet meer lang duren ik verwacht dat Google het eind 2017 of begin van 2018 het online gaat zetten. Maar dan is nu de vraag wat is nu de “mobile first index”? Wat moet je nu gaan doen en hoe ga je er voor zorgen dat je goed voorbereid bent op deze nieuwe indexering?
Wat is de mobile first index? Wat betekent het?
Zo als je het inmiddels al hebt gehoord of weet Google indexeert nu eerst je desktop versie en vervolgens wordt je mobiele versie geïndexeerd. Met de nieuwe methode van Google wordt als eerst je mobiele versie van je website geïndexeerd. Vervolgens gaat Google je desktop versie indexeren, hier is het dan erg belangrijk dat je website 100% responsief is. Het is nu al een must maar na dat Google “mobile first index” online gezet heeft is het verboden om geen responsieve website te hebben.
Verschillende branches in Mobiel
Dat steeds meer verkeer via mobiele devices verloopt is geen nieuws, maar hoe liggen de verhoudingen in de verschillende branches? Uit onderzoek van Adwise is gebleken dat het gebruik van mobiel, tablet en desktop sterk van elkaar verschilt per branche. Business-to-businesssites wijken hierbij het meeste af, in deze branche is het aantal sessies met een desktop het hoogst, namelijk gemiddeld 72,57 procent. Mobiel komt tweede met 18,77 procent en tablet als laatste met 7,76 procent.
Mobiel in verschillende branches
Betekent dit dan dat de mobile-first-index voor de b2b branche niet relevant is? Zeker niet, het is net zo belangrijk. Ondanks dat de meeste bezoekers op de desktop versie van je website zitten indexeert Google de mobiele versie van je website en deze heeft invloed op welke positie jij komt te staan.
Tip 1: Zorg voor een mobiel vriendelijke website
Het belangrijkste hier in is dat je website 100% responsive is, weet je niet zeker dat dit het geval is dan kan je nu je website ook gaan testen bij google. Zij hebben al een website online staan waar op je de test kunt uitvoeren https://search.google.com/test/mobile-friendly
Is uw webpagina geschikt voor mobiele apparaten?
Naast de mobielvriendelijkheidstest vind je in Google Search Console meer informatie over de mobielvriendelijkheid van je website. In dit menu staat vermeld op welke pagina’s verbeterpunten te vinden zijn.
Mobiele bruikbaarheid in webmastertools van google
Is je website nog niet 100% responsive gemaakt? Je vraagt je nu af wat je kunt doen ik en mijn team kunnen je hier mee helpen, het is wel noodzaak dat je hiermee aan de slag gaat voor dat google het nieuwe software online zet. Google heeft laten weten dat ze dan de dekstop versie van je website zullen indexeren alleen dan crawlen ze jouw website met een mobile user agent. Je website wordt dus nog wel geïndexeerd maar wordt slechter beoordeeld, omdat deze niet mobielvriendelijk is. Daarnaast is de kans groot dat mobiele bezoekers de website snel weer zullen verlaten omdat ze een slechtere gebruikservaring hebben. Naast dat je klanten misloopt verlies je ook erg snel je posities in google.
Tip 2: Test je mobiele website
SEO en UX worden vaak als twee aparte dingen gezien maar ze gaan hand in hand. Naast de invloed van de gebruikservaring op je vindbaarheid, vullen ze elkaar sterk aan. Binnen kort ga ik nog een artikel schrijven over ’SEO en UX’ hier in ga ik uitleggen waarom ze elkaar perfect aanvullen.
Daarom is het erg belangrijk dat je de website goed gaat testen op verschillende apparaten. Een voorbeeld wat je zou kunnen doen is om dit te doen is met Google Developer Tools of echt het op een ipad, mobiel Apple als Andoid te gaan testen. Wat GDT betreft je kunt dit doen door op F12 of CTR + Shift + i te drukken als je op de website zit. De tool opent dan automatisch. Klik vervolgens op het icoon ‘mobiel’, zoals hieronder te zien is:
Google Developer Tools
Je krijgt nu de mobiele versie van je website te zien en kunt de mobiele versie van je website testen via een desktop computer. Hier in heb je ook nog de mogelijk heiden om te schakelen tussen verschillende apparaten. Zo kan je duidelijk zien hoe je website eruit ziet op een kleinere toestel en een grotere. Let op deze tool is niet altijd 100% nauwkeurig er kunnen verschillen ontstaan tussen een echte telefoon en je test tool, dit heeft namelijk te maken met de opbouw van je JS en CSS.
Tip 3: Zorg voor een snelle website
In onze vorige blog berichten heb ik verteld hoe erg belangrijk het is dat je website super snel is en dat naast de opbouw van je website je hosting ook snel zijn moet. Hier onder zie je twee website waarvan ik gebruik maak om mijn websites te testen.
Hoe optimaliseer ik de snelheid van mijn website?
Een vraag die bij veel marketeers speelt: wat moet ik precies optimaliseren voor een snellere website? Hier is (helaas) geen eenduidig antwoord omdat iedere website anders is, het opbouw van je HTML, CSS en JS is nooit het zelfde en per website dien je het anders op te lossen. Om toch een beeld te geven van welke wijzigingen effect hebben geef ik je een voorbeeld. Nog geen twee dagen geleden heb ik gewerkt aan een website waarbij de score op mobiel op 20 en op desktop op 27 zat. Dit kwam voornamelijk door de punten wat ik hier onder ga benoemen, dit is natuurlijk een een voorbeeld van dit website maar je eigen website kan veel meer of juist minder punten bevatten.
- Afbeeldingen verkleinen en comprimeren
- Scripts en bestanden die het weergeven blokkeren, verwijderen
- Het verkleinen van CSS bestanden
- Het verkleinen van HTML
- Het verkleinen van Javascript
- Prioriteit geven aan zichtbare content
Alleen punt een heeft meer dan 30% de website snelheid verbeterd, vervolgens heb ik de rest gedaan en de website zat al snel op 80/92. Let op: het is vaak onmogelijk om de score 100% / 100% te krijgen, hoe groter je website is des kleiner je kans is om de gewenste scoren te krijgen. Nu gebruikt iedereen een CMS systeem hier mag je van geluk spreken als je score al op 85 staat. Op de “Test My Site” tool zie je ook naast de laadtijd een vergelijking met de branche weer. Hierin is te zien dat de website evengoed presteert als de ‘Top performers’ in de branche.
Aanvullende tips voor het optimaliseren van je website snelheid:
- Minimaliseer de tijd van het laden van je website. Houd de time to first byte (TTFB) zo kort mogelijk. Dit is de tijd die het duurt voordat de eerste byte aankomt bij je browser. Probeer een tijd van 200 milliseconden te behalen. Tools die je helpen dit te meten:
- Geef prioriteit aan zichtbare content, ook wel content ‘boven de vouw’ genoemd. Houd hierbij een richttijd aan van 3 seconden.
- Quick win: Veel websites gebruiken te grote en niet gecomprimeerde afbeeldingen. Verklein afbeeldingen en comprimeer deze om de websitesnelheid te optimaliseren. Het verkleinen van de afbeeldingen kun je doen met verschillende programma’s, zoals bijvoorbeeld Photoshop.
Voor het comprimeren van afbeeldingen zijn verschillende tools beschikbaar. Enkele voorbeelden:
- Compressor.io (met of zonder kwaliteitsverlies)
- TinyPNG (met kwaliteitsverlies)
- Verminder en/of verklein je CSS, Javascript en HTML waar mogelijk en beperk het aantal requests tot een minimum.
Tip 4: Start met AMP
Veel mensen kennen het nog niet of weten niet waar voor staat en wat het doet, AMP staat voor Accelerated Mobile Pages. AMP’s het zijn pagina’s die geoptimaliseerd zijn om zo snel mogelijk je website pagina te laden. Het principe is om uitgeklede versie van de pagina te laden in plaats van het origineel. Dit komt ten goede aan de website snelheid en daarmee ook de gebruikerservaring. AMP is met name geschikt voor nieuws- en artikel websites. Bij een hele interactieve pagina met veel toepassingen die ingeladen moeten worden is het wellicht minder interessant. Meer informatie over AMP lees je hier.
Tip 5: Gebruik progressive web apps
Heb je al gehoord van “Progresive Web App” ook wel genoemd “PWA”, Mijn advies is om de mogelijkheden tot een “Progessive Web App (PWA)” te bestuderen. Een Progressive Web App is als het ware een website met de eigenschappen van een app. Stel, een bezoeker bezoekt twee keer jouw website. Hij krijgt in zijn browser een melding met de mogelijkheid om de website toe te voegen aan zijn startscherm en voegt deze toe. Dan krijgt hij een soort bookmark naar de website op zijn startscherm. Voordelen hier van zijn:
- De gebruiker hoeft niet naar de Apple Store of Google Play Store om te downloaden
- De gebruiker kan de ‘app’ ook offline gebruiken
- Bedrijf heeft de mogelijkheid om push berichten te verzenden (nieuws, aanbiedingen)
Zo als je het ziet is het erg handig om (PWA) in te zetten hier mee haal je als nog veel veel voordelen uit. PWA worden door veel mensen gezien als de toekomst voor mobiel. Hoever dit nog zeker wordt weet ik niet maar ik ga van uit dat het vrij snel nog bekend wordt. Binnen kort ga ik hier over ook een artikel schrijven waar ik het in details ga uitleggen en beschrijven.
Tip 6: Zichtbare content
Vaak denken developers nog waarom moet alles zichtbaar worden op mobiel het is niet nodig, helaas nu wel je content moet zowel op desktop als mobiel zichtbaar worden. Google moet je hele pagina kunnen lezen, het is nu erg belangrijk aan het worden met de nieuwe werkwijze “Mobile first index”.
Tip 7: Interne linkstructuur
Op veel websites zie je grote dropdownmenu’s die zorgen voor veel interne links naar de categoriepagina’s. Op veel mobiele websites verdwijnt dit menu, wordt het anders ingedeeld of wordt het menu erg lang wat ten koste gaat van de gebruikservaring. Denk daarom goed na over je interne linkstructuur en waar je intern links kunt implementeren naar dieperliggende pagina’s.
Mijn tip:
Menu items: Denk goed na over de menu-items en hoe je dit in wilt gaan delen. Een heel groot menu met heel veel items gaat al snel ten koste van de gebruiksvriendelijkheid. Zorg dat de menustructuur duidelijk is voor de gebruiker. Doe eventueel user tests om zeker te zijn dat het duidelijk is voor de gebruiker van jouw website. Bol.com doet dit bijvoorbeeld met een menu waar je doorheen klikt en Kees Smit Tuinmeubelen heeft ervoor gekozen om gebruik te maken van een visueel menu.
Interne links in teksten; Veel websites doen dit al maar ook een groot deel niet. Link in de teksten naar dieperliggende pagina’s om linkwaarde door te geven en het je gebruiker zo makkelijk mogelijk te maken om te navigeren binnen jouw website.
Ben jij klaar voor de mobile first index?
Je weet nu waar je rekening mee moet houden voor de mobile first index, is jouw website er klaar voor? Niet? De mobile first index gaat naar verwachting eind 2017 of begin 2018 live. Je hebt dus nog even, als je het zelf niet kan neem nu contact met ons op en wij helpen je graag om je website zichtbaar te maken in google. Voor maar 350 euro maken wij je hele website mobiel vriendelijk en vindbaar in Google. Aarzel niet en neem nu contact met ons op sales@webyours.nl of bel ons op 062 878 68 19
Wil je meer informatie, vul nu het formulier in!