Reszponzív weboldal : Vágási Feritől a mobile-first indexing térhódításáig

Ha online marketingben kevésbé járatos cégvezető, esetleg hagyományőrző marketinges vagy – aki eddig nem hallottál arról, hogy reszponzív weboldal – most hozzád szólok.

A reszponzív weboldal témakör mindenképpen megér egy misét, mert a jelek szerint még nem mindenkinek tiszta, hogy egyáltalán miről van szó. Lesz benne minden: Vágási Feri, Forbes Midas lista, mobile first indexing, átirányítás, mobilegeddon – és persze csajok.

Vágjunk bele!

A kezdetek: Vágási Feri beszáll…

Vágási Feri már 1996-ban összegyűjtötte a pénz és beszállt az internetbe.

Vágási Feri megelőzte a korát, mert hamar meglátta, hogy az internetbe korán be kell szállni. Azt viszont ő sem látta előre (és én sem), hogy a mobilos felhasználók szépen át fogják venni az uralmat a webdesign és keresőoptimalizálás felett.

Sok-sok évig elegendő volt úgy tervezni a weboldalakat, hogy abból indultunk ki, mindenki monitoron vagy laptopon fogja fogyasztani. Tényleg sokáig elég volt ez a kényelmes hozzáállás: 2009-ben csak 0.7% volt a mobilos forgalom részaránya a teljes internet forgalomból…

Visszagondolva: 2009-ben nehéz volt abban hinni, hogy a mobilos internetezés témából lesz valami. Nyilván tudni kellett volna, hogy nem lehet másféle a jövő – de akkor ez nekem tök elképzelhetetlen volt.

A kis mobilos internetezős mozgalom eljutott oda, hogy 2017-ben már a teljes internetes forgalom fele mobilon zajlott.

Forrás: https://www.broadbandsearch.net/blog/internet-statistics

Ilyen előzmények után szégyenletes, hogy én magam 2010 környékén – a webáruházam Analytics számait böngészve – azt mondtam, hogy a mobilos látogatókra még egy darabig nem fordítok különösebb figyelmet, mert az a nevetségesen kis számú mobilos látogató nem ér annyit, hogy érdemes legyen külön foglalkozni velük.

“… az a nevetségesen kis számú mobilos látogató nem ér annyit …” – az ilyen gondolatok miatt nem kerültem fel egyszer sem a Forbes Midas listájára…

Azóta eltelt közel 10 év és eljutottunk oda, hogy ma már élet-halál kérdés a weben a mobilos látogatók kiszolgálása. Az sem vitatéma már, hogy a keresőoptimalizálásban, a rangsorolásban kőkemény súllyal jelen van a mobilos használhatóság kérdése.

A Google webmestereknek szóló iránymutatásaiból egyértelműen kiderül, hogy azok a weboldalak tudnak jó helyen megjelenni a találati listában, amelyek jól kiszolgálják a mobilos látogatókat és gyorsan betöltődnek.

Van rendes, asztali gépen böngészhető weboldalam – az nem elég?

Nem.

Ha van olyan weboldalad, ami jól fogyasztható asztali gépről és laptopról, az csak annyit jelent, hogy ha valaki odatéved az oldaladra, kapsz tőle pár másodpercnyi esélyt, hogy “vevőt nevelj” belőle. Ez tök jó.

De itt van a nyakunkon 2020 és a potenciális vevőidnek már rendesen bele van nőve a kezükbe a telefonjuk – és ez most így is marad egy darabig. Biztos lehetsz benne, hogy az érdeklődőid, a potenciális vevőid éjjel-nappal a telefonnal a kezükben élik mindennapjaikat. Valamit mutatnod kell nekik, ha szeretnél a továbbiakban is érdeklődőket és vevőket.

Valamit kezdened kell azokkal, akik egy miniatűr mobilos kijelzőn nézik a weboldaladat…

Hogyan szolgáld ki a mobilos látogatókat?

A potenciális vevők kezében ott van a telefon. Mindig ott van. Most is. Cégvezetőként, marketingesként szükséged van rájuk, be kell ültetned őket a cirkuszod előadására.

Van weboldalad, ami 5 évvel ezelőtt készült, de azzal már nem tudod behozni őket, mert nem jó az oldalad. Kilóg a kijelzőből. Kicsik a betűk. Olvashatatlan az egész.

Itt van a kérdés az asztalon: mit kezdjünk azokkal, akik egy miniatűr mobilos kijelzőn nézik a weboldaladat? Mi lesz velük?

Erre a kérdésre sokáig ez volt a válasz : “nekik coki van.

Online marketingesek, akik kijöttünk a barlangból, rájöttünk, hogy elsősorban úgy szolgálhatjuk ki a mobilos látogatókat, ha nem kényszerítjük rájuk az asztali gépre (monitorra) tervezett weboldalunkat. Honnan tudjuk ezt?

Onnan, hogy ha mobilon megnyitunk egy weboldalt, aminek csak asztali verziója van, azt fogjuk látni, hogy rosszul néz ki. Nagyon rosszul.

A reszponzív weboldal vajon mi?

Azt is hamar észre fogjuk venni, hogy használhatósági szempontból szinte azonnal megbukik az oldal. Mit jelent az, hogy használhatósági szempontból megbukik egy weboldal?

Onnan tudod, hogy egy weboldal megbukik a használhatósági teszten, hogy hatalmába kerít ugyanaz az érzés, amikor csalódsz a plázacicában, akiről kiderül, hogy csak fekszik az ágyban, mint egy darab fa és semmit sem tudsz kezdeni vele azon kívül, hogy távolról nézegeted.

Gyakorlatban erről szól a dolog:

  • a tartalom szélesebb, mint a kijelző, ezért olvashatatlan a szöveges tartalom
  • a navigáció szétcsúszik, ezért nem tudsz navigálni a menüben
  • a képek “kilógnak” a kijelzőből, ezért fogalmad sincs mit akarnak mutatni neked a képen
  • a kattintható elemek túl kicsik / túl közel vannak egymáshoz, ezért használhatatlanok

reszponzív weboldal
reszponzív weboldal

Ha megnyitunk mobilon egy weboldalt és a fenti tüneteket észleljük, akkor biztosak lehetünk abban, hogy az adott weboldal beteg: csak asztali verziója van. A fenti tünetek egyértelműen abba az irányba mutatnak, hogy egy weboldal asztali verziója nem alkalmas mobilos böngészésre.

Azok a grafikai és tipográfiai megoldások, amelyek csodásan mutatnak egy 24 colos monitoron, használhatatlanná teszik a weboldalt, ha egy 5 colos mobil kijelzőjén nézzük.

Ha azt akarjuk, hogy mobilról is élmény legyen a weboldalunk böngészése – sőt vevőket is akarunk nevelni az érdeklődőkből, akkor a mobilosoknak egészen másként kell tálalni a weboldalunkat, mint az asztali gépes látogatóknak. Igazából ez már nem választási lehetőség. Csak ez az út van. Ha ezt a szempontot nem vesszük figyelembe, akkor elveszítjük a látogatóinkat és tutira rosszul fogunk szerepelni a keresőkben.

Csak akkor mobilbarát a weboldal, ha jól lehet használni mobilról

Most már biztosan tudjuk, hogy egészen másként kell tartalmat tálalni mobilon, mint monitoron. Nagyszerű gondolat, könnyű beleszeretni.

Felmerül a kérdés, hogy akkor most mit tegyünk, hogyan tovább…

m.valami.hu átirányítás helyett reszponzív weboldal
m.valami.hu átirányítás

Kezdetben vala az a megoldás, hogy észleltük, milyen típusú eszközről böngészik a weboldalunkat, és a nekik szánt weboldal verziót tálaltuk fel. Az asztali böngészéshez asztali verziót, a mobilos böngészéshez a mobilos verziót.

Gyakorlatban: ha észleljük, hogy mobilról böngészi az oldalt a látogató, akkor a valami.hu domainról átirányítjuk az m.valami.hu aldomainre és ott a kifjezetten nekik szánt weboldal verziót tálaljuk.

Ez a megoldás felvetett egy olyan igen kellemetlen problémát, hogy két weboldalt kell fenntartani, két weboldalon kell tálalni ugyanazt a tartalmat. Ennek a kétlaki életmódnak általában az lett a vége, hogy az asztali (valami.hu) weboldal verziót karbantartották, a mobilos (m.valami.hu) weboldalt pedig nem. Így zátonyra futottak sokan, akik ezzel az átirányításos verzióval dolgoztak.

Nem volt jó ez az átirányítós dolog. Rossz volt a megrendelőnek, rossz volt a látogatónak. Csak azért születtek ezek a megoldások, mert a webmesterek túl kényelemesek voltak. Nem akarták megtanulni, hogyan kell adaptálni a megjelenő tartalmat a kijelzőhöz.

Sokan voltak beleragadva ezekbe az átirányításos megoldásokba – mindkét oldalon.

Elkészültek a “dupla” weboldalak. A megrendelők úgy tudták, hogy most az online marketing élvonalába kerültek, mert van mobilos megjelenítésük…

A szolgáltatói oldal örült a dupla megbízásoknak és egyáltalán nem akarta megtanulni az új megoldást, a reszponzív webdesignt.

Az online marketing jeges vizébe merészkedő webfejlesztők számára igazi mentőöv volt a reszponzív webdesign (RWD) koncepció. Akik észrevették a mentőövet, megtanulták az új módszereket és elkezdtek modern weboldalakat készíteni.

Akiket nem érdekelt a mentőöv, azok zátonyra futottak.

2015. április 21. : a kijózanodás napja

Aztán jött 2015. Április 21., a Mobilegeddon néven elhíresült Google algoritmus-frissítés. A nem mobilbarát oldalak kaptak egy fájóan kellemetlen mértékű hátrasorolást a találati listában. Miért baj ez?

Mert sok céges weboldal esetében erősen lecsökkent a látogatottság – vagy teljesen eltűnt. Sokan csődbe mentek emiatt, szóval nem volt kellemes élmény azoknak, akik nem foglalkoztak a weboldaluk mobilos használhatóságával.

A Google időben szólt: ki akar a futóverseny felénél cementes zsákot kapni a nyakába?

Forrás: https://www.executionists.com/mobilegeddon-is-coming-is-your-website-prepared

Nem jelentkezett senki, ezért 2015.04.21.-én élesítette az algoritmus-frissítést, ami kiválasztotta, hogy kik lesznek azok, akik megnyerik a cementes zsákot a nyakukba…

Legyen reszponzív weboldal, oké?

A mobilegeddon volt a fordulópont, amikor egyértelművé vált a webdizájner szakmának is, hogy nem lehet tovább halogatni a tanulást. Meg kell tanulni olyan weboldalakat készíteni, ahol nem trükkös átirányításokkal, hanem reszponzív megjelenítéssel van biztosítva a tartalom optimális megjelenítése.

Reszponzív weboldal - nem bunkósbottal készül
Bunkósbottal nem készül reszponzív weboldal…

Gondolhatnánk, hogy ma minden weboldal reszponzív, mert már a külvilágtól elzártan, hideg barlangokban alkotó webmestereknek is világosság támadt a fejükben az elmúlt években, és rájöttek, hogy a mobilos látogatókat – és persze a megrendelőiket – reszponzív weboldallal kell kiszolgálniuk.

Nézzük meg, hogy konkrétan mi az, hogy reszponzív egy weboldal?

Alapvetően annyit jelent, hogy a weboldal optimálisan jeleníti meg a tartalmat

  • az asztali gépen böngészőknek is
  • a tableten böngészőknek is
  • a mobilon böngészőknek is

Mindezt úgy lehet elérni, hogy a tartalom megjelenítése “automatikusan” alkalmazkodik a böngésző eszköz megjelenítőjéhez. Ez nagyon jól hangzik, de hogyan alkalmazkodik egy weboldal a megjelenítőhöz, és hogyan lesz reszponzív a te weboldalad?

SEO hírek 2019.10.04. - reszponzív webdesign
Költői kép a reszponzív webdesign megértéséhez

Mitől és hogyan lesz reszponzív a weboldalam?

Elsősorban úgy lesz reszponzív a weboldalad, ha a webmesterednek szándékában áll megoldani ezt. Tehát akkor vagy jó kezekben weboldal fejlesztéskor, ha a weboldalad alkotója számít arra, hogy többféle megjelenítőn is fogják böngészni a weboldalt.

Nagyon jó, ha számít erre a webmester, de még jobb, ha ezt a gyakorlatba is átviszi ezt és úgy írja meg a kódot, hogy többféle kijelző méreten is jól használható legyen a weboldal.

Nyilván ma már van több jó megoldás erre, de mindegyiknek az a lényege, hogy a webmester (kézzel írt kóddal vagy akár keretrendszer használatával) megvalósítja, hogy optimális legyen

  • a navigáció / menürendszer megjelenítése
  • a szövegek megjelenítése
  • a képek megjelenítése
  • a hivatkozások megjelenítése
  • a kattintható elemek (gombok) megjelenítése

attól függetlenül, hogy éppen mobilon vagy asztali gépen vagy tableten nézi a látogató a weboldalt.

A gyakorlatban: a webmester kijön a barlangból és megoldja, hogy ne lógjon ki a kijelzőből menü, nagyobb legyen a betűméret, a navigációs menü mobilon hamburger-menüként jelenjen meg, stb.

Reszponzív weboldal - sokan még nem tudják mi az...
Ő reszponzív weboldalt készítene neked?

Ez nem rakétatudomány, simán meg lehet tanulni.

Nem voltam jó matekból. Számomra úgy kerek a világ, ha biztos vagyok benne, hogy a rakétatudományokat nem lehet megtanulni. Ezért is örülök, hogy egyáltalán nem kell foglalkozom rakétatudománnyal.

Mobile first indexing: nem lehet figyelmen kívül hagyni

2019. Július 1. óta már mobile first indexing van – tehát a Google már a feltérképezés során elsődleges szempontnak tekinti, hogy az adott weboldal a mobilos látogatottságot hogyan szolgálja ki. Ha sehogy nem szolgálja ki, akkor várakozhat a homokozóban arra, hogy indexelésre kerüljön…

Ha egy weboldal rosszul szolgálja ki a mobilos látogatókat – például m.valami.hu aldomainre irányítja át őket – akkor szintén számíthat arra, hogy ólómsúlyokat kap a lábára és úgy kell lépcsőznie a találati listán.

Ehhez nyilván elsőként a szolgáltatóknak (webfejlesztőknek, sitebuildereknek) kellett alkalmazkodni. Rendelkezésre állt jópár év – tehát azok a fejlesztők, akik nem voltak hibernálva az elmúlt pár évben, azok már megtanulták, hogyan kell kiszolgálni a mobilos látogatókat.

Reszponzív weboldal : ez ma már nem szolgáltatás, nem feature

A szolgáltatói oldalon személyes igényességtől függően – ki mélyebben, ki felületesebben – már szinte mindenki elsajátította, mi fán terem a reszponzív weboldal és hogyan kell ezt az egészet megoldani.

Akkor 2019-ben hogyan lehetnek még talpon olyan weboldal készítő cégek, akik kőbaltával faragott oldalakat adnak át gyanútlan megrendelőknek?

Úgy, hogy a megrendelő nem foglalkozik sem webdesign, sem online marketing kérdésekkel. Ő a cégével foglalkozik, aminek sokszor nem része, hogy foglalkozik online marketing témákkal. Csak akar egy új weboldalt, mert látja, hogy a céges oldala tényleg gáz.

Beírja a keresőbe, hogy weboldal készítés és kattint az első találatra – ami nyilván fizetett hirdetés lesz. Szerencse vagy balszerencse kérdése, hogy éppen profikat fog ki a gyanútlan érdeklődő, vagy kóklereket.

Lehet, hogy szerencsés napja van a megrendelőnek és jó kezekbe kerül. De az is lehet, hogy elkerüli a szerencse és kóklerekbe fut bele, akik leígérik a csillagok az égről – aztán átadnak egy csillogó masnival átkötött szemétkupacot az ügyfélnek.

Nem kell több “ajánlott felbontás” – weboldal. Nem kell több sötét m.valami.hu átirányítás. Legyen világosság. Legyen reszponzív a weboldalad.

Én azt mondom, hogy 2015 után, a Google Mobilegeddon óta már senki nem adhat ki a kezéből nem reszponzív weboldalt. Akkor sem, ha a megrendelőnek fogalma sincs arról, mit jelent ez. Akkor sem, ha megrendelőnek nincs mobilja és sosem jön rá, hogy mobilon használhatatlan a weboldala.

Nem kell egyedül megoldanod!

Megrendelőként akkor járhatsz jól, ha legalább alapszinten képbe kerülsz azzal kapcsolatban, hogy merre hány méter az online térben. Mondjuk kezdésként iratkozz fel a blog-értesítőnkre…

Ha zsömlét veszel a boltban, nyilván nem érdekel, hogy milyen lisztkeverékből készült és ki sütötte azt a zsömlét. De ha a céged online marketingjéről van szó, akkor potenciális megrendelőként érdemes felcsipegetned némi alaptudást arról, hogy mi újság van online marketing témában manapság.

Nem kell megtanulnod a szakmát, nem kell egyedül megoldanod. Vannak sokan, akik megtanulták és jól csinálják az online marketinget.

Egy kis tájékozódás tényleg hasznos, mielőtt kinyitod a pénztárcád. Ha legalább tudod, merről fúj a szél, akkor nagyobb esélyed van arra, hogy nem fogod meginni a levét…

Kérülj képbe azonnal: add meg az email címed és rendszeresen elküldjük neked az online marketing és keresőoptimalizálás legfrissebb trendjeiről szóló cikkeket!

nova idea marketing
keresőoptimalizálás blog

a cikk szerzője: Nagy Gábor

Nagy Gábor digitális marketing szakértő, keresőoptimalizálás specialista. 2007 óta foglalkozik online marketinggel és keresőoptimalizálással. Hazai vállalkozásoknak segít abban, hogy elérjék üzleti céljaikat a digitális marketing segítségével.

Szólj hozzá!