Натиснете ENTER, за да видите резултатите или ESC за изход.

Защо сайтът Ви трябва да е mobile-friendly + 3 начина да го направите

С развитието на технологиите и широкото използване на мобилни устройства в ежедневието, мобилният трафик към сайтове драстично увеличава размерите си. Следвайки тази тенденция, от юли 2019 година Google наложи правилото за Mobile First Index за всички нови сайтове. При този подход ботовете на търсачката проверяват първо мобилната им версия. В случай че сайтът вече е бил индексиран преди въвеждането на правилото, Google ще продължи да обхожда неговата desktop версия.

Наскоро обаче Google официално обяви, че преминаването към Mobile First Index за всички сайтове е планирано за март месец 2021 година. 

Защо това е важна промяна, която би засегнала Вашите проекти?

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

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

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

Как да проверим дали сайтът ни е mobile-friendly?

Ако сайтът Ви се вижда еднакво добре, независимо от размерите на екрана на устройството, което се използва от потребителя, то той използва отзивчив (responsive) дизайн. При него CSS кодът указва на браузъра как да се подреди съдържанието на страницата спрямо резолюцията на екрана. Това подобрява преживяването на потребителя при използването на мобилни устройства. В този случай няма да е необходимо да предприемате действия и промени в структурата на сайта.

Ако разполагате с отделна мобилна версия на сайта, уверете се, че информацията е идентична с тази на desktop версията. Необходимо е сайтът да използва еквивалентни структурирани данни за двете версии. Структурираните данни дават информация за страницата Ви и типа на съдържанието, което е добавено в нея. По този начин то ще бъде по-добре представено на потребителите при търсене.

Можете да проверите дали сайтът има структурирани данни чрез инструмента Rich Results Test.

Важно: Директна проверка дали сайтът Ви е mobile-friendly и отговаря на препоръките на Google, можете да извършите чрез инструмента Mobile-Friendly Test.

Mobile-Friendly Page Test
Резултат от проверката на сайт, който е mobile friendly.

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

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

Как да направим WordPress mobile-friendly

WordPress е сред най-масово използваните системи за изграждане на сайтове с най-различна тематика. Дали сайтът Ви, направен с тази система, ще бъде mobile-friendly зависи от темата и плъгините, с които сте избрали да го изградите.

Използване на Responsive тема

При създаването на сайт с WordPress първата и най-важна стъпка е изборът на тема. Уверете се, че избраната от Вас тема е mobile-friendly и използва responsive дизайн. 

Можете да проследите как ще се зарежда сайтът Ви през мобилно устройство с избраната тема, след като тя е инсталирана в WordPress през администрацията » „Външен вид“ » „Настройка“. В долния десен ъгъл на менюто ще откриете варианти за визуализиране на сайта Ви при desktop, tablet и мобилно устройство.

Mobile Page View Edit
Мобилен изглед на сайта при редакция на темата.

Използвате тема, която не е mobile-friendly?

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

  • Уверете се, че темата Ви е обновена до последна версия. Използването на отзивчив дизайн е сред основните критерии при изграждането на сайт. Възможно е разработчиците на темата да са оптимизирали кода ѝ в следващите версии. Ако пък темата, която използвате, е платена или разработена специално за Вашия сайт, можете да се обърнете към разработчиците ѝ за съдействие.
  • Да използвате допълнителни плъгини, чрез които да преминете към мобилна версия на сайта. В официалната директория с плъгини за WordPress има различни плъгини, които ще Ви помогнат да подобрите изгледа на Вашия сайт за мобилни устройства или изцяло да го модифицирате. 
  • Да промените изцяло визията на сайта, като изберете нова тема, която да разполага с responsive дизайн. 

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

Допълнителни плъгини

Ако избраният от Вас вариант е инсталация на допълнителен плъгин, за да оптимизирате сайта Ви и да преминете към mobile-friendly версия, то сега ще Ви представим най-популярните плъгини:

WP Touch

WP Touch е сред най-използваните плъгини за модификация на теми, които не предлагат responsive дизайн. След инсталацията му автоматично сайтът Ви получава mobile-friendly визия.

Можете да използвате безплатната или платената версия, като едно от предимствата на WP Touch Pro (премиум версията) е възможност да използвате плъгина в комбинация с кеширащи механизми.

Плъгинът създава отделно меню WP Touch в администрацията на WordPress, чрез което лесно можете да управлявате неговите настройки.

WP Touch Settings
Основни настройки на плъгина WP Touch.

Ако искате да модифицирате визуалните настройки на сайта, то това ще можете да извършите чрез менюто „Външен вид“

Важна стъпка при настройката е изборът на меню, което да се визуализира на потребителите, използващи мобилни устройства. За да можете да използвате текущо зададеното меню за desktop версията на сайта и при мобилните устройства, трябва да поставите отметка за него през „Външен вид“ » „Менюта“ » „Настройки на менюто“ » „WPtouch: Header Menu“.

WPTouch Header Menu Settings
Активиране на меню за мобилната версия на сайта

WordPress Mobile Pack

WordPress Mobile Pack е плъгин, който Ви дава възможност да преобразувате съдържанието в сайта Ви в progressive web application (PWA). PWA представлява мобилен сайт, изграден с JavaScript framework, който има част от функционалностите на мобилно приложение.

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

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

WP Mobile Pack Settings
Настройки на плъгин WordPress Mobile Pack.

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

Accelerated Mobile Pages (AMP)

За да подобрите потребителското изживяване при използването на мобилни устройства, можете да добавите Accelerated Mobile Pages (AMP) поддръжка в сайта. AMP представлява проект с отворен код, стартиран през 2015 г. Неговата цел е да подобри бързодействието на сайтовете при използването на мобилни устройства.

В WordPress можете да интегрирате тази поддръжка чрез инсталирането на допълнителен плъгин като AMP for WordPress.

AMP for WP Settings
Настройка на AMP for WP.

След инсталацията на плъгина, HTML кодът на сайта Ви ще бъде преобразуван така, че да се използва AMP поддръжката. Имате възможност да изберете няколко нива на работа на този плъгин, в зависимост от това до каква степен искате сайтът да бъде модифициран.

Google продължава да работи в посока подобряване на потребителското изживяване на сайтовете през мобилни устройства. Въвеждането на Web Stories, базирани на AMP, е един от обещаващите проекти на Google.

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

Съвет от support-а: Ако искате да подобрите работата на сайта през мобилни устройства, то е добре да обърнете внимание и на следните настройки:

Абонирайте се за нашия блог, за да не изпуснете следващите ни статии за подобряването на Вашите сайтове.

АБОНИРАНЕ

Специалист Техническа Поддръжка

Габи е нашият WordPress експерт с неутолима жажда за познание, чиято СуперСила е несломимата ѝ упоритост да стигне до решението, независимо колко „екзотичен“ е казусът.

5 1 гласове
.
500px270px
SuperHosting.BG
Етикети/Tags

Абониране
Уведоми ме при
guest
0 Коментара
Коментари към текста
Виж всички коментари

Privacy Preference Center

Necessary

Advertising

Analytics

Other

0
Какво мислите?x