Мобилна версия или адаптивен дизайн на сайт

В тази статия ще говорим за мобилния трафик и сайтовете, пригодения за мобилни устройства. Глобално трафикът от преносими устройства нараства от няколко години, а към настоящият момент е средно над 60% от общия. Ако сте собственик на уеб сайт или онлайн магазин, със сигурност трябва да обърнете сериозно внимание на този тип потребители. При кратко проучване ще разберете, че същестуват няколко типа уеб страници, подходящи за мобилни устройства. В този материал ще разгледаме мобилната версия на сайт, както и адаптивния (responsive) дизайн.

Мобилната версия на сайт е копие на основния уебсайт, но предназначен само за мобилни устройства. Най – често той работи на отделен URL адрес (например m.site.bg) и е разграничен от основните страници. Предназначението на мобилния сайт е да предостави по – добро изжяваване на потребителите на смартфони и таблети, чрез правилно оразмерени зони на допир, по – малки изображения и като цяло по – голямо удобство на малки екрани.

Мобилни версии се създават основно, когато е много трудно или скъпо да се създаде адаптивен (responsive) дизайн. Това може да се случи на големи сайтове, които не са променяни с години, а сега тепърва трябва да се съобразяват с мобилния трафик.

Отделните URL адреси, като най – често се ползва поддомейн, влияят в определена степен негатовино на търсачките. Също така, доста по – трудно е да се поддържат две версии на уеб сайта. Често се случва, ако мобилната версия не е настроена правилно, да се индексират в Google две версии на една страница и това да доведе до дублирано съдържание. Добрата практика е, в Google да са индексирани само най – важните и основни страници, за да им дадем предимство за обхождане. С мобилната версия тази задача се затруднява допълнително.

За да е оптимизиран за търсачки сайт, който притежава мобилна версия на отделен домейн, едно от условията е да са поставени rel=”alternate” и rel=”canonical” тагове на основната и на мобилната версия. Например:

<link rel=”alternate” media=”only screen and (max-width: 640px)” href=”http://m.your-site.bg/contact” />

Да присъства на основната версия на страницата и да указва, че има алтернатива за устройства със специална широчина на екрана. Както и да бъде поставен таг “canonical” в мобилната версия:

<link rel=”canonical” href=”http://www.your-site.bg/contact” />

Това ще подскаже на Google, че има друга страница, която е основна, а това е само нейно копие. Подобни настройки с rel=”alternate” трябва да се направят, ако имате няколко езикови версии на вашия сайт.

Ако искате да проверите какво е индексирал Google за вашия сайт и дали в резултатите са включени мобилните версии на отделен поддомейн, напишете в полето на търсене на google.bg:

site:your-site.bg

Това ще изведе всички индексирани страници и ще може да прецените дали всички от тях трябва да са там.

Вижте още полезни статии, свързани с оптимизация за търсачки.

Адаптивен или responsive дизайн е техника на изработка на уеб страница, която се настройва автоматично към широчината на екрана на потребителя. Често съдържанието се визуализира в определен брой колони и зависимост от устройството и екрана. Например на настолни компютри, съдържанието се показва във формат с три колони, на таблет – чрез две, а на смартфон на една колона.

Един от основните упреци към responsive дизайна е, че на някои сайтове може да се изключи полезно съдържание или функционалност. Уеб страницата може да е направена така, че с намаляването екрана на устройството, да се премахват определени елементи. Предимствата на адаптивна дизайн са много, но едно от основните е, че сайтът работи на един URL адрес и са избегнати сложни редиректи, канонични адреси и алтернативни версии.

В този абзац, ще изброим основни предимства и недостатъци на мобилните версии, както и на адаптивния (responsive) дизайн.

• Responsive сайтовете поддържат различни устройства и размери на екрани, само чрез една основна версия;
• В общия случай, Google би предпочел да индексира по – напред responsive сайт. Това произтича от няколко неща, например – ползва се само главна основна версия, няма редиректи към алтернативни или канонични адреси, възможноста от дублирано съдържание е по – малка, както и споделянето на линкове към уеб сайта е улеснено, понеже има само една основна версия на URL адресите;
• Responsive сайтовете са по – лесни за поддръжка и обновяване. Когато се поддържа само една версия, промените, естествено отнемат по – малко време;
• Може да излезе по – скъпо, за да се създаде responsive страници. Това често се случва за отдавна работещи сайтове, където въвеждането на адаптивен дизайн е изключително сложно и съответно скъпо;
• В определени случаи, зареждането на responsive страници може да е по – бавно. Мобилната версия е изцяло оптимизирана и пригодена за смартфон или таблет, докато при адаптивния дизайн – страницата е една и съща на компютър и устройство с малък екран.

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

Вижте още полезни статии от секцията за онлайн магазини.