2. A kereső a felhasználókért
10.000 rangsorolási tényező
Panda, Penguin, Pigeon, Hummingbird algoritmusok
Gépi tanulás, mesterséges intelligencia (RankBrain)
Performancia és felhasználói élmény
3. Keresőoptimalizálás
SEO
Organikus forgalom növelése
Konverziós arány javítása
Gyors és jól használható webhely megteremtése
PPC kampányokat is javíthatja
Search Engine helyett Search Experience Optimization
6. Webhely gyorsítás előnyei
Pozitív hatás az organikus helyezésekre
Javítja a felhasználói élményt
Csökkenti a szerver költségeket
Több időt töltenek el a látogatók
Csökken a visszafordulási arány
Növekszik a konverziós ráta
8. Mobilos látogatók
Elvárják a desktopos sebességet
Többségnek már volt problémája a
mobil oldalak elérésével
A lassú betöltési idő az egyik fő
probléma
Lassú oldalakra nem szeretnek
visszatérni
9. 1 másodperc lassulás mobilon
9,4%-kal csökkenti az
oldalmegtekintéseket
8,3%-kal növeli a
visszafordulási arányt
3,5%-kal csökkenti a
konverziós arányt
Forrás: Google Developers
Instant Mobile Websites
15. Átlagos betöltési idő
2015-ben 5-7 másodperc volt
Google: 1 másodperc legyen a látható tartalom rendelése
Forrás: Google Chrome DevTools, 4G, Android
Mobil sebességteszt (2016-03-01)
JavaScripttel JavaScript nélkül
Méret (MB) Betöltés (s) Méret (MB) Betöltés (s)
index.hu 7,6 15,97 4,3 10,93
origo.hu 7,9 16,50 3,3 6,74
444.hu 15,1 31,74 12,4 25,64
24.hu 3,8 12,36 2,5 5,31
vs.hu 5,5 11,02 2,2 5,18
16. Miért lassú a mobilnet?
Wifi ≈ 0,3 s
30 Mbit/s
4G ≈ 2 s
4 Mbit/s
3G ≈ 8 s
1 Mbit/s
2G ≈ 18 s
0,45 Mbit/s
1 MB
adatforgalom
17. A mobil sebesség 4 szabálya
Céloldali átirányítások elkerülése
Szerver válaszidő csökkentése
200 ms alatt legyen
Blokkoló források eltávolítása
A megjelenítést gátló JavaScript
és CSS kizárása a hajtás feletti
tartalomban
Látható tartalom priorizálása
23. Accelerated Mobile Pages
Gyorsított mobil oldalak projekt
2015. október 7-én indult
Már létező és elterjedt webes
megoldásokon nyugszik
Nyílt forráskódú, platform független
Webes framework
Statikus tartalom kiszolgálás
Számos kiadó, tartalomszolgáltató és
CMS támogatja
AMP
26. Gyorsított mobil oldalak
A Google támogatja az
AMP-ot
Csak mobil kereséseknél
jelenik meg
Carousel lapozó normál
Google találatok felett
Organikus forgalom-
növekedés
27. Miért gyors az AMP?
Önmegtartóztatásra kényszeríti az oldalakat
Mellőzi a technológiákat, amelyek lassítják az oldalt
Csak aszinkron szkripteket engedélyez
Layout megtartása külső forrásoktól függetlenül
Külső elemek nem blokkolják a betöltést
Inline CSS, max. 50 kB mérettel
Tartalom kap prioritást a betöltés során
Rich content beágyazható
28. Hirdetések, mérhetőség, SEO
Hirdetések sandboxolt
iframe-ben
Számos már támogatott
ad network
Google Analytics követés
implementálható
Search Console-ban
hibák megjelenítése
AMP HTML specifikáció
Validitásra ügyelni kell
link rel=”amphtml” és
canonical
30. Facebook Instant Articles
Facebookon belüli
gyors hírolvasást tesz
lehetővé
Lassú mobilinternetre
nyújt megoldást
Megjelenő cikkek
kontrollálhatósága
Nyílt dokumentáció az
adaptációhoz
31. Facebook Instant Articles
Hirdetések közvetlen
értékesíthetősége
Multimédiás eszközök
dinamikus és interaktív
sztorik gyártásához
2016 áprilisában lesz
elérhető
Köszöntök mindenkit! Bublik Máté vagyok a Mindshare SEO specialistája.
A teljesítmény és a keresőoptimalizálás összefüggéseiről fogok beszélni előadásom során.
A kereső szimbiózisra törekszik a felhasználók és a webhelyek között.
Az algoritmusok egyrészt a manipulatív beavatkozásokat hivatottak megelőzni, ilyenek például a gyenge minőségű, csak a keresőrobotok számára létrehozott tartalom, vagy akár a mesterséges linkek.
A Google a lokális keresésekre is választ kíván adni, valamint már a kontextust is értelmezi.
Mindezt egyre inkább automatizált, öntanuló módon.
Továbbá mindinkább előtérbe kerül a felhasználói élmény.
A SEO célja a non-branded organikus forgalom folyamatos növelése és a konverziós arány optimalizálása.
Az átalakítással a cél a felhasználók számára gyors és jól használható site megalkotása.
Ez a PPC kampányokat is javíthatja, gondoljunk csak az AdWords minőségi mutatóra, ahol a céloldallal kapcsolatos élmény komoly tényező.
Egy szóval egyre inkább keresőélmény optimalizálássá válik át a folyamat, a keresőmotorra optimalizálás helyett.
Nagyon leegyszerűsítve a legfontosabb SEO tényezők: a tartalom, a struktúra, a tekintély és a viselkedés.
Számít a tartalom minősége és relevanciája, a webhely felépítése, információs architektúra és HTML kód szinten egyaránt.
A hitelességet erősítik a hivatkozások és a közösségi szignálok.
Ugyanígy fontos a látogatók viselkedése, felhasználói élmény és a teljesítmény is.
Maga a felhasználói élmény rengeteg összetevőből áll. Ilyenek a használhatóság, ergonómia, vagy maga a felhasználói felület, de például az akadálymentesség is.
Én most csak a performanciáról és a sebességről fogok beszélni.
Maga a webhely gyorsítás előnyös a SEO-ra, fokozza a felhasználói élményt, és a kisebb adatforgalom csökkenti a szerver költségeket.
Az optimalizálás hatására több oldalt tekintenek meg a látogatók, csökken a visszafordulási arány és javul a konverziós ráta.
Azt gondolhatnánk hogy elegendő a mobilbarát webhelyhez a mobiloptimalizált reszponzív, vagy adaptív megjelenés.
De nem szabad elfeledkezni az oldalbetöltési időről sem.
A mobilon böngészők elvárják az asztali gépen tapasztalt sebességet.
Gyakori probléma a mobil oldalak elérése során a betöltési idő.
A lassú oldalakra nem szeretnek visszatérni a rossz felhasználói élmény miatt.
1 másodperc lassulás mobilon majdnem 10%-kal csökkenti az oldalmegtekintéseket és hasonló módon növeli a visszafordulási arányt, valamint több mint 3%-kal csökkenti a konverziós arányt.
Az ecommerce oldalak esetében ez jelentős bevételkieséssel járhat.
A kérdés tehát, hogy mi okozza a fő problémát?
Az elhízó és lassú weboldalak
Egy átlagos weboldal betöltéséhez 2,2 MB adatforgalom szükséges.
Ez 15% növekedés az előző évhez képest.
Nagyrészt a képek és a szkriptek okozzák a méret növekedést.
Ha megnézzük, akkor látható, hogy 2011 óta közel négyszeresére, 2013 óta pedig majdnem duplájára nőttek a webhelyek méretei.
Míg a HTML kód és a CSS nem nőtt szignifikánsan, addig a JavaScript és a képek mérete nagyot nőtt.
Ezért is fontos a reszponzív, vagy adaptív képek használata, hiszen mobilon nem szükséges letölteni hatalmas full HD képeket, hanem azok kisebb verziói is tökéletesen megfelelőek.
Tavaly 5 másodperc volt az átlagos betöltési idő, a Google szerint 2 másodperc alatt kellene lennie.
Mobilon 7 mp az átlagos betöltési idő
Készítettem egy sebességtesztet pár hazai hírportálról és bekapcsolt szkriptekkel az Origo lett az első, míg kikapcsolt JavaScripttel a vs.hu.
Fontos figyelembe venni, hogy míg egy wifis kapcsolat 30 Mbit/s kapacitású, addig egy 4G-s mobilnet kapcsolat 4, a 3G-s 1 és a 2G-s 0,45 Mb/s sebességre képes.
1 MB adatforgalom így jócskán eltérő ideig tart a különböző mobil hálózatokon.
A mobil sebesség optimalizálás 4 legfontosabb szabálya
200 ms alatt legyen a Time To First Byte (TTFB) azaz a szerver válaszidő.
Mobilon hajtás felett 1 mp megjelenés szükséges
Ne legyenek blokkoló források, amik késleltetik az oldalrenderelést és a betöltést.
A megjelenést gátló JavaScript és CSS legyen kizárva a hajtás feletti tartalomban, ami elsőre megjelenik a mobil eszközön görgetés nélkül.
A JavaScript esetében pedig fontos az aszinkron és defer attribútumok használata, amelyek nem blokkolják a betöltést.
Ha tesztelni akarjuk a sebességet akkor arra az egyik legegyszerűbb mód a Google Chrome böngészőben a F12 billentyűvel elérhető fejlesztői eszköz.
A Google saját teszteszköze a PageSpeed Insights, amely konkrét javaslatokat nyújt a sebességoptimalizáláshoz, valamint a felhasználói élményhez.
Szintén Google eszköz a Search Console (régi nevén Webmaster Tools), ahol a feltérképezi statisztikák riportban elérhető az oldalak betöltési ideje, grafikonon ábrázolva 90 napig visszamenőleg.
Néhány további hasznos és ingyenesen is használható diagnosztikai eszköz, amelyek különböző részletességű riportokat mutatnak meg.
Egy webhely optimalizálásának hatása: a szerverválasz 6-ről 0,15 másodpercre csökkent és a betöltési idő 11-től 3-ra.
Tavaly októberben elindult a gyorsított mobil oldalak projekt, főképp a Google támogatásával, amelynek célja a mobil oldalak sokkal gyorsabb betöltése.
Nem technológiai újdonság, hanem elterjedt megoldásokon alapul.
Webes keretrendszer, open-source, eszköz független kezdeményezés,
Fontos megemlíteni, hogy egyelőre csak statikus oldalak, cikkek, video site-okhoz használható, m-commerce webes alkalmazásokhoz nem.
Számos kiadó, tartalomszolgáltató és CMS már most támogatja.
Így néz ki a Google találati listában közvetlenül megjelenített AMP cikk a hír jellegű keresésnél.
Az AMP csak mobilon releváns.
Hír jellegű kereséseknél lapozó jelenik meg a normál Google találatok felett.
Organikus forgalomnövekedést hozhat februártól.
A gyorsaság abból fakad, hogy mellőzi a megoldásokat, amik lassítják az oldalt.
Korlátozások vannak a JavaScript és a CSS stíluslap esetében.
Tartalom kap prioritást a betöltés során.
A hirdetések miatt sem kell aggódni
Támogatott már például az AdSense és a DoubleClick
Analytics követés megoldott
Search Console-ban hibák nyomon követhetők
Fontos a validáció
Meta tagekkel le kell kezelni a különböző verziók közötti kapcsolatot
A Facebook is előrukkolt egy saját megoldással: Instant Articles néven.
Ez viszont a Facebook platformon belül hagyja a látogatókat.
Lassú mobilneten keresztül is gyors cikkolvasást tesz lehetővé.
A cikkek teljes kontrollhatóságával
Itt is lesznek hirdetések
HTML5 alapon multimédiás eszközöket nyújt a beágyazható rich contenthez
2016 tavaszától lesz elérhető mindenki számára