Googlova storitev za preverjanje mobilne različice. Če Google pravi: »Ta stran ni optimizirana za mobilne naprave. Emulatorji mobilnih naprav: Android Studio in Apple Xcode

Dober dan prijatelji. Danes se bom malo odmaknil od oglaševalskih orodij in začel novo rubriko na blogu. Imenuje se "Webmastering" in bo vključeval uporabna gradiva za izboljšanje učinkovitosti in kakovosti spletnega mesta, ciljnih strani. Začel bom s pregledom kul orodja za preverjanje mobilnosti spletne strani.

Preverjanje hitrosti spletnega mesta z Googlom

Google ponuja 2 orodji za to.

# 1 PageSpeed Insights

Mislim, da ga dobro poznaš. Vstavite povezavo do svojega spletnega mesta, pritisnite gumb "Analiziraj" in dobite rezultat v obliki dveh zavihkov.

Zavihek "Za mobilne naprave" vključuje poročilo o hitrosti nalaganja spletnega mesta za mobilne naprave in - pomembno! - ocena priročnosti spletno mesto za pametne telefone. Zavihek "Za računalnike" je enaka analiza za namizje.

Najboljši del je, da vam storitev omogoča prenos optimizirano slike, css in skripte za uporabo na vašem spletnem mestu. Tukaj je taka brezplačno pomoč iz Googla.

Kot lahko vidite iz posnetka zaslona, imam resne težave z mobilno različico. kako si?

# 2 Testmysite.Withgoogle

Pravzaprav je to isto orodje, le ima čudovit ovoj. Pred dnevi sem odkril to storitev in bil podkupljen z obrazcem za prijavo.

Ko vstavite povezavo do spletnega mesta in kliknete »Preveri«, bo storitev ponudila rezultat v obliki polnopravne dinamične ciljne strani, na kateri vam bo jedrnato in prepričljivo povedala, kako je s spletnim mestom in ponudila prenesite celotno poročilo.

Seveda sem zahteval celotno poročilo in ga v nekaj minutah prejel po pošti. Izgleda smiselno, več zaslonov uporabnih navodil s povezavami do določenih materialov:

Omeniti velja, da če analizirate isto spletno mesto, se bodo številke za ta orodja nekoliko razlikovale. Vendar pa delajo na isti tehnologiji.

Tako lahko v samo nekaj sekundah ne samo preverite mobilnost spletnega mesta in preverite hitrost nalaganja – ampak tudi prenesete popolno poročilo z optimizirano vsebino. Je brezplačen. Iz Googla

No, kako ste z mobilnostjo?

Različice spletnih mest niso le možna muha razvijalcev, dodatna postavka stroškov (ali zaslužka, če govorimo o izvajalcih) in manifestacija skrbi za obiskovalce vira. Po zadnjih izjavah predstavnikov korporacije Google bodo spletna mesta, ki ne ustrezajo zahtevam odzivnega dizajna, pesimizirana pri iskanju, ki se izvaja iz mobilnih naprav. Domači iskalnik Yandex je izdal tudi priporočila "Kako pomembno je biti mobilni" in zagotovil, da bo zaradi udobja uporabnikov mobilnih naprav označil mobilne različice v rezultatih iskanja in dal prednost prilagodljivim stranem.

Torej morajo razvijalci nujno prilagoditi spletna mesta za pametne telefone in preveriti uporabnost prikaza virov. V nasprotnem primeru lahko v bližnji prihodnosti pričakujete izgubo pomembnega dela prometa in s tem potencialnih strank, saj so novi algoritmi dela Googla in Yandexa že v veljavi. Lahko preverite mobilno različico spletnega mesta različne poti: s spremembo brskalnika ob preklopu v način razvijalca, z uporabo emulatorjev mobilnih naprav ali spletnih storitev.

Prijaznost do spletnih mest za mobilne naprave

Prilagodljivost mobilnim napravam se ocenjuje glede na različne parametre. Pomembno je, da preverite mobilno različico spletnega mesta ne le v smislu pravilnega prikaza, vredno je upoštevati tudi druge dejavnike:

pomanjkanje animacije, "težka" zasnova in slike;
hitrost nalaganja virov (mora biti minimalna);
ni potrebe po vodoravnem pomikanju;
pomanjkanje vtičnikov Silverlight in programčkov Java;
enostavna navigacija po spletnem mestu;
koda vsebuje metaoznako viewport.

Če so navedeni pogoji izpolnjeni, algoritmi najpogostejših iskalnikov prepoznajo spletno stran kot primerno za mobilne naprave in povečajo položaj strani v rezultatih iskanja glede na neprilagojene vire.

Pravo testiranje na mobilnih napravah

Najbolj priročen način je preizkus mobilne različice spletnega mesta na pravih pametnih telefonih. Ta metoda bo omogočila testiranje v realnih pogojih. V idealnem primeru je bolje preveriti spletni vir na več napravah, če pa proračun projekta ne vključuje stroškov nakupa več pametnih telefonov najbolj priljubljenih modelov, bo zadostovala naprava Android ali Apple.

Spreminjanje velikosti okna brskalnika

Najpreprostejša, vendar ne optimalna v smislu preverjanja veljavnosti, je sprememba velikosti okna brskalnika. Če je stran izdelana s tehnologijo, lahko na ta način preverite mobilno različico spletnega mesta. Toda v primerih, ko se uporablja ločen dizajn, vir potrebuje jasno navedbo, da je uporabnik prišel s pametnega telefona, tablice ali druge mobilne naprave. torej Na ta način omogoča preverjanje razpoložljivosti mobilne različice spletnega mesta. Toda pravilnost prikaza (v tehničnem smislu) verjetno ne bo ocenjena.

Preklop v način razvijalca v brskalniku

Najboljši način za preverjanje mobilne različice spletnega mesta (Google ali Yandex, pa tudi drugi iskalniki poudarjajo prilagodljivost na seznamu najpomembnejših dejavnikov, ki vplivajo na uvrstitev) je, da v brskalniku preklopite na način razvijalca. Metoda deluje na podoben način z več brskalniki:

Mozilla: v način razvijalca lahko preklopite tako, da izberete možnost »Odzivno oblikovanje« v meniju »Razvoj«; pritiskanje kombinacija Ctrl+ Shift + M; s klikom na gumb "Odzivni način oblikovanja" v orodni vrstici spletnega razvijalca;
Chrome: preklopite v mobilni način s pritiskom na F12, nato izberite ikono mobilne različice (pametni telefon v zgornjem levem kotu okna, ki se prikaže).

V Operi lahko preklopite v način razvijalca, da preverite mobilno različico, tako da pritisnete Ctrl + Shift + i, vendar obstaja še en način. Posebna različica brskalnika - Opera Mobile Classic Emulator - vam omogoča ocenjevanje mobilnega oblikovanja na več načinov. Različice programa obstajajo za glavne operacijske sisteme.

Emulatorji mobilnih naprav: Android Studio in Apple Xcode

Mobilno različico spletnega mesta (Yandex in Google) lahko preverite s pomočjo emulatorjev mobilnih naprav, ki so za Android in Apple Android Studio oziroma Apple Xcode.

Takšna orodja precej natančno reproducirajo spletno mesto, kot bo videti na mobilnih napravah: programi so vnaprej nameščeni z najpogostejšimi različicami brskalnikov za mobilne naprave. Vendar emulatorji ne upoštevajo hitrosti prenosa in nekaterih drugih odtenkov, ki jih je mogoče opaziti v realnih pogojih.

Če želite to preveriti, preprosto namestite enega od zgornjih programov v računalnik in odprite spletno mesto iz emulatorja.

Spletne storitve za validacijo mobilnega dizajna

Obstaja več preproste načine preverite mobilno različico spletnega mesta. Na primer, spletna storitev Responsinator vam omogoča, da ocenite pravilnost prikaza vira na mobilnih napravah in enostavnost uporabe spletnega mesta s strani uporabnika. Vir prikazuje spletno mesto, kot bi bilo videti v šestih različne naprave temelji na Androidu ali Appleu in v več usmeritvah.

Preverjanje optimizacije spletnih strani za mobilne naprave

Drugi viri, ki omogočajo preverjanje mobilne različice spletnega mesta, dodatno ocenjujejo prilagodljivost in ne prikazujejo le, kako bi spletno mesto izgledalo na različnih napravah. Najbolj ugledni storitvi sta Google Mobile Friendly in Yandex WebMaster (preverjanje spletnih strani). Bingov pregledovalnik ali na primer W3C Mobile Checker ocenjujeta tudi optimizacijo spletnega mesta za mobilne naprave.

Vse, kar je potrebno od spletnega skrbnika pri ocenjevanju različice spletnega mesta za mobilne naprave z uporabo spletnih storitev, je, da vnese naslov vira in počaka, da se analiza zaključi. Večina zgornjih storitev testira optimizacije za parametre prijaznosti do mobilnih naprav, ki so navedeni zgoraj.

Torej lahko ocenite prilagodljivost spletnega vira na več načinov: od testiranja na resničnih pametnih telefonih, tablicah ali drugih mobilnih napravah ali spreminjanja velikosti okna spletnega brskalnika, preverjanja v emulatorjih ali v načinu razvijalca spletnega brskalnika in konča z uporabo storitve Yandex in Google. Mobilno različico spletnega mesta je zelo enostavno preveriti izčrpno, kar vam bo omogočilo, da naredite potrebne spremembe in izboljšate položaj spletnega mesta v rezultatih iskanja.

Obstaja taka stvar, Google bo kmalu (po govoricah - od 21. aprila 2015) začel zelo slabo uvrščati spletna mesta, ki niso prestala preverjanja pri Googlovih spletnih skrbnikih za lažji ogled na mobilnih napravah.

Ni natančno jasno, spletno mesto bo imelo težave le, če bo prikazano mobilnim uporabnikom ali celo tistim, ki so se prijavili iz osebnega računalnika, torej bo ločeno vprašanje?

V bistvu se to skoraj ne spremeni za spletna mesta, ki imajo polovico ali pomemben del prometa iz mobilnih naprav. Zato je bolje opraviti test čim prej.

Povedal vam bom, kako to storiti:

Prej	Po

Prvi kos, kar je pomagalo rešiti težavo brez dodatnih potez.

V robots.txt dodajte vrstico:
Dovoli: /wp-content/themes/ Ime_predloge/style.css

(Če se datoteka s slogi nahaja na drugem naslovu, jo napišite. Če je datotek s slogi več, vstavite vrstice za vsako datoteko.)

Drugi trenutek, če vidimo sporočilo " Interaktivni elementi so preblizu drug drugemu." Prikazano na google.com/webmasters/tools/mobile-friendly.
Samo v slogih zahtevani razred predpisuje več alinej za povezave in gumbe. Zgrabi rob ali odmik od 5px.
Včasih lahko blok Adsense povzroči takšno težavo. Morda morate vstaviti večji blok ali z večjo pisavo.

P.S. Na začetku pričakujem, da ste primarno opravili vi.

Eh, spet nas Google "razveseljuje" s svojimi pravili in algoritmi, ki prihaja z novimi "migrenami" za spletne skrbnike. Tokrat se nam ponuja, da preizkusimo nov algoritem, prijazen do mobilnih naprav, ki bo prikazal prilagojena spletna mesta v mobilnem iskanju in nižje »nemobilne« vire.

Kako bo vse to delovalo?

Zelo preprosto: vsa spletna mesta, ki niso prijazna do mobilnih naprav (po mnenju Googla), bodo preprosto prezrta iskalnik in prikazano v mobilnem iskanju na zadnjih mestih, mobilni viri pa se bodo dvignili višje. Na primer, če obstaja več spletnih mest s podobno temo, bo uporabnik na tabličnem računalniku našel tista, ki imajo prilagojeno zasnovo za ogled na mobilnih napravah.

Moji vtisi o tej inovaciji so dvojni: po eni strani je vse pravilno, če uporabljam iskanje na tablici ali pametnem telefonu, potem želim v SERP videti tista spletna mesta, ki se pravilno obnašajo na zaslonu. Po drugi strani pa je algoritem za določanje "mobilnosti" tako nenavaden, da človek razmišlja o smotrnosti takšnega "know-howa". Seveda sem na svojih spletnih mestih preveril priporočila in ugotovil, da je milo rečeno čudno vedenje Googla pri razčlenjevanju virov.

Vredno je reči, da sem pri ustvarjanju spletnih mest vedno preverjal videz na raznih napravah ročno in preko storitev, tako da sem bil glede "mobilnosti" miren, a se je izkazalo, da ni tako preprosto. Google torej priporoča, da svoje vire preizkusite s testom, prijaznim do mobilnih naprav:

Samo vnesite naslov spletnega mesta ali strani in kliknite »Analiziraj«. Med preverjanjem glavne strani spletnega mesta mojega krimskega prijatelja krimeo.ru s testom sem videl, da je stran optimizirana za mobilne naprave.

Ni presenetljivo, da je predloga odzivna in spletno mesto izgleda odlično različne naprave... Potem sem se odločil preveriti svoje spletno mesto in kaj je bilo moje presenečenje, ko ta vir ni prestal testa.

Zanimivo ... predloga tega bloga je tudi odzivna, večkrat sem dostopal tako s tablice kot s pametnega telefona ... zakaj potem Googlu ni bila všeč?

Začel sem analizirati, kaj točno na spletnem mestu bi lahko izzvalo takšen rezultat. Rešitev je bila najdena tam, kjer sem to najmanj pričakoval: na mojem spletnem mestu so bile sličice člankov prikazane v pravokotniku 720x350px in zaradi tega (po Googlovem mnenju) stran ne velja za mobilno. Presenetljivo je, da večja kot je slika (gumbi), uporabnikom iz mobilnih naprav je lažje udariti s prstom ... a Google misli drugače.

Presenetljivo je tudi, da so pri brskanju po spletnem mestu s pametnim telefonom vse slike popolnoma prilagojene velikosti zaslona in ni opaziti nobenih "podbojov". No, odločil sem se za eksperiment in prilagodil velikost slik, tj. manjša kot je velikost zaslona naprave, manjša je slika na spletnem mestu. Poskusite z miško zgrabiti vogal brskalnika in ga pomanjšati.
Zdaj imajo nekateri spletni skrbniki morda drugačno težavo: če bi se Google tako obnašal s sličicami velika številka, kar pomeni, da bo pri ilustracijah k člankom situacija enaka, to pa je veliko bolj pomembno kot domača stran... Če želite to narediti, morate narediti slike prilagodljive za celotno spletno mesto z uporabo sredstev za zagon js-scripta, vendar to še ni vse, mapa predpomnilnika in pravilo za shranjevanje slik morata biti podvojena v .htaccess

Dejansko članki, ki vsebujejo slike velike velikosti, ne prestanejo Googlovega testa, tisti z manjšimi ilustracijami pa veljajo za popolnoma optimizirane za mobilne naprave. Ne bom dal posnetkov zaslona - samo vzemite URL ločene publikacije in ga preverite za "mobilnost".

Zakaj sicer Googlebot vidi, da spletni dnevnik ni optimiziran za mobilne naprave

Ker je v datoteki robots.txt veliko nepotrebnih omejitev.

V samodejno ustvarjeni datoteki WordPress virtual robots.txt je samo ena omejitev:

Onemogoči: / wp-admin

In tukaj Google piše o tem, zakaj so ustvarjalci WordPressa naredili robots.txt takole privzeto:

Če želite zagotoviti pravilno indeksiranje in upodabljanje strani, morate Googlebotu omogočiti dostop do JavaScript, CSS in grafične datoteke na strani. Googlebot bi moral videti vaše spletno mesto kot običajen uporabnik. Če datoteka robots.txt zavrne dostop do teh virov, Google ne bo mogel pravilno analizirati in indeksirati vsebine. To lahko poslabša uvrstitev vašega spletnega mesta pri iskanju.

User-agent: * Disallow: / wp-admin Disallow: / wp-includes Disallow: / wp-content / plugins Host: Your_site Sitemap: http: // Your_site / sitemap_index.xml (Sitemap by WordPress SEO by Yoast) User -agent : Googlebot-Image Allow: / wp-content / uploads / User-agent: YandexImages Allow: / wp-content / uploads /

Upam, da bo Google izboljšal svoj algoritem preverjanja in dal resnične rezultate, saj v resničnem življenju na tablicah in pametnih telefonih veliko spletnih mest izgleda odlično.

Tako presenečenje v obliki mobilnega prijaznega algoritma lahko vidimo od 21. aprila 2015. Google nas "razvaja")). Ali živite v miru? Tukaj je Panda za vas! malo? Tukaj je tudi pingvin! Pošlji stran? Bodite prijazni do mobilnih naprav!

Izhod

Sami se odločite, kaj boste s temi podatki naredili, ali boste prešli na odzivne oblike ali ne, je osebna stvar vsakega skrbnika spletnih mest, vendar so ta nova pravila že začela veljati.

Mimogrede, "optimizirano za mobilne naprave" ni le odzivna zasnova spletnega mesta, tukaj sta primerna tudi ločena mobilna različica in vtičnik za WordPress, glavna stvar je, da spletno mesto izgleda pravilno na kateri koli napravi. Upoštevajte to.

Za svoje projekte ste verjetno že zdavnaj opazili, da št mobilnih uporabnikov nenehno raste. Pri nekaterih je trend manj opazen, pri nekaterih projektih pa se ta številka vsako leto podvoji ali več. Po podatkih LiveInternet več kot 50% prometa na Runetu predstavljajo mobilne naprave. Mimogrede, mnogi bralci tega bloga se že dolgo pritožujejo, da tukaj ni mobilne različice 🙂, kar bo seveda v bližnji prihodnosti popravljeno.

Tega dejstva mobilizacije ne morejo prezreti niti iskalne platforme. Postopoma dajejo prednosti pri mobilnem iskanju tistim stranem, ki so prilagojena napravam uporabnikov.

Sprva je Google označil mesta v izrezkih, ki bi jih pravilno prikazali na mobilnih telefonih.

Prav tako je Google ustvaril orodje, ki pomaga spletnim skrbnikom preveriti pravilnost prikaza spletnega mesta na mobilnih napravah:
https://www.google.com/webmasters/tools/mobile-friendly/

21. aprila je Google na zahodu predstavil nov algoritem z imenom Mobilegeddon. Zdaj uspešno opravljen test Mobile Friendly je eden od dejavnikov SEO, ki jih upošteva Google. Do zdaj v SERP ni bilo večjih sprememb, lahko pa se pripravite zdaj.

Kako naredite svoje spletno mesto odzivno za Google? Skrivnost je preprosta - za svoje programerje / oblikovalce postavitve morate postaviti nalogo. No, če ni časa za čakanje, potem ... lahko uporabite MobileCheat 🙂

Pravzaprav je to nepreizkušena tehnologija, ni znano, do česa bo pripeljala v prihodnosti, zato jo uporabljajte le na lastno nevarnost in tveganje. Tukaj je mogoče opraviti vsaj vrsto testov.

Kako zaobiti Googlov test z MobileCheat

Narediti je treba le dve stvari:

1. Kodi dodajte metaoznako viewport.

2. Zaprite robotski dostop do datotek CSS ali mape, kjer se nahajajo, prek robots.txt

Tako na primer moj blog opravi privzeti test:

Ko je CSS zaprt, se slika spremeni:

Zdi se, da se na spletnem mestu ni nič spremenilo, vendar so rezultati testov popolnoma drugačni. Mimogrede, na nekaterih spletnih mestih tudi sam rad onemogočim CSS, tako da jih je bolj priročno gledati in uporabljati 🙂 zato je to povsem upravičena shema. Vendar je predstavljen samo v informativne namene.

Kaj mislis o tem? Bo Google to štel kot protipotezo z vitezom ali je vse premislil vnaprej in bo spletno mesto takoj postavil v šah in mat? 🙂