Урок по SEO на мобилна страница

Ако смятате, че мобилната ви страница не се нуждае от SEO, чуйте това: През 2018 г., над 55% от интернет трафика идва от мобилни устройства, като се очаква с всяка година той да се покачва с поне 2%. Прогнозите сочат, че до 2020 година мобилната търговия ще държи цели 45% от дяла на общата електронна търговия.

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

И все пак, ако сме начинаещи в SEO или ако нямаме опит с оптимизацията на мобилни страници, как да подходим? Казано по друг начин – има ли специфики, които да отличават мобилната от десктопната оптимизация. За да ви отговорим най-лесно на тези, а и на всички евентуални въпроси, които в момента нахлуват в съзнанието ви, сме приготвили един кратък и лесен урок…

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

Как да създадем мобилен сайт или мобилна версия на наличния ни стандартен декстоп сайт?

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

И така, нека разгледаме трите опции за създаване на мобилен сайт, като накратко към тях добавим и няколко специфики, на които да обърнем внимание.

Адаптивен (responsive) дизайн

Той представлява конфигурация на мобилна страница. Основното при адаптивния дизайн е, че при взаимодействие на потребител със сайта, обслужващият го сървър винаги изпраща един и същи html код без значение от типа на устройството, от което е осъществено взаимодействието. Това, което дава възможност на потребители с различен по големина екран на устройството да виждат по един и същи оптимален и ясен начин уеб съдържанието, е CSS кодът. За целите на правилното подаване на данни към браузера от съдържанието на мобилната страница с адаптивен дизайн се ползват различни мета тагове.

ВАЖНО: От Google са дали и конкретна препоръка за мета таг, а именно meta name=“viewport“ content=“width=device-width, initial-scale=1.0″. Ако се питате защо, ето и реалните доводи на интернет гиганта:

  • Използването на унифицирано URL дава възможност за по-лесното споделяне на линка към вашата страница.
  • Алгоритмичният механизъм на Google успява по-бързо да се справи с индексацията на параметрите от сайта ви, което на свой ред води до избягване на необходимостта от модифициране на съдържанието за отделните различни големини на екрана според типа мобилно устройство.
  • И най-малко опитните уеб девелопъри ще се съгласят, че респонсив версията е много по-малко трудоемка като време и труд по сравнение със задачата да се създадат десетки отделни версии на сайта.
  • Този подход елиминира риска от множество грешки, които по принцип, са типични при функционирането и създаването на мобилна страница.
  • Избягва се и необходимостта от множество редиректи. От тук постигаме и много по-бърза скорост на зареждане на сайта, както и прескачането от една страница към друга.
  • По-нисък бюджет за цялостната crawling стратегия.

Динамично показване

Това е вторият вариант, с който разполагате, когато сте изправени пред задачата да създадете мобилна версия към вашия магазин, блог и така нататък. В случая, при подадена заявка към сървъра, той връща характерно URL в две алтернативи – една с HTML и една с СSS код. В зависимост от типа устройство, от което е подадена заявката, системата преценя кой вариант да изпрати. Тук е важно да отбележим, че понякога мобилното съдържание остава скрито за потребителя, най-често когато сървърът изпрати различен от нужния код. За да се предотврати подобна загуба на данни, е препоръчително да се прибегне към Vary заглавието. То дава възможност на системата да сканира заявката чрез робот.

Мобилна версия

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

След като имате пред себе си трите опции за избор, можем да преминем и към основния въпрос, върху който сме се насочили с този материал, а именно SEO на мобилна страница. Нека започнем с няколко базисни препоръчителни правила и съвети, на които е добре да обърнете особено внимание.

Какво не трябва да блокирам при оптимизацията? – графичните файлове, CSS и Javascript кода

За да сте сигурни, че търсачката ще се справи със сканирането на посочените елементи, използвайте инструмента Google Search Console и по-конкретно, преминете през функцията Прегледай като Googlebot. С тази функция реално ще видите как виждат сайта ви ботове на Google. Не излизайте от инструмента, преди да направите и прегледа на robots.txt файла, който да ви дава информация какво съдържание от сайта ви е скрито за сканиране от ботовете. И последно, но не по важност, тествайте сайта си – поне няколко пъти – за да се уверите, от друга страна, как и потребителите ви го виждат. Едно е сайтът ви да се „приеме“ от ботовете на Google, но в крайна сметка е съвсем друго потенциалните ви клиенти да го приемат за удобен и функционален, нали така?

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

Най-общо казано, това е съдържанието, което не може да се възпроизведе или поне в нормален, пълен вид на мобилно устройство (особено, ако говорим за смартфони с малка резолюция). Най-добре е визуалното ви съдържание да е изградено под формата на HTML5. Бъдете особено внимателни с видео съдържанието. В мобилната страница видеата трябва да са във формат, който е съвместим и с таблети, и с различните модели смартфони. И последно за видеата – трябва да удовлетворите и клиентите си, които разполагат с отделни технологии като помощни за преглеждане на видеа, като прикрепите специална разшифроване на видеото.

Как да се уверя, че ползвам правилните редиректи?

Отново ще ползваме удобния тул Google Search Console, който между другото, по принцип е добре да е основополагащ инструмент в изграждането на перфектно SEO за сайта ви изобщо (и мобилен, и десктоп). С него ще намерите бързо и лесно всеки грешен адрес, както и конкретно предложение за решение на проблемите, свързани с такъв адрес. Ако имате опит с настройките на сървъра, направете такава за пренасочване към мобилната версия / сайт на платформата ви в случай, че в него се влиза от мобилно устройство. Ако нямате опит, добре е да потърсите помощ от специалист, защото това са фини и специфични настройки. Обратно, ако вашият сайт няма мобилна версия, не ползвайте каквито и да е редиректи, защото в тази хипотеза за клиента ви е по-удачно да попадне на официалната ви страница (десктопната). В противен случай ще му се покаже сайт с много грешки и бъгове.

Съвети за редирект 404

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

Как да се справим с бавната скорост на зареждане?

Първо на първо, установете конкретната скорост за зареждане на сайт. Нормалната скорост варира около 2-3 секунди. За да направите проверка на вашата страница, използвайте един от двата инструмента – GTMetrix или PageSpeed Insights на Google. След като бъде направен тестът, и двата инструмента, освен че ще ви изведат конкретната скорост за зареждане на вашия сайт, ще ви уведомят доколко приемлива е тя, както и ще ви изпишат цял списък с препоръки за подобрение. Колкото повече съвети вземете на предвид, толкова по-добра ще е скоростта ви на зареждане.

Rel=Canonical – да или не?

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

Rel=next/prev – да или не?

Както се досещате, сигурно, и тук отговорът е положителен. Причината да ви препоръчваме Rel=next/prev е, че в повечето случаи сайтът включва странициране, което при наличие на две версии може да доведе до изобразяване на различен брой артикули на една страница.

Pop-up прозорци – да или не?

Тях е по-добре обаче да ги избягвате и ако в момента имате такива в мобилната си страница, първата стъпка от вашата оптимизация е да ги премахнете, защото тези прозорци водят до значително увеличение на bounce rate. Поставете се в обувките на потребителя, вие също няма да сте доволни от pop-up прозорци, които ще се съгласите, обикновено, или се затварят трудно, или ви пренасочват на места, на които не искате да ходите.

Schema.org

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

Ръководство за успешен дизайн на мобилната ви страница

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

  • Постоянни, навременни и пълни тестове на вашия сайт дават отправен ориентир за визията и функционалността на дизайна, така че никога не ги подценявайте.
  • Старайте се да опростите и намалите размера на наличните в сайта ви форма за въвеждане на лични данни. Обикновено, мобилният потребител се дразни или намира за бавно и трудоемко да ги попълва през такъв тип устройство.
  • В тази връзка, обмислете и идеята за опцията бърза поръчка, ако притежавате мобилен интернет магазин.
  • Лайфхак: тествайте степента на интуитивност на вашия дизайн с този инструмент: http://thumbzone.co/.
  • И още един полезен инструмент: Google Data studio. С него можете бързо, лесно и най-вече редовно да правите подобрения на дизайна на вашия сайт, тъй като тулът дава отлични анализи по въпроса.

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

Вашият коментар