Поздрави на всички. Интернет се развива с невероятни темпове и днес вижте посещения на сайта от мобилни устройстваи таблетът вече не е любопитство, както беше преди. пазар мобилен интернет набира много бързо темпои следователно създателите на уебсайтове трябва да адаптират своите уебсайтове към тези устройства. Ако погледнете последна новинаВ интернет индустрията можете да видите, че всичко върви към факта, че мобилните устройства през следващите 5-10 години ще заемат голяма половина от пазара за себе си.

До какво водя?И на факта, че е необходимо да адаптирате вашите сайтове и да ги направите удобни за гледане на мобилни джаджи.

Google наскоро обяви, че ще маркира уебсайтове, които са удобни за смартфони и таблети. Много експерти казват, че сайтовете, които не отговарят на тези критерии, ще бъдат малко по-ниски в издаването и по-лоши. Има също предложения, че Google може да направи отделен проблем за мобилните сайтове.

Фактът, че сайтовете ще бъдат с етикет информация е 100%, останалата информация е само спекулация.

Моето мнение е, че е необходимо да се спазват всички стандарти и сайтът да е удобен за всякакви мобилни джаджи. Почти приключихме с адаптирането на нашия сайт, остават още няколко щрихи и всичко ще е готово. Въпреки че, ако погледнете сега, можете да видите, че сайтът се показва добре на смартфони и таблети. Докато вършех тази работа, избрах за себе си няколко онлайн услугис които можете тестов сайт на мобилни устройства. Искам да ги споделя с вас.

5 безплатни онлайн услуги за проверка на сайта на мобилни устройства.

Нека изброим всичко безплатни услугии след това разгледайте всеки по ред:

  1. Google Инструменти за уеб администратори ()

По-горе изброих 5 безплатни онлайн услуги, които аз самият използвам и препоръчвам на вас. Функционалността им е напълно достатъчна за решаване на всякакви поставени задачи. Нека да разгледаме всеки от тях по ред.

1. Google Webmaster Tools (тест за удобство на мобилни устройства).Повечето най-доброто обслужванезащото е проектирано Google. Добре е, защото можете да видите не само как сайтът се показва на екрана, но и да получите всички необходими препоръки за отстраняване на грешки и правилно показване. За да видите всички грешки, трябва да отидете на Google Инструменти за уеб администратори, в секцията „Трафик от търсене“ изберете „Видимост на мобилни устройства“. След като отидете на страницата, можете да видите проблеми с лекотата на гледане.


Удобен за мобилни устройства - Google Webmaster

След преглед на грешките можете да преминете към теста на самия сайт. Нека да отидем на теста, да влезем и да получим всички препоръки, които трябва да бъдат направени. За да видите всички препоръки, вдясно кликнете върху бутона " По-нататък" в крачка „Как да направим една страница удобна за мобилни устройства“.


2. Сега да преминем към други услуги.с които можете да проверявате сайта на мобилни устройства.

Всички те са доста лесни за използване, просто въведете адреса на сайта в реда и ще получите всички резултати от сайта различни устройства. Да вземем за пример услугата Responsinator. Продължете, въведете адреса и щракнете върху „ ОТИВАМ“, влизам лолекнболек. Резултатите са в.

Превъртайки надолу можете да видите сайта в различни резолюции, което е много добре. Всички други услуги, изброени по-горе, работят по същия начин. По-късно използвам няколко услуги, което не винаги е възможно да получа правилния резултат на една. Когато използвате няколко, процентът на грешка пада до нула.

Използвайте услугите за проверка на сайта на мобилни устройства- за здраве. Мога да кажа само едно нещо - адаптирайте сайтовете за мобилни устройства, този пазар се разраства много бързо, преди да имате време да погледнете назад, вашите конкуренти вече използват мобилни версии и събират голяма аудитория.

Добър ден приятели. Днес ще се отдръпна малко от рекламните инструменти и ще започна нов раздел в блога. Нарича се „Уебмастеринг“ и ще включва полезни материалипо темата за подобряване на производителността и качеството на сайта, целеви страници. И ще започна с преглед на готин инструмент за проверка на сайт за мобилност.

Проверете скоростта на уебсайта с Google

За целта Google предлага 2 инструмента.

#1 PageSpeed ​​​​Insights

Мисля, че го познаваш добре. Поставете връзка към вашия сайт, щракнете върху бутона "Анализиране" и получете резултата под формата на два раздела.

Разделът "Мобилни" включва отчет за скоростта на зареждане на сайта за мобилни устройства и - важно! — оценка за удобствосайт за смартфони. Разделът „За компютри“, съответно, е същият анализ за работния плот.

Най-добрата част е, че услугата ви позволява да изтегляте оптимизиранизображения, css и скриптове, които да използвате на вашия сайт. Като този безплатна помощот Google.

Както можете да видите от екранната снимка, имам сериозни проблеми с мобилната версия. И как вървят нещата при вас?

#2 Testmysite.Withgoogle


Всъщност това е същият инструмент, само има красива обвивка. Онзи ден открих тази услуга и бях подкупен от формуляра за докладване.

Когато поставите връзка към сайта и щракнете върху „Проверка“, услугата ще предложи резултата под формата на пълноценна динамична целева страница, на която кратко и убедително ще разкаже как вървят нещата със сайта и ще предложи за да изтеглите пълния отчет.

Разбира се, поисках пълен отчет и няколко минути по-късно го получих по пощата. Изглежда разумно, няколко екрана полезни инструкциис връзки към конкретни материали:

Трябва да се отбележи, че ако анализирате един и същ сайт, тогава числата за тези инструменти ще варират леко. Те обаче работят по една и съща технология.

По този начин само за няколко секунди можете не само да проверите сайта за мобилност и да проверите скоростта на изтегляне, но и да изтеглите пълноценен отчет с оптимизирано съдържание. Е свободен. От Google

Е, как си с мобилността?

коментари, захранвани от HyperComments

Версиите на сайта не са само възможна прищявка на разработчиците, допълнителен разход (или печалба, ако говорим за изпълнители) и проява на загриженост за посетителите на ресурса. Според последното съобщение на Google сайтовете, които не отговарят на изискванията за адаптивен дизайн, ще бъдат песимизирани при мобилни търсения. Вътрешната търсачка Yandex също издаде препоръки „Колко е важно да си мобилен“ и увери, че действайки за удобство на потребителите на мобилни устройства, ще маркира мобилните версии в резултатите от търсенето и ще даде предимство на адаптивните страници.

Така че разработчиците трябва задължително да адаптират сайтове за смартфони и да проверят коректността на показването на ресурса. В противен случай скоро можем да очакваме загуба на значителна част от трафика, а оттам потенциални клиенти, тъй като новите алгоритми за работа от Google и Yandex вече са в сила. Можете да проверите мобилната версия на сайта различни начини: Смяна на браузъра при превключване към режим за разработчици, използване на емулатори на мобилни устройства или уеб услуги.

Удобство на сайта за мобилни устройства

Адаптивността към мобилни устройства се оценява според различни параметри. Важно е да проверите мобилната версия на сайта не само по отношение на правилното показване, струва си да вземете предвид и други фактори:

  • липса на анимация, "тежък" дизайн и снимки;
  • скорост на зареждане на ресурси (трябва да бъде минимална);
  • няма нужда от хоризонтално превъртане;
  • липса на плъгини Silverlight и Java аплети;
  • проста навигация в сайта;
  • Мета тагът на прозореца за изглед е написан в кода.

Ако тези условия са изпълнени, алгоритмите на най-разпространените търсачки разпознават уеб страницата като подходяща за мобилни устройства и повишават позицията на сайта в резултатите от търсенето по отношение на ресурси, които не са адаптирани.

Реално тестване на мобилни устройства

Най-удобно е да тествате мобилната версия на сайта на реални смартфони. Този метод ще позволи тестване в реални условия. В идеалния случай е по-добре да проверите уеб ресурс на няколко устройства, но ако бюджетът на проекта не включва разходите за закупуване на няколко смартфона от най-популярните модели, устройство на Базиран на Androidили Apple.

Преоразмеряване на прозореца на браузъра

Най-простият, но не оптимален по отношение на проверката, е преоразмеряването на прозореца на браузъра. Ако страницата е направена по технология, можете да проверите мобилната версия на сайта по този начин. Но в случаите, когато се прилага отделен дизайн, ресурсът се нуждае от ясна индикация, че потребителят е дошъл от смартфон, таблет или друго мобилно устройство. Така, насамви позволява да проверите наличността мобилна версиясайт. Но коректността на дисплея (в технически термини) е малко вероятно да бъде оценен.

Превключване в режим на програмист в браузъра

По-добър начин да проверите мобилната версия на сайта (Google или Yandex, както и други търсачкиподчертайте адаптивността в списъка с най-важните фактори, влияещи върху класирането) е да превключите в режим за разработчици в браузъра. Методът работи по подобен начин с множество браузъри:

  • Mozilla: можете да превключите в режим за разработчици, като изберете опцията „Отзивчив дизайн“ в менюто „Разработване“; чрез натискане на комбинацията Ctrl + Shift + M; като щракнете върху бутона „Режим на адаптивен дизайн“ в лентата с инструменти за уеб програмисти;
  • Chrome: превключването към мобилен режим става чрез натискане на F12, след което трябва да изберете иконата на мобилната версия (смартфон вляво горен ъгълпрозорец, който се появява).

В Opera преминаването към режим за разработчици за проверка на мобилната версия става чрез натискане на комбинацията Ctrl + Shift + i, но има и друг начин. Специална версиябраузър - Opera Mobile Classic Emulator - ви позволява да оцените изчерпателно мобилен дизайн. Съществуват версии на програмата за основните операционни системи.

Емулатори на мобилни устройства: Android Studio и Apple Xcode

Можете да проверите мобилната версия на сайта ("Yandex" и Google) с помощта на емулатори на мобилни устройства, които за Android и Apple са съответно андроид студиоили Apple Xcode.

Такива инструменти доста точно възпроизвеждат сайта, както ще изглежда на мобилни устройства: най-често срещаните версии на браузъри за мобилни устройства са предварително инсталирани в програмите. Емулаторите обаче не вземат предвид скоростта на изтегляне и някои други нюанси, които могат да се наблюдават в реални условия.

За да проверите, просто инсталирайте една от горните програми на вашия компютър и отворете сайта от емулатора.

Уеб услуги за валидиране на мобилен дизайн

Има още прости начинипроверете мобилната версия на сайта. Например, онлайн услугата Responsinator ви позволява да оцените коректността на показването на ресурс на мобилни устройства и лекотата на използване на сайта от потребителя. Ресурсът показва сайта така, както би изглеждал на шест различни устройства с Android или Apple и в множество ориентации.

Проверка на оптимизацията на уеб страници за мобилни устройства

Други ресурси, които ви позволяват да проверите мобилната версия на сайта, допълнително оценяват адаптивността, а не само показват как ще изглежда сайтът на различни устройства. Най-авторитетните услуги: Google Mobile Friendly и "Yandex Webmaster" (проверка на уеб страници). Проверката на Bing или, например, Mobile Checker от W3C също оценяват оптимизацията на сайта за мобилни устройства.

Всичко, което се изисква от уеб администратора при оценка на версията на сайта за мобилни устройства, използващи онлайн услуги, е да въведете адреса на ресурса и да изчакате анализът да приключи. Повечето от горепосочените услуги проверяват оптимизацията спрямо изброените по-горе параметри за мобилност.

И така, има няколко начина за оценка на адаптивността на уеб ресурс: от тестване на реални смартфони, таблети или други мобилни устройства или преоразмеряване на прозорец на уеб браузър, проверка в емулатори или в режим за разработчици на уеб браузър и завършване с използване на услуги от Yandex и Google. Много е лесно да проверите цялостно мобилната версия на сайта и това ще ви позволи да направите необходимите промени и да подобрите позицията на сайта в резултатите от търсенето.

Днес няма нужда да убеждавате никого в необходимостта от мобилна версия на сайта. В крайна сметка всеки ден има все повече посетители от смартфони и таблети. По време на това писане около 20% от посетителите на блога ми използват мобилни устройства за сърфиране. Тоест всеки пети посещава сайта ми от телефон или таблет.

Преди няколко години дори не мислех за такива посетители, но когато броят им надхвърли 10%. общ бройЗапочнах да използвам адаптивно оформление. Това направи възможно правилното показване на съдържание на мобилни устройства и повишаване на лоялността както на посетителите, така и на търсачките към сайта.

Мобилна версия на сайта и адаптивен дизайн- не е едно и също нещо. Тази статия е за тестване. адаптивно оформлениекогато дизайнът на сайта се променя в зависимост от разделителната способност на екрана на устройството на посетителя.

За да сте сигурни, че вашият сайт се показва правилно на мобилни устройства, трябва да проверите, а за това има няколко полезни услугии инструменти.

Бърза проверка на адаптивното оформление

Популярен интернет браузър (браузър) Mozilla Firefoxе оборудван с вграден инструмент за проверка на дизайна на сайта за пригодност за показване на мобилни устройства. За да го използвате, отидете на "Меню" - "Разработка" - "Адаптивен дизайн". Или просто натиснете три клавиша на клавиатурата едновременно ++[M]

Трябва да видите нещо подобно:


Като промените резолюцията и ориентацията на екрана, можете да проверите как вашият сайт ще се показва на мобилните посетители.

Google браузър Chromeсъщо има вградена поддръжка за проверка на адаптивността на дизайна на сайта. За да направите това, отидете в менюто, изберете елемента "Допълнителни инструменти" и след това "инструменти за разработчици" (или натиснете клавиша ).

След това натиснете иконата за отзивчив дизайн (или едновременно натиснете на клавиатурата ++[M]):

В средата на екрана ще видите как вашият сайт ще се показва на екраните на мобилни устройства:

SEO тестване на мобилен дизайн

Както знаете, двата световни лидера в търсенето Google и Yandex имат свое нескромно мнение за това как трябва да изглежда сайтът на екраните на мобилни устройства. И ако сайтът бъде разпознат като неудобен за мобилни посетители, той пада в резултатите от търсенето. Така че от гледна точка на SEO, ако не искате да губите мобилни посетители, тогава не само трябва да имате отзивчив дизайн, но и търсачките трябва да го считат за отзивчив, т.е. удобен за мобилни устройства.

За да проверите адаптивността с Google услугаотидете на следния адрес и въведете името на вашия сайт: https://www.google.com/webmasters/tools/mobile-friendly/.

Ето как изглежда резултатът от проверката на моя блог:

С Yandex е малко по-сложно, за да проверите, трябва да се регистрирате в услугата Yandex.Webmaster и да използвате бета версията на интерфейса:

Онлайн услуги за проверка на адаптивността

Основната задача на тези услуги е да представят (покажат) как ще изглежда вашият сайт на мобилно устройство. Има много сайтове с такава функционалност. Ще цитирам само няколко от тях. В повечето случаи те дублират вградената функционалност на FireFox и Chrome.

Преоразмерител на Google

Ще започна отново с Google, който има своя собствена услуга за демонстрация на адаптивност: http://design.google.com/resizer/#

Quirktools screenfly

Втората хубава услуга е http://quirktools.com/screenfly/ . Ще покаже как вашият сайт може да изглежда дори по телевизията!

Symby.ru адаптатор

Ами да не се обиждам местен производител» Ще дам пример за друг сайт: http://symby.ru/adaptest/. На една страница ще видите няколко изгледа с различни разделителни способности на екрана наведнъж.

Скоростта на мобилната версия на сайта

След като сте се уверили, че вашият сайт е responsive и се показва правилно на екраните на повечето устройства, трябва да проверите скоростта на неговата работа. Отново по отношение на мобилните посетители.

PageSpeed ​​​​Insights

Google винаги е пред кривата: https://developers.google.com/speed/pagespeed/insights/ . Тази услуга ще покаже как изглежда сайтът на екрана на телефона и ще даде препоръки как да оптимизирате кода, за да увеличите скоростта на изтегляне на мобилни устройства.

WebPageTest

И в заключение ще дам пример за услуга, която не само ще покаже как изглежда сайтът на мобилно устройство, но и ще покаже скоростта на неговата работа: http://www.webpagetest.org/

заключения

Според мен в ежедневната работа, когато правите промени в дизайна на сайта, е по-лесно да използвате вградените функции Firefox браузърии Chrome. След това, разбира се, трябва да проверите лоялността на търсачките към вашия дизайн. И едва тогава, за да успокоите душата си или да се похвалите, можете да използвате онлайн услуги.

Здравейте приятели! В статията ще разгледаме въпроса как да проверим сайта за мобилност. Способността на сайта да се показва правилно на всички видове мобилни устройства вече влияе върху неговото популяризиране и посещаемост, а оттам и върху приходите в Интернет.

Защо е важно да проверите сайта за мобилност

Не е тайна, че делът на трафика от мобилни устройства нараства всеки месец и ако погледнете последните няколко години, той е нараснал няколко пъти. И това е разбираемо - потребителите имат смартфони, iPhone, таблети и така нататък. Трафикът, който идва от мобилни устройства, се нарича мобилен трафик. Хората с мобилен трафикне само разглеждате страниците на сайтове, но и правете покупки.

Оттук и интересът на търсачките към мобилния трафик, защото приходите на Yandex и Google пряко зависят от броя на купувачите. Съдете сами, в моя блог делът на трафика от мобилно търсене е 15-20%, но има сайтове и блогове, където обемът на трафика от търсене е дори по-висок. По-долу можете да видите екранна снимка, показваща дела на мобилния трафик в моя блог. Между другото, делът на мобилния трафик от Далечния изток е още по-висок.

Поради тази причина търсачките Yandex и Google решиха да принудят собствениците на уебсайтове и блогове да адаптират сайтовете си за гледане на мобилни устройства. Сайтове и блогове, които не се показват правилно на различни мобилни устройства, се понижават в резултатите от търсенето и трафикът от търсене намалява.

Това е сериозно, кой се интересува от блогване, писане на статии просто така без нормално присъствие? В същото време много сайтове и блогове вече имат вградена мобилна версия, но няма гаранция, че всичко работи правилно там. Ето защо е важно всеки собственик да провери сайта за мобилност. Тази статия ще покаже как се проверява мобилната версия на сайта в Yandex и Google.

От февруари 2016 г. Yandex последва примера на по-големия си брат Google и също представи нов алгоритъмВладивосток, което наистина сваля сайтовете в резултатите от търсенето, ако не се показват правилно на мобилни устройства. Така че, нека да преминем към практиката и да започнем да проверяваме нашите сайтове за мобилност.

Проверка на мобилната версия на сайтаGoogle

Google беше първият, който взе предвид мобилността на сайта, новият му алгоритъм работеше още през 2015 г. Трябва да кажа, че с въвеждането на новия алгоритъм сайтовете, които нямаха мобилна версия, започнаха сериозно да пропадат. Трябва да кажа, че Google веднага имаше инструмент, който ви позволи да проверите мобилната версия на сайта в Google - Google Developers, този инструмент работи сега, ще се върнем към него по-късно.

Проверка на мобилната версия на сайта Google онлайнпоказа съществуващите проблеми, което направи възможно да се направят корекции, да се провери отново сайта за мобилност и да продължи да живее в мир. Днес има и други услуги, които ви позволяват да проверите сайта за мобилност.

Така че, нека разгледаме на практика проверката на сайта за мобилност в Google, проверката отнема около една минута във времето. За да започнете проверката, трябва да отидете на тази връзка и в полето въведете Име на домейнвашия сайт (блог) и щракнете върху бутона „Анализиране“ (вижте екранната снимка). След минута ще получите резултата. Проверката на мобилността на сайта в Google също е показана във видеото по-долу.

На тази страница можете да прочетете и интересна информация по тази тема. Проверката на вашия сайт за мобилни устройства в Google е много важна. Така например в началото на 2015 г. моят сайт не беше адаптиран за мобилни устройства и трафикът от търсене от Google беше само 5% от трафика от Yandex. През май 2015 г. беше инсталиран плъгинът WPtouch, който адаптира моя блог и делът на трафика за търсене от Google се увеличи до 30% или повече.

Проверка на мобилната версия на сайта в Yandex, алгоритъм Владивосток

Yandex обича да кръщава своите алгоритми на руски градове, този път Владивосток. Нищо чудно, че го нарекоха алгоритъм Владивосток, факт е, че именно във Владивосток има най-висок процент мобилен трафик. Както вече споменахме, Yandex въведе проверки за мобилност на сайта в Русия от февруари 2016 г. и в близко бъдеще това изискване ще важи за страните от ОНД и Турция.

Новият алгоритъм на Yandex Vladivostok наистина намалява сайтовете в резултатите от търсенето, проверих това на собствената си кожа. Случи се така, че през февруари 2016 г. работата по въвеждане в експлоатация беше в разгара си в моя блог (това беше написано в статията). В блога веднага беше инсталирана мобилна версия, но не беше възможно да се справи със стрелките „Нагоре“ и „Надолу“, това доведе до появата на хоризонтално превъртане и това е нарушение на изискванията на алгоритъма на Владивосток. В резултат на това делът на трафика за търсене от Yandex е намалял наполовина и все още не иска да се възстанови.

Проверката на мобилната версия на сайта в Yandex е доста проста, това беше написано в една от моите статии, но въпреки това ще го покажа отново. Проверката на сайта за мобилност в Yandex ще помогне нов Yandexуебмастър, беше писано за него в статии:

Отиваме на страницата на новия уеб администратор на Yandex, щракнете върху „Инструменти“ и изберете „Проверка мобилни страници”, сега трябва да въведете адреса на вашия сайт в полето и да натиснете бутона „Провери”. След по-малко от минута резултатът ще бъде издаден.

Както можете да видите от представения екран, всичките 6 индикатора трябва да бъдат показани в зелено. Ако поне един индикатор не съвпада, тогава трябва да потърсите причината и да я отстраните (по-горе беше написано как се отразява наличието на хоризонтално превъртане Резултати от търсенетоМоят блог).

Заключение

И така, в тази статия разгледахме въпроса как да проверим сайта за мобилност в Yandex и Google, как се отразява промоция при търсенеуебсайтове и блогове, научи какво алгоритъм за търсенеВладивосток. Остава само да се установи дали има или не нарушения и да се отстранят.

Ако вашият сайт не е адаптиран за мобилни устройства, тогава имате две възможности:

  • инсталирайте плъгин, който адаптира вашия сайт;
  • поръчайте адаптиране на вашия сайт на свободна практика.

Добавките за адаптиране са различни, можете да ги изберете. За повече информация относно инсталирането на приставката WPtouch, преглед на други приставки можете да видите в публикацията в моя блог. Между другото, след като инсталирате приставката, ще трябва отново да проверите сайта за мобилност. За тези, на които им е по-удобно да гледат видеото, то е представено по-долу:

Ще се радвате да адаптирате сайта към мобилната версия, но цената на тази работа е доста висока - $ 40-70 или дори по-скъпо, зависи от вас. Може би ще е по-лесно да поръчате нов сайт, ако има други промени и идеи, може да струва по-малко общо. Как и къде да поръчам изработка на уебсайт е показано в скорошната ми публикация в блога.

Мисля, че вече имате отговори на всички основни въпроси, свързани с проверката на мобилната версия на сайта. Проверете, коригирайте и не губете трафик от търсене. Късмет!

С уважение, Иван Кунпан.

P.S.За да създадете свой собствен блог, ще ви трябва мисловната карта, която разработих“, можете да я изтеглите и да приложите знанията си на практика, моят тригодишен опит е инвестиран в нейното развитие. Когато блогвате, е важно да пишете и оптимизирате статиите правилно, търсачките високо ценят такива статии. Можете да изтеглите мисловната карта "" или платена книга ".

Получавайте нови статии в блога направо във входящата си поща. Попълнете формата, щракнете върху бутона "Абониране".