Kapcsolatok

Ha a Google azt írja, hogy „Az oldal nincs mobileszközökre optimalizálva. Mobiloptimalizálás ellenőrzése. Google Search Console A Google teszt megkerülése a MobileCheat segítségével

A webhely mobil verziójának hibakeresése egyszerű feladat. Felelősség a keresőoptimalizálóért. A webhely optimalizált verziója a webhelydokumentumok rangsorolási tényezője.

Mobilwebhely-eszközök

Hogyan ellenőrizheti a webhely mobil verzióját.

Az oldalt mobileszközökre a következő szolgáltatások segítségével ellenőrizheti:

  • Google mobilbarát
  • Google PageSpeed ​​​​Insights;
  • weboldal teszt;
  • szitalégy;
  • weboldal teszt;
  • BrowserStack.

Mobilbarát

A Mobile-Friendly nevű szolgáltatás megmutatja, hogyan van optimalizálva az oldal mobileszközökre, és milyen hibák vannak az optimalizálás terén:

PageSpeed ​​​​Insights

A webhely mobil verzióját a Google alatt is ellenőrizheti a Google keresőmotorjának egyik eszközével, amely megjelenik.

A szolgáltatást egyszerűen PageSpeed ​​​​Insightsnak hívják.

weblap teszt

Helyes lenne ellenőrizni a webhely betöltését különböző eszközökön és különböző régiókban. A WebPage Test segítségével ellenőrizheti.

A szolgáltatás teljesen ingyenes.

ScreenFly

Egy speciális mobilfejlesztési eszköz segítségével ellenőrizheti, hogyan jelenik meg az oldal. A szolgáltatást úgy alakították ki, hogy az oldalt abban a formában tekintsék meg, ahogyan mobileszközökön is megjelenik, de a probléma megoldásához elegendő egy böngésző használata.

Az eszköz ingyenes.

Adobe Edge Inspect

Ha van egy eszközpark a webhely ellenőrzésére, használhat eszközöket. Az oldal betöltése minden eszközön eltart egy ideig, de a feladat megoldva.

Ha egy speciálisan létrehozott alkalmazást használ a webhely megnyitásához különböző eszközökön, az Adobe Edge Inspect nevű alkalmazást, a feladat leegyszerűsödik.

Az eszköz ingyenes.

Az alkalmazás többplatformos.

BrowserStack

A BrowserStack jól ismert szolgáltatás a weboldal-fejlesztők körében. A szolgáltatás megmutatja az oldal kompatibilitását valós eszközökön.

Az eszköz fizetős.

Bing mobilteszt

Ellenőrizze ingyenes a mobileszközök követelményeinek való megfelelést biztosító oldal a Bing keresőmotor Mobile Test eszközén keresztül lehetséges.
Szolgáltatás link -

Szép napot mindenkinek, barátaimnak és blogom vendégeinek. A mai cikkem meglehetősen rövid lesz, de nem veszíti el a relevanciáját. Mégpedig egy olyan dologról szeretnék mesélni, hogy a google ellenőrzi az oldal mobil verzióját. És talán nem is írnék ilyen nyilvánvaló cikket, ha ez a csekk mostanában nem zavart volna.

Ellenőrzés a google-val

Korábban az emberek nem foglalkoztak a reszponzív dizájnnal vagy a mobil verzióval. De aztán, amikor megjelent az információ, hogy a keresők leminősítik azokat az oldalakat, amelyeknek nem volt mobil verziója, az emberek megfeszültek (mint a HTTPS esetében). Az emberek azonnal elkezdtek mobilverziókat rendelni szabadúszóktól, néhányan speciális bővítményeket telepítettek, amelyek ferdén működtek.

Így amikor valaki adaptív elrendezést vagy mobilverziót szerzett be, azonnal leellenőrizte egy speciális Google szolgáltatásban, amely csak azt nézi meg, hogy az elrendezése hogyan felel meg a követelményeknek. Most egy kicsit változott a felület, de a lényeg ugyanaz marad.

Ahhoz, hogy saját maga ellenőrizhesse ezt az esetet, el kell mennie ehhez a szolgáltatáshoz - search.google.com/search-console/mobile-friendly. Ezután az URL-sávba írja be a webhely címét, és várjon. Rövid idő elteltével minden információt megkap arról, hogy webhelye megfelel-e a Google mobil elrendezésre vonatkozó követelményeinek.

Nem ertem...

Tökéletesen tudom, hogy az oldalam adaptált, főleg, hogy nemrég javítottam ki az elrendezést. Nemrég azonban szórakozásból elmentem ebbe a szolgálatba, hogy megnézzem, mit fog szólni az öreg Gosha, és nagyon meglepődtem. A helyzet az, hogy a szolgáltatás azt mondta nekem, hogy a blogomat soha nem alakították át, és rosszul olvasható mobileszközökön.

Nem értettem, mi a baj, ezért elkezdtem megoldást keresni az interneten. És ezen az oldalon találtam. Kiderült, hogy az egész a robots.txt fájlban volt. Nekem fekete-fehérre írták, hogy a keresők ne indexeljék a téma fájljaimat, ezért nem látott mobil verziót sem.

Miután eltávolítottam egy sort a robotokról ( Disallow: /wp-content/themes/my theme), akkor a szolgáltatás azonnal megállapította, hogy a mobil verzióm normális. Szóval ne aggódj, ha veled is megtörténik ugyanez. Valószínűleg egyszerűen nem engedélyezte a Google-nak, hogy indexelje a témáját.

Nos, ezzel valószínűleg befejezem mai cikkemet. Remélem hasznos volt számodra. Amint látod A google mobilwebhely-ellenőrzője segítségével láthatja, hogy a webhely megfelel-e a webhely követelményeinek. Valójában azonban ritkán találni olyan oldalt, amely ne rendelkezik saját mobilverzióval vagy alkalmazkodóképességgel. Még egy kis idő eltelik, és minden újonnan létrehozott webhely automatikusan SSL-tanúsítvánnyal rendelkezik.

Köszönöm, hogy olvastál. Biztosan várlak még titeket blogom oldalain. Addig is javaslom, hogy olvasson el más cikkeket. Biztos vagyok benne, hogy sok érdekes dolgot fog találni magadnak. Sok szerencsét. Viszlát!

Üdvözlettel: Dmitrij Kostin.

A webhelyverziók nem csak a fejlesztők lehetséges szeszélyei, további kiadási tételek (vagy bevételek, ha vállalkozókról beszélünk), és az erőforrás-látogatók aggodalmának megnyilvánulása. A Google legfrissebb bejelentése szerint a reszponzív tervezési követelményeket nem teljesítő oldalak pesszimázni fognak a mobilos keresésekben. A hazai Yandex kereső is kiadott „A mobilitás fontossága” című ajánlást, és biztosította, hogy a mobileszköz-felhasználók kényelmét szolgálva a keresési eredmények között megjelöli a mobil verziókat, és előnyben részesíti az adaptív oldalakat.

Tehát a fejlesztőknek szükségszerűen hozzá kell igazítaniuk a webhelyeket az okostelefonokhoz, és ellenőrizniük kell az erőforrás megjelenítésének helyességét. Ellenkező esetben hamarosan a forgalom jelentős részének, így a potenciális ügyfelek elvesztésére lehet számítani, mert a Google és a Yandex új munkaalgoritmusai már érvényben vannak. A webhely mobil verzióját többféleképpen ellenőrizheti: a böngésző megváltoztatásával fejlesztői módba váltáskor, mobileszköz-emulátorok vagy webszolgáltatások használatával.

Webhelybarát mobileszközökhöz

A mobileszközökhöz való alkalmazkodóképességet különféle paraméterek alapján értékelik. Fontos, hogy az oldal mobil verzióját ne csak a helyes megjelenítés szempontjából ellenőrizzük, érdemes más tényezőket is figyelembe venni:

  • animáció, "nehéz" dizájn és képek hiánya;
  • erőforrás betöltési sebesség (minimálisnak kell lennie);
  • nincs szükség vízszintes görgetésre;
  • a Silverlight bővítmények és a Java kisalkalmazások hiánya;
  • egyszerű navigáció a webhelyen;
  • A nézetablak metatagja be van írva a kódba.

Ha ezek a feltételek teljesülnek, a legelterjedtebb keresőmotorok algoritmusai a weboldalt mobil eszközökre alkalmasnak ismerik fel, és növelik az oldal pozícióját a keresési eredmények között a nem adaptált erőforrásokhoz képest.

Valódi tesztelés mobileszközökön

A legkényelmesebb az oldal mobil verzióját valódi okostelefonokon tesztelni. Ez a módszer lehetővé teszi a valós körülmények közötti tesztelést. Ideális esetben jobb, ha több eszközön ellenőriz egy webes erőforrást, de ha a projekt költségvetése nem tartalmazza a legnépszerűbb modellek több okostelefonjának vásárlásának költségét, akkor elegendő egy Android vagy Apple eszköz.

A böngészőablak átméretezése

A legegyszerűbb, de az ellenőrzés szempontjából nem optimális a böngészőablak átméretezése. Ha az oldal technológiával készült, akkor így ellenőrizheti az oldal mobil verzióját. De olyan esetekben, amikor külön tervezést alkalmaznak, az erőforrásnak egyértelműen jeleznie kell, hogy a felhasználó okostelefonról, táblagépről vagy más mobileszközről érkezett. Tehát ez a módszer lehetővé teszi, hogy ellenőrizze a webhely mobil verziójának elérhetőségét. De a kijelző helyességét (technikai értelemben) valószínűleg nem fogják értékelni.

Váltás fejlesztői módra a böngészőben

Az oldal mobilverziójának ellenőrzésére (a Google vagy a Yandex, valamint más keresők a legfontosabb rangsorolást befolyásoló tényezők közül az alkalmazkodóképességet emelik ki) optimálisabb módja, ha a böngészőben fejlesztői módra váltunk. A módszer több böngészővel is hasonlóan működik:

  • Mozilla: a "Fejlesztés" menüben a "Reszponzív tervezés" opció kiválasztásával válthat fejlesztői módba; a Ctrl + Shift + M kombináció megnyomásával; a webfejlesztői eszköztár "Reszponzív tervezési mód" gombjára kattintva;
  • Chrome: váltson mobil módba az F12 billentyű lenyomásával, majd válassza ki a mobilverzió ikont (okostelefon a megjelenő ablak bal felső sarkában).

Az Operában a fejlesztői módba váltás a mobilverzió ellenőrzéséhez a Ctrl + Shift + i kombináció megnyomásával történik, de van más mód is. A böngésző speciális verziója - az Opera Mobile Classic Emulator - lehetővé teszi a mobil tervezés átfogó értékelését. A programnak vannak verziói a főbb operációs rendszerekhez.

Mobileszköz-emulátorok: Android Studio és Apple Xcode

A webhely mobil verzióját ("Yandex" és Google) ellenőrizheti mobileszköz-emulátorok segítségével, amelyek Android és Apple esetében Android Studio vagy Apple Xcode.

Az ilyen eszközök meglehetősen pontosan reprodukálják az oldalt, ahogyan az mobileszközökön fog kinézni: a mobileszközökhöz készült böngészők leggyakoribb verziói előre telepítve vannak a programokban. Az emulátorok azonban nem veszik figyelembe a letöltési sebességet és néhány más, valós körülmények között megfigyelhető árnyalatot.

Az ellenőrzéshez csak telepítse a fenti programok egyikét a számítógépére, és nyissa meg a webhelyet az emulátorból.

Mobile Design Validation Web Services

Vannak egyszerűbb módszerek is a webhely mobil verziójának ellenőrzésére. Például a Responsinator online szolgáltatás lehetővé teszi egy erőforrás mobileszközökön való megjelenítésének helyességének, valamint a webhely felhasználó általi könnyű használatának értékelését. Az erőforrás úgy jeleníti meg a webhelyet, ahogyan hat különböző Android- vagy Apple-eszközön nézne ki, és többféle tájolásban.

Weboldalak mobileszközökre való optimalizálásának ellenőrzése

Az egyéb források, amelyek lehetővé teszik a webhely mobil verziójának ellenőrzését, emellett értékelik az alkalmazkodóképességet, és nem csak azt mutatják meg, hogyan nézne ki a webhely különböző eszközökön. A leghitelesebb szolgáltatások: Google Mobile Friendly és "Yandex Webmaster" (weboldalak ellenőrzése). A Bing-ellenőrző vagy például a W3C Mobile Checker-je is értékeli az oldal mobileszközökre való optimalizálását.

A webmestertől mindössze annyit kell tennie, hogy kiértékeli a webhely online szolgáltatásokat használó mobileszközökre vonatkozó verzióját, csak írja be az erőforrás címét, és várja meg az elemzés befejezését. A legtöbb fenti szolgáltatás ellenőrzi az optimalizálást a fent felsorolt ​​mobilbarátsági paraméterek alapján.

Tehát többféleképpen is értékelhető egy webes erőforrás alkalmazkodóképessége: a valódi okostelefonokon, táblagépeken vagy más mobileszközökön való teszteléstől vagy a webböngészőablak átméretezéséig, az emulátorok bejelentkezéséig vagy a webböngésző fejlesztői módjáig, és befejezve a szolgáltatások igénybevételét Yandex és Google. Az oldal mobil verziójának átfogó ellenőrzése nagyon egyszerű, és ez lehetővé teszi a szükséges változtatások elvégzését és az oldal pozíciójának javítását a keresési eredmények között.

A projektjeinél valószínűleg már régen észrevette, hogy a mobilfelhasználók száma folyamatosan növekszik. Egyesek számára ez a tendencia kevésbé észrevehető, és egyes projekteknél ez a szám évente kétszeresére vagy többszörösére nő. A LiveInternet szerint az orosz internet forgalmának több mint 50%-a mobileszközökről érkezik. Egyébként ennek a blognak sok olvasója régóta panaszkodik, hogy nincs mobil verzió 🙂 amit természetesen a közeljövőben javítanak.

A mozgósításnak ezt a tényét a keresőplatformok sem hagyhatják figyelmen kívül. Fokozatosan előnyöket biztosítanak a mobilkeresésben azoknak az oldalaknak, amelyek a felhasználói eszközökhöz vannak igazítva.

A Google eleinte kivonatokban jelölte meg a webhelyeket, hogy helyesen jelenjenek meg a mobiltelefonokon.

A Google egy olyan eszközt is készített, amely segít a webmestereknek ellenőrizni a webhely helyes megjelenését mobileszközökön:
https://www.google.com/webmasters/tools/mobile-friendly/

Április 21-én a Google elindított egy új algoritmust, nyugaton Mobilegeddon néven. Most a Mobilbarát teszt sikeres kitöltése a Google által figyelembe vett seo tényezők egyike. Egyelőre nem történt jelentős változás a kibocsátásban, de most már lehet készülni.

Hogyan lehet egy weboldalt reszponzívvá tenni a Google szerint? A titok egyszerű – meg kell határoznia egy feladatot a programozóinak / elrendezéstervezőinek. Nos, ha nincs idő várni, akkor ... használhatja a MobileCheat-et 🙂

Valójában ez egy nem tesztelt technológia, nem tudni, hogy a jövőben mihez vezet, ezért csak saját veszélyére és kockázatára használja. Itt legalább egy tesztsorozat elvégezhető.

A Google teszt megkerülése a MobileCheat segítségével

Csak két dolgot kell tenned:

1. Adja hozzá a nézetablak metacímkéjét a kódhoz.

2. Zárja be a robotok hozzáférését a CSS-fájlokhoz vagy a mappához, ahol azok találhatók a robots.txt fájlon keresztül

Például a blogom így megy át az alapértelmezett teszten:

A CSS bezárásakor a kép megváltozik:

Úgy tűnik, semmi sem változott az oldalon, de a teszteredmények teljesen mások. Egyébként egyes oldalakon szeretem kikapcsolni a CSS-t, hogy kényelmesebb legyen a megtekintés és a használat 🙂 ezért teljesen indokolt séma. De ez csak tájékoztatási célokat szolgál.

Mit gondolsz erről? A Google ezt kölcsönös lovaglépésnek számítja, vagy előre átgondolja, és azonnal sakkmatikus lesz az oldal? 🙂

Ma már senkit sem kell meggyőzni arról, hogy szükség van a webhely mobil verziójára. Hiszen napról napra egyre több látogató érkezik okostelefonról és táblagépről. E cikk írásakor a blogom látogatóinak körülbelül 20%-a használ mobil eszközöket a böngészéshez. Vagyis minden ötödik telefonról vagy táblagépről keresi fel az oldalamat.

Néhány évvel ezelőtt még nem is gondoltam ilyen látogatókra, de amikor számuk meghaladta a 10%-ot, elkezdtem adaptív elrendezést használni. Ez lehetővé tette a tartalom helyes megjelenítését mobileszközökön, és növelte a látogatók és a keresőmotorok lojalitását az oldalhoz.

Az oldal mobil verziója és az adaptív dizájn nem ugyanaz. Ez a cikk az adaptív elrendezés tesztelésére összpontosít, amikor a webhely kialakítása a látogató eszközének képernyőfelbontásától függően változik.

Ahhoz, hogy megbizonyosodjon arról, hogy webhelye megfelelően jelenik meg a mobileszközökön, ellenőriznie kell, és ehhez számos hasznos szolgáltatás és eszköz áll rendelkezésre.

Az adaptív elrendezés gyors ellenőrzése

Népszerű internetböngésző (böngésző) Mozilla Firefox beépített eszközzel van felszerelve, amellyel ellenőrizhető a webhely kialakítása, hogy alkalmas-e a mobileszközökön való megjelenítésre. Használatához lépjen a "Menü" - "Fejlesztés" - "Adaptív tervezés" menüpontra. Vagy csak nyomjon meg egyszerre három billentyűt a billentyűzeten ++[M]

Valami ilyesmit kellene látnod:


A képernyő felbontásának és tájolásának módosításával ellenőrizheti, hogyan jelenik meg webhelye a mobil látogatók számára.

Google böngésző Króm beépített támogatással is rendelkezik a webhelyterv alkalmazkodóképességének ellenőrzéséhez. Ehhez lépjen a menübe, válassza ki a "További eszközök", majd a "Fejlesztői eszközök" elemet (vagy nyomja meg a gombot ).

Ezután nyomja meg a reszponzív tervezés ikont (vagy egyidejűleg nyomja meg a billentyűzetet ++[M]):

A képernyő közepén láthatja, hogyan fog megjelenni webhelye a mobileszközök képernyőjén:

Mobil tervezés SEO tesztelése

Mint ismeretes, a két világkereső vezető Google-nak és a Yandexnek megvan a maga szerénytelen véleménye arról, hogyan nézzen ki az oldal a mobilkészülékek képernyőjén. És ha a webhelyet kényelmetlennek találják a mobilos látogatók számára, akkor az lekerül a keresési eredmények között. SEO szempontból tehát, ha nem akarod elveszíteni a mobilos látogatókat, akkor ne csak reszponzív dizájn legyen, hanem a keresőknek is reszponzívnak, azaz mobilbarátnak kell tekintened.

A Google szolgáltatással való alkalmazkodóképesség ellenőrzéséhez lépjen a következő címre, és adja meg webhelye nevét: https://www.google.com/webmasters/tools/mobile-friendly/.

Így néz ki a blogom ellenőrzésének eredménye:

A Yandex esetében ez egy kicsit bonyolultabb; az ellenőrzéshez regisztrálnia kell a Yandex.Webmaster szolgáltatásban, és használnia kell a felület béta verzióját:

Online szolgáltatások az alkalmazkodóképesség ellenőrzésére

Ezeknek a szolgáltatásoknak a fő feladata, hogy bemutassák (megmutassák), hogyan fog kinézni webhelye mobileszközön. Nagyon sok webhely van ilyen funkcióval. Csak néhányat idézek belőlük. A legtöbb esetben megismétlik a FireFox és a Chrome beépített funkcióit.

Google átméretező

Újra a Google-lal kezdem, amely saját alkalmazkodóképességi bemutató szolgáltatással rendelkezik: http://design.google.com/resizer/#

Quirktools screenfly

A második jó szolgáltatás a http://quirktools.com/screenfly/. Megmutatja, hogyan nézhet ki webhelye még a tévében is!

Symby.ru adaptest

Nos, annak érdekében, hogy ne sértsem meg a „hazai gyártót”, adok egy példát egy másik webhelyről: http://symby.ru/adaptest/. Egy oldalon egyszerre több nézetet láthat különböző képernyőfelbontással.

Az oldal mobil verziójának sebessége

Miután meggyőződött arról, hogy webhelye reszponzív, és megfelelően jelenik meg a legtöbb eszköz képernyőjén, ellenőrizze a munka sebességét. Ismét a mobil látogatókkal kapcsolatban.

PageSpeed ​​​​Insights

A Google mindig a görbe előtt jár: https://developers.google.com/speed/pagespeed/insights/ . Ez a szolgáltatás megmutatja, hogyan néz ki a webhely a telefon képernyőjén, és javaslatokat ad a kód optimalizálására a mobileszközök letöltési sebességének növelése érdekében.

Weboldalteszt

Végezetül mondok egy példát egy olyan szolgáltatásra, amely nemcsak azt mutatja meg, hogyan néz ki az oldal egy mobileszközön, hanem megmutatja a munka sebességét is: http://www.webpagetest.org/

következtetéseket

Véleményem szerint a mindennapi munkában, az oldal dizájnjának változtatásakor könnyebben használhatók a FireFox és Chrome böngészők beépített funkciói. Ezt követően természetesen ellenőriznie kell a keresőmotorok hűségét a tervezéshez. És csak ezután használhatja az online szolgáltatásokat a lélek megnyugtatására vagy a dicsekedésre.



Tetszett a cikk? Oszd meg