Daudzās valstīs viedtālruņus biežāk izmanto, lai sērfotu internetā, nevis datoros. Tāpēc ir ļoti svarīgi padarīt vietni draudzīgu mobilajām ierīcēm. Uzziniet, vai jūsu lapas ir ērtas viedtālruņu lietotājiem, izmantojot īpašu rīku Search Console.
Izmantojot
Ir viegli pārbaudīt, vai lapu ir ērti apskatīt viedtālrunī: vienkārši norādiet pilnu tās URL. Pārbaude parasti aizņem mazāk nekā minūti. Ja lapā ir novirzīšanas gadījumi, tie tiks apstrādāti arī.
Pamatojoties uz pārbaudes rezultātiem, jūs redzēsiet, kā lapa izskatās viedtālrunī, un uzzināsiet, kādas problēmas var rasties, to apskatot. Visbiežāk tie ir mazi drukāti (grūti lasāmi uz maza ekrāna) un Flash elementi (netiek atbalstīti lielākajā daļā mobilo ierīču).
Skatsporta metataga vērtība nav iestatīta
Lapas kods nenorāda skata objekta rekvizītu, kas pārlūkam norāda, kā pareizi mainīt lapas elementu izmērus, lai tie atbilstu ierīces ekrāna izmēram. Lai jūsu vietne tiktu rādīta pareizi dažādos ekrāna izmēros, pielāgojiet skata punktu, izmantojot skata porta metatagu. Sīkāku informāciju par to skatiet mūsu rokasgrāmatas sadaļā Reaģējošie tīmekļa dizaina pamati.
Skatsporta metatagam ir jābūt ierīces platumam
Lapu nav iespējams pielāgot dažāda lieluma ekrāniem, jo \u200b\u200bskata objekta īpašums ar fiksētu platumu ir norādīts tā kodā. Šajā gadījumā jums jāpielieto adaptīvs dizains, pielāgojot lapas mērogošanu atbilstoši ekrānam.
Saturs ir platāks par ekrānu
Šajā pārskatā ir identificētas lapas, kurām nepieciešama horizontāla ritināšana, lai skatītu tekstu un attēlus. Šī problēma rodas, ja CSS stilos ir iestatītas absolūtās vērtības vai tiek izmantoti attēli, kas paredzēti konkrētam pārlūkprogrammas loga platumam. Pārliecinieties, ka CSS elementu platums un pozicionēšanas vērtības ir relatīvas un attēli ir mērogoti. Lai iegūtu sīkāku informāciju, skatiet mūsu apmācības sadaļu Viewport satura izmēri.
Pārāk mazs drukājums
Šajā pārskatā ir uzskaitītas lapas ar mazu druku, kuru lasīšanai lietotājiem jāizmanto tālummaiņas žesti. Pēc skata punkta iestatīšanas jums jānosaka fontu lielumi, lai tie tajā pareizi parādītos.
Interaktīvie elementi ir pārāk tuvu
Šajā pārskatā ir uzskaitītas lapas, kurās navigācijas vienumi atrodas tik tuvu viens otram, ka lietotājam ir grūti pieskarties vienam, nepieskaroties citiem. Rūpējieties par optimālajiem pogu, saišu utt. Izmēriem un atstarpi starp tām, lai mobilo ierīču lietotājiem būtu ērti ar tiem sazināties.
Ko tālāk?
- Kā uzzināt, kādas problēmas ar vietnes skatīšanu mobilajās ierīcēs mēs atradām, izmantojot īpašu pārskatu (šim nolūkam savā Search Console kontā ir jāpārbauda vietnes īpašumtiesības)
- Kā optimizēt vietni mobilajām ierīcēm (WordPress, Joomla! Un citām satura pārvaldības sistēmām)
Laba diena visiem, maniem draugiem un mana emuāra viesiem. Šodien mans raksts būs diezgan īss, taču tas nezaudē savu aktualitāti šodien. Proti, es vēlos jums pastāstīt par tādu lietu kā google, kas pārbauda vietnes mobilo versiju. Un varbūt es pat nebūtu uzrakstījis tik acīmredzamu rakstu, ja šī pārbaude mani nesen neizpratinātu.
Pārbauda ar google
Agrāk cilvēki neuztraucās ar atsaucīgu dizainu vai mobilo. Bet tad, kad parādījās informācija, ka meklētājprogrammas samazināsies meklēšanas rezultātu vietnēs, kurās nebija mobilās versijas, cilvēki sevi sasprindzināja (kā tas ir HTTPS gadījumā). Cilvēki nekavējoties sāka pasūtīt mobilās versijas no ārštata darbiniekiem, daži instalēja īpašus spraudņus, kas varēja darboties greizi.
Tātad, kad kāds ir ieguvis adaptīvu izkārtojumu vai mobilo versiju, viņš to nekavējoties pārbauda īpašā Google pakalpojumā, kurā tiek tikai apskatīts, kā jūsu izkārtojums atbilst prasībām. Tagad saskarne ir nedaudz mainījusies, bet būtība paliek nemainīga.
Lai pārbaudītu šo lietu pats, jādodas uz šo pakalpojumu - search.google.com/search-console/mobile-friendly... Pēc tam URL joslā ievadiet šīs vietnes adresi un pagaidiet. Pēc neilga laika jums tiks sniegta visa informācija par to, vai jūsu vietne atbilst Google prasībām par mobilo izkārtojumu.
ES nesaprotu...
Es lieliski zinu, ka mana vietne ir pielāgota, it īpaši tāpēc, ka es tikai nesen pielāgoju izkārtojumu. Bet nesen, sava prieka pēc, devos uz šo dievkalpojumu, lai redzētu, ko teiks vecā Goša, un biju ļoti pārsteigta. Fakts ir tāds, ka dienests man teica, ka mans emuārs nekad nav pielāgots un ir slikti lasāms mobilajām ierīcēm.
Es nekādi nevarēju saprast, kas par lietu, tāpēc sāku meklēt risinājumu internetā. Un es to atradu vienā vietnē. Izrādās, visa lieta bija failā robots.txt. Man tas bija rakstīts melnbaltā krāsā, lai meklētājprogrammas neindeksētu manu motīvu failus, tāpēc viņš neredzēja nevienu mobilo versiju.
Pēc tam, kad no robota noņēmu vienu līniju ( Neatļaut: / wp-content / themes / my theme), tad serviss uzreiz noteica, ka mana mobilā versija ir normāla. Tāpēc neuztraucieties, ja pēkšņi jums ir viens un tas pats. Visticamāk, jūs vienkārši neļāvāt Google indeksēt jūsu motīvu.
Nu, es droši vien šodien pabeigšu savu rakstu. Es ceru, ka jums tas noderēja. Kā tu redzi google, pārbaudot vietnes mobilo versiju, ļauj uzzināt, kā vietne atbilst tās prasībām. Bet patiesībā reti tiek atrasta vietne, kurai nav savas mobilās versijas vai atsaucības. Paies vēl nedaudz laika, un visām jaunizveidotajām vietnēm automātiski būs SSL sertifikāts.
Paldies, ka izlasījāt mani. Es noteikti gaidīšu jūs vēlreiz sava emuāra lapās. Tikmēr iesaku izlasīt citus rakstus. Es esmu pārliecināts, ka jūs atradīsit daudz interesantu lietu sev. Veiksmi tev. Uz redzēšanos!
Ar cieņu, Dmitrijs Kostins.
Šodien vairs nav vajadzības pārliecināt nevienu par vietnes mobilās versijas nepieciešamību. Galu galā katru dienu apmeklē arvien vairāk viedtālruņu un planšetdatoru. Rakstīšanas laikā aptuveni 20% manu emuāra apmeklētāju pārlūkošanai izmanto mobilās ierīces. Tas ir, katrs piektais apmeklē manu vietni, izmantojot tālruni vai planšetdatoru.
Pirms vairākiem gadiem es pat nedomāju par šādiem apmeklētājiem, bet, kad viņu skaits pārsniedza 10% no kopējā skaita, es sāku izmantot atsaucīgu izkārtojumu. Tas ļāva pareizi parādīt saturu mobilajās ierīcēs un palielināt gan apmeklētāju, gan meklētājprogrammu lojalitāti pret vietni.
Vietnes mobilā versija un atsaucīgais dizains nav viens un tas pats. Šajā rakstā galvenā uzmanība tiks pievērsta atsaucīga izkārtojuma pārbaudei, kad vietnes dizains mainās atkarībā no apmeklētāja ierīces ekrāna izšķirtspējas.
Lai pārliecinātos, ka jūsu vietne mobilajās ierīcēs tiek parādīta pareizi, jums jāpārbauda, \u200b\u200bun tam ir vairāki noderīgi pakalpojumi un rīki.
Ātra atsaucīgā izkārtojuma pārbaude
Populārs interneta pārlūks (pārlūks) Mozilla Firefox aprīkots ar iebūvētiem rīkiem, lai pārbaudītu vietnes dizaina piemērotību rādīšanai mobilajās ierīcēs. Lai to izmantotu, dodieties uz sadaļu "Izvēlne" - "Attīstība" - "Atsaucīgais dizains". Vai vienkārši nospiediet trīs tastatūras taustiņus vienlaikus ++ [M]
Jums vajadzētu redzēt kaut ko līdzīgu šim:
Mainot ekrāna izšķirtspēju un orientāciju, varat pārbaudīt, kā jūsu vietne tiks parādīta mobilo ierīču apmeklētājiem.
Google pārlūks Chrome ir arī iebūvēts atbalsts, lai pārbaudītu vietnes dizaina atsaucību. Lai to izdarītu, dodieties uz izvēlni, atlasiet vienumu "Papildu rīki" un pēc tam "Izstrādātāja rīki" (vai nospiediet taustiņu ).
Pēc tam noklikšķiniet uz atsaucīgā dizaina ikonas (vai vienlaikus noklikšķiniet uz tastatūras ++ [M]):
Ekrāna vidū jūs redzēsiet, kā jūsu vietne tiks parādīta mobilo ierīču ekrānos:
Mobilā dizaina SEO pārbaude
Kā jūs zināt, diviem pasaules meklēšanas līderiem Google un Yandex ir savs necils viedoklis par to, kā vietnei vajadzētu izskatīties mobilo ierīču ekrānos. Un, ja vietne tiek atzīta par neērtu mobilajiem apmeklētājiem, tad tā samazinās meklēšanas rezultātos. Tātad, no SEO viedokļa, ja jūs nevēlaties zaudēt mobilos apmeklētājus, tad jums vajadzētu būt ne tikai atsaucīgam dizainam, bet meklētājprogrammām tas arī jāapsver kā tāds, tas ir, piemērots mobilajām ierīcēm.
Lai pārbaudītu pielāgojamību, izmantojot Google pakalpojumu, dodieties uz šo adresi un ierakstiet savas vietnes nosaukumu: https://www.google.com/webmasters/tools/mobile-friendly/.
Tas ir mana emuāra pārbaudes rezultāts:
Ar Yandex tas ir nedaudz sarežģītāk, lai pārbaudītu, jums jāreģistrējas pakalpojumā Yandex.Webmaster un jāizmanto saskarnes beta versija:
Tiešsaistes pakalpojumi pielāgošanās testēšanai
Šo pakalpojumu galvenais uzdevums ir iepazīstināt (parādīt), kā jūsu vietne izskatīsies mobilajā ierīcē. Ir daudz vietņu ar šādu funkcionalitāti. Es došu tikai dažus no tiem. Vairumā gadījumu tie dublē FireFox un Chrome iebūvēto funkcionalitāti.
Google izmēru maiņa
Sākšu vēlreiz ar Google, kuram ir savs atsaucīgais demonstrācijas pakalpojums: http://design.google.com/resizer/#
Quirktools ekrāns
Otrs jaukais pakalpojums ir http://quirktools.com/screenfly/. Tas parādīs, kā jūsu vietne varētu izskatīties pat televizorā!
Symby.ru pielāgoties
Nu, lai neapvainotos "vietējais ražotājs", es minēšu citas vietnes piemēru: http://symby.ru/adaptest/. Vienā lapā jūs redzēsiet vairākus skatus vienlaikus ar atšķirīgu ekrāna izšķirtspēju.
Vietnes mobilās versijas ātrums
Kad esat pārliecinājies, ka jūsu vietne ir atsaucīga un vai tā pareizi tiek parādīta lielākās daļas ierīču ekrānos, jums jāpārbauda tās ātrums. Atkal tiek piemērots mobilajiem apmeklētājiem.
PageSpeed \u200b\u200bInsights
Google, kā vienmēr, ir priekšā pārējiem: https://developers.google.com/speed/pagespeed/insights/. Šis pakalpojums parādīs, kā vietne izskatās tālruņa ekrānā, un sniegs ieteikumus koda optimizēšanai, lai palielinātu mobilo ierīču ielādes ātrumu
WebPageTest
Un nobeigumā es sniegšu piemēru pakalpojumam, kas ne tikai parādīs, kā vietne izskatās mobilajā ierīcē, bet arī parādīs tā darba ātrumu: http://www.webpagetest.org/
secinājumi
Manuprāt, ikdienas darbā, veicot izmaiņas vietnes dizainā, ir vieglāk izmantot FirefF un Chrome pārlūku iebūvētās iespējas. Pēc tam, protams, jums jāpārbauda meklētājprogrammu lojalitāte pret jūsu dizainu. Un tikai tad, lai nomierinātu dvēseli vai parādītos, jūs varat izmantot tiešsaistes pakalpojumus.
Meklētājprogrammas cenšas uzlabot meklēšanas rezultātus mobilo ierīču (viedtālruņu, planšetdatoru) lietotājiem, tāpēc vietnes, kas optimizētas dažādiem ekrāna izmēriem, tiks rādītas augstāk nekā vietnes bez šādas optimizācijas. Tas ietver arī vietņu mobilās versijas.
Mobilajām ierīcēm draudzīgas vietnes pazīmes:
- Ērti lasāms saturs (lasāms bez palielinājuma), lieli formas lauki un pogas.
- "Smagu" attēlu, Flash elementu un pārmērīgas animācijas trūkums.
- Java sīklietotņu un Silverlight spraudņu trūkums.
- Horizontālas ritjoslas trūkums.
- Minimālais vietnes ielādes ātrums.
- Visvienkāršākā navigācija.
- Skatsporta metatags ir reģistrēts.
Pakalpojumi vietnes “mobilitāte” pārbaudei
Lai parādītu dienestu darbu, apskatīsim manu labo partneru vietni - tulkošanas aģentūru CONTEXT.
1. Google Mobile Friendly
Jūs varat pārbaudīt jebkuru vietni, vienkārši ierakstot tās adresi rindā.
Ekrānā parāda, kā vietne izskatās viedtālrunī, un sniedz vispārēju novērtējumu par tās optimizāciju mobilajām ierīcēm.
Atšķirībā no citiem pakalpojumiem, šeit jūs varat pārbaudīt ne katru vietni, bet tikai savu. Tas ir, pēc vietnes pievienošanas tīmekļa pārziņa saskarnei ar apstiprinājumu par tiesībām uz to.
Pakalpojums parāda kopējo vērtējumu, pārbauda 6 atbilstības punktus un parāda, kā vietne izskatās viedtālrunī.
3. Bing pārbaudītājs
Tiek pārbaudīta kopējā optimizācija, kā arī atbilstība 4 punktiem.
Tas arī parāda, kā vietne izskatās viedtālruņa ekrānā (protams, OS logos, savukārt iepriekšējie pakalpojumi parādīja android viedtālruni \u003d).
4. Mobilais pārbaudītājs no W3C
"Visgarākais" no visiem pakalpojumiem. Tik "garš", ka es negaidīju pārbaudes beigas \u003d)
Es gaidīju 5 minūtes, kamēr pārējie dievkalpojumi tika pabeigti 5-20 sekundēs.
5. Responsinators
Atšķirībā no citiem, tas nesniedz vērtējumus, bet parāda, kā jūsu vietne izskatās 6 dažādās ierīcēs divās IOS un Android orientācijās, kas ir ļoti forši.
UPD1: 20.07.2017 .:
6. Pielāgotājs
Dienests ieteica šī raksta komentāros. Es personīgi to neizmantoju, bet šķiet, ka viss ir diezgan labi. Iespējas ir līdzīgas respondenta iespējām, taču ir arī adaptācijas rezultātu novērtējums.
UPD2: 3.11.2017 .:
7. iloveadaptive.com
Vēl viens pilnīgi jauns pakalpojums, kas ieteikts komentāros. Kas attiecas uz mani, nedaudz liekā svara un nepraktiska, bet tas ir vairāk nekā atmaksājas ar lieliskām iespējām. Ir pat šķirošana pēc OS.
Rezultāts
Neapšaubāmi, vietnes pielāgošana mobilajām ierīcēm ir ne tikai veltījums modei un laikam, bet arī mūsdienu vietnes nepieciešamais atribūts, kas palīdz ne tikai galalietotājam.
Tāpēc iesaku visiem, kas vēlas būt tuvāk klientam un vairāk apmeklējumu / potenciālo klientu, lai pēc iespējas ātrāk pielāgotu savas vietnes. Pajautā man jautājumu -
Saviem projektiem jūs, iespējams, jau sen pamanījāt, ka mobilo ierīču lietotāju skaits nepārtraukti pieaug. Dažiem šī tendence ir mazāk pamanāma, un dažos projektos šis skaitlis katru gadu dubultojas vai vairāk. Saskaņā ar LiveInternet datiem vairāk nekā 50% no Runet datplūsmas veido mobilās ierīces. Starp citu, daudzi šī emuāra lasītāji jau ilgu laiku sūdzas, ka šeit nav mobilās versijas 🙂 kas, protams, tiks novērsta tuvākajā nākotnē.
Šo mobilizācijas faktu nevar ignorēt arī meklēšanas platformas. Pakāpeniski tās dod priekšrocības mobilajā meklēšanā tām vietnēm, kuras ir pielāgotas lietotāju ierīcēm.
Sākumā Google fragmentos atzīmēja vietnes, ka tās pareizi parādīs mobilajos tālruņos.
Google arī izveidoja rīku, kas tīmekļa pārziņiem palīdzēs pārbaudīt vietnes attēlojuma pareizību mobilajās ierīcēs:
https://www.google.com/webmasters/tools/mobile-friendly/
21. aprīlī Google palaida jaunu algoritmu ar nosaukumu Mobilegeddon Rietumos. Mobilās draudzības testa nokārtošana tagad ir viens no SEO faktoriem, ko Google ņem vērā. Līdz šim SERP nav notikušas lielas izmaiņas, taču jūs varat sagatavoties jau tagad.
Kā padarīt vietni atsaucīgu Google tīklā? Noslēpums ir vienkāršs - jums jāiestata uzdevums saviem programmētājiem / maketētājiem. Nu, ja nav laika gaidīt, tad ... varat izmantot MobileCheat 🙂
Patiesībā šī ir nepārbaudīta tehnoloģija, nav zināms, pie kā tā novedīs nākotnē, tāpēc izmantojiet to tikai uz savu risku un risku. Šeit var veikt vismaz virkni testu.
Kā apiet Google testu, izmantojot MobileCheat
Ir jādara tikai divas lietas:
1. Pievienojiet kodam skata meta tagu.
2. Aizveriet robota piekļuvi CSS failiem vai mapei, kur tie atrodas, izmantojot robots.txt
Piemēram, šādi mans emuārs nokārto noklusējuma testu:
Aizverot CSS, attēls mainās:
Šķiet, ka vietnē nekas nav mainījies, bet testa rezultāti ir pilnīgi atšķirīgi. Starp citu, dažās vietnēs man patīk atspējot CSS, lai būtu ērtāk tās apskatīt un lietot 🙂 tāpēc šī ir pilnīgi pamatota shēma. Bet tas tiek pasniegts tikai informatīviem nolūkiem.
Ko Tu domā par šo? Vai Google to skaitīs kā pretgājienu ar bruņinieku, vai tas ir visu iepriekš izdomājis un nekavējoties pārbaudīs un pārbaudīs vietni? 🙂
