Thursday, 30 April 2026

A reszponzív weboldal rejtett hibái

Janka péntek délután nyitja meg a céges oldalt a telefonján. Először semmi különöset nem vesz észre – az oldal betölt, a logó rendesen jelenik meg. Aztán megpróbál a menüre kattintani.
A navigáció nem görget.
Próbálja újra. Ugyanaz. Lecsúszik a képernyő szélére a „Kapcsolat" feliratú gomb, és bármennyire is érinti a kijelzőt, semmi nem történik. Visszamegy a laptophoz, ugyanazon az oldalon minden tökéletesen működik. Az asztali nézet rendezett, profi, kattintható. A telefonos nézet egy másik valóság.
Másnap reggel megnyitja a Google Search Console-t. A „Mobile Usability" sor pirossal világít. Három hibaüzenet, két figyelmeztetés. Janka már látott ilyet korábban – de sosem tudta, ezek közül melyik az, ami tényleg rontja a rangsorolást, és melyik csak technikai „zaj".
Ez a helyzet ismerős. Nem a weboldalával van alapvetően baj, az működik. Csak nem ott működik, ahol a látogatók valójában jelen vannak: a telefonjukon.
2026-ra a magyar webes forgalom több mint kétharmada mobileszközről érkezik, így a reszponzív kialakítás már nem opció, hanem a Google mobile-first indexelésének alapfeltétele. Nem kiegészítő funkció, hanem belépési küszöb – és a leggyakoribb SEO hibák éppen ott keletkeznek, ahol a fejlesztő az asztali nézetet rendezte, a telefonosat meg „majd úgyis működik" alapon hagyta.

TL;DR – ha csak ennyit olvasol el
A reszponzivitás olyan weboldal-kialakítás, amely eszközmérettől függetlenül használható felületet biztosít. Nem külön mobilverzió és nem tükrözött oldal – egyetlen kódbázis, amely automatikusan alkalmazkodik a képernyőhöz. A gyakori SEO hibák között 2026-ban a legkomolyabb következménnyel a mobilbarát kialakítás hiányosságai járnak: a Google mobile-first indexelése miatt a keresőmotor kizárólag a mobilnézetet veszi figyelembe a rangsorolásnál. A magyar webes forgalom 60–70 százaléka mobileszközről érkezik, a Core Web Vitals mérőszámok – LCP, INP, CLS – pedig közvetlen rangsorolási tényezők. Ez azt jelenti, hogy a reszponzív weboldal hibái ma nagyobb súlyúak, mint egy rosszul megfogalmazott meta description vagy egy elmaradt alt-tag. A diagnózis első lépése: a Google Search Console mobilhasználhatósági jelentése.

Egy kifejezés, ami 2010-ben jelent meg – és ma alapkövetelmény
A „responsive web design" fogalmát Ethan Marcotte vezette be 2010-ben egy szakmai cikkben, amikor a mobilos böngészés még kísérleti fázisban volt. Tizenhat évvel később ez már nem trend. Ez az infrastruktúra.

Amit a monitor nem mutat meg
Van egy elterjedt tévhit ezzel kapcsolatban.
Ha a WordPress sablon leírásában az áll, hogy „reszponzív", az oldalad automatikusan mobilbarát. Ez igaz – de csak a keretre. A sablon reszponzivitása nem jelenti azt, hogy az egyedi elemek – az általad feltöltött képek, a beépített foglalási űrlap, a slide-show plugin – szintén megfelelően viselkednek kisebb képernyőn. A sablont ellenőrzik, a tartalmat nem.
A reszponzivitás olyan weboldal-kialakítás, amely a képernyőmérethez automatikusan igazodik. Jellemzően HTML és CSS alapú megoldás, JavaScript-támogatással. Fő előnye, hogy egyetlen kódbázis kiszolgálja a mobilt, a tabletet és az asztali gépet egyaránt – de csak akkor, ha ezt a kódbázist eleve reszponzívan építik fel, nem utólag próbálják azzá tenni.
Ez a különbség.
Az egyik irányból nézve: a weboldalad asztali gépen tökéletesen néz ki, a fejlesztő megmutatta, az ügynökség jóváhagyta, te elégedett voltál. A másik irányból: a Google csak a mobilverziót nézi. Ha asztali nézetben van egy 3000 szavas szakmai cikked, amit mobilon részben elrejtettek – mert a fejlesztő „fölöslegesnek" ítélte a hosszú szöveget kis képernyőn –, a Google szemében az a cikk 800 szavas. Nem a desktop változat számít. Soha.
Ahogy a budapesti belvárosi kisvállalkozások egyre inkább online rendelésre és foglalásra épülnek, úgy nő annak tétje, hogy mobilon hogyan viselkedik az oldal. A H1/H2 hierarchia, a belső linkelés és a meta title mind fontos – de ha a mobilos felhasználó nem tudja elolvasni a tartalmat, mert a betűméret apró, vagy nem tudja megnyomni a gombot, mert az túl közel van a szomszéd elemhez, akkor a legjobb kulcsszó-elhelyezés is elvész.
Mi okozza a legtöbb problémát a mobilra optimalizált kialakításnál?
A Google Search Console „Mobile Usability" jelentésében három hiba jelenik meg rendszeresen. A „clickable elements too close together" – egymáshoz túl közel elhelyezett kattintható elemek – és a „viewport not set" – hiányzó vagy hibás viewport meta tag – kritikus hibák: ezek közvetlenül rontják a rangsorolást. A „text too small to read" már másodlagos: bosszantó, de nem azonnal halálos. A prioritási sorrend nem véletlenszerű, hanem a Core Web Vitals és a mobilhasználhatósági algoritmus súlyozásán alapul. Ha korlátozott fejlesztési kapacitásod van, először a viewport és az elemtávolság megy, utána a betűméret.
A reszponzív fejlesztéshez hozzáféréseket kérünk – admin, FTP, Search Console – és 1-2 körben tartalmi jóváhagyás szükséges. Átlagosan 2-4 hét, a projekt méretétől függően. Akkor éri meg a teljes reszponzív újratervezés, ha a havi forgalmad legalább 500–1000 látogató, és ebből mérhetően nagy rész mobilról érkezik. Alkalmi, néhány látogatós B2B oldalaknál a teljes újrafejlesztés túlzó beruházás – célzott javítás is elég lehet.

A sebesség, amit nem látsz
Tudom, ezt senki nem szereti hallani, de a legtöbb „SEO-audit" sablonjelentés elsiklik efölött – mert a kézi mobiltesztelés időbe kerül, a generált riportnak pedig nem.
A mobilos betöltési sebesség az egyik legsúlyosabb, mégis legkevésbé látható hibaforrás. A probléma mechanizmusa egyszerű: a fejlesztő feltölt egy 2400 pixel széles termékkép-fájlt, mert asztali nézetben gyönyörűen néz ki. Mobilon ugyanez a fájl letöltődik teljes méretben, majd a böngésző lekicsinyíti. A felhasználó 5-6 másodpercet vár. Aztán bezárja az oldalt.
A megoldás – a srcset attribútum és a picture HTML elem használata – nem fejlesztői luxus. Ez SEO-alapfeltétel. Az eszközspecifikus képméretezés beállítása után a betöltési idő az LCP mérőszámban (Largest Contentful Paint) mérhető javulást hoz, ami a PageSpeed Insights és a Google rangsorolás szempontjából is közvetlen hatású.
Amit sokan nem tudnak: a Google mobilbarát tesztje „passed" eredményt adhat olyan oldalakra is, amelyek valójában használhatatlanok mobilon. A teszt csak a kritikus, strukturális hibákat nézi – nem helyettesíti a tényleges, kézi tesztelést.
A magyar webes forgalom 60–70 százaléka 2026-ban mobileszközről érkezik. Ez azért fontos, mert a Google kizárólag a mobilverziót indexeli – ha az hiányos, az asztali verzió rangsorolási szempontból nem számít.

Ha az oldalad havi 50 látogatót hoz, és ebből kettő konvertál, a reszponzív újratervezés nem térül meg rövid távon – előbb a forgalomnöveléssel érdemes foglalkozni. Ez nem öngól, hanem reális prioritás.

Két eset, ami közelebb van, mint gondolnád
Egy szentendrei kerámiaműhely webshopján a termékképek mobilon nem töltődtek be megfelelően. Az oldal technikai szempontból „mobilbarát" volt – a sablon reszponzív, a viewport beállítva. A hiba a feltöltött képek méretében rejlett: minden egyes termékfotó 3–4 MB, asztali optimalizálásra feltöltve. Mobilon a betöltési idő 7 másodperc fölé ment. A bounce rate 84 százalék volt – szinte mindenki azonnal elhagyta az oldalt. Az srcset beállítása és a képek átméretezése után ez 3 másodpercre csökkent, a kilépési arány pedig 61 százalékra esett vissza. Nem varázslat. Technikai alapfeltétel.
Egy ráckevei cukrászda rendelési oldalán a „megrendelem" gomb kicsúszott a képernyő aljára kisebb telefonokon, és részben a böngésző eszközsávja takarta. Kattintani lehetett rá, de csak ügyeskedve. A havi rendelések több mint fele mobilról érkezett – pontosabban, nem érkezett, mert a látogatók egy része feladta a folyamatot. Ez a klasszikus „clickable elements too close" és viewport-elrendezési hiba, amit a Google Search Console jelzett, de a tulajdonos nem tudta értelmezni a riportot.
Ezek nem szélsőséges esetek. Budapesti és Pest megyei KKV-k között jellemző, hogy az oldal látszólag működik, de a mobilhasználat statisztikái azt mutatják: a látogatók gyorsan mennek el. A reszponzív weboldal karbantartása nem egyszeri feladat.

Mi a legnagyobb SEO hiba a mobilbarát kialakításnál 2026-ban?
A legnagyobb hiba, ha a mobilverzió tartalma eltér a desktopétól. A Google mobile-first indexelése kizárólag a mobilon látható tartalmat veszi figyelembe. Ha az asztali oldalon részletes leírás van, amit mobilon elrejtenek, a keresőmotor azt nem látja. Ugyanilyen súlyos a túl közel helyezett kattintható elemek problémája – ez nemcsak felhasználói élmény kérdése, hanem közvetlen rangsorolási tényező. A viewport meta tag hiánya vagy rossz beállítása azonnali indexelési problémát okoz. A képek kliensoldali méretezése a mobilos betöltési időt megtöbbszörözheti. A reszponzivitás hibái ma már nagyobb súlyúak, mint a klasszikus on-page SEO elemek – köztük az alt-tag vagy az URL-struktúra.
Hogyan ellenőrizhetem, hogy a weboldalam mobilbarát-e?
Először nyisd meg az oldalt a telefonodon, és navigálj úgy, mint egy ügyfél – keress, kattints, töltsd ki az űrlapot. A Google Search Console mobilhasználhatósági jelentése listázza a kritikus hibákat prioritás szerint. A PageSpeed Insights eszköz külön értékelést ad mobilra és asztali nézetre, a Core Web Vitals három mérőszámával: LCP, INP és CLS. A valódi ellenőrzés manuális: minden oldaltípust – kezdőlap, termék, kapcsolat, kosár – külön tesztelj. Az adaptív weboldal viselkedését több képernyőméreten érdemes átnézni, nem csak a saját telefonodon.
A mobile-first indexelés után a következő lépés már látható: a Core Web Vitals súlya folyamatosan nő, a vizuális stabilitás (CLS) és az interaktivitás (INP) mérése egyre szigorúbb lesz. Aki most rendezi a reszponzivitást, előnybe kerül azzal szemben, aki majd akkor kezdi el, ha a rangsorolási veszteség már nyilvánvaló.

Mielőtt feltételezed, hogy rendben van
Van egy ellenérv, amit sokan felhoznak: „Az én ügyfeleim asztali gépről rendelnek, nálam más a célcsoport." Ez fair megközelítés – és van benne igazság. Egyes B2B szegmensekben valóban magasabb az asztali forgalom aránya.
De van egy pont, ahol ez a logika megbicsaklik.
A Google nem az ügyfeled szokásai alapján rangsorol. A mobile-first indexelés azt jelenti, hogy a keresőmotor a weboldal asztali verzióját szinte figyelmen kívül hagyja az indexeléskor. Ha a mobilos megjelenítés hibás, az a rangsorolásban jelenik meg – akkor is, ha a tényleges vásárlóid laptopot használnak. Janka helyzete nem azért volt probléma, mert a vásárlók mobilon rendeltek. Azért volt probléma, mert a Google mobilon látta az oldalt.
A csapatunk munkája során az egyik legtöbbször visszatérő megállapítás pontosan ez: nem az ügyfélszerzési csatorna dönti el, hogy kell-e reszponzív kialakítás, hanem az indexelési logika.
Megnézted már a saját oldaladat a telefonodon – vagy csak feltételezed, hogy rendben van? Nem elvont kérdés. Nyisd meg, görgess végig, próbálj meg valami olyat csinálni, amit egy látogató csinálna. Ha ez után is marad kérdés, egy kötelezettségmentes mobilbarát gyorsellenőrzést kérhetsz visszajelzésként – nem ajánlatot, csak egy tényleírást arról, mi látszik.

No comments:

Post a Comment

Note: only a member of this blog may post a comment.