Мобільний SEO: як створювати та оптимізувати мобільний сайт

1. Важливість мобільної присутності.
2. Рішення для побудови мобільного присутності.
3. 1. Чуйний веб-дизайн.
4. 2. Динамічне обслуговування
5. 3. Окремий мобільний сайт
6. Перенаправляє найкращі практики зіставлення для окремих мобільних сайтів.
7. На закінчення: яка альтернатива краще?

Я з iPhone і шукаю готель в центрі Риму, тому я шукаю в Google "hotel roma centro" і починаю вивчати готелі, які привертають мою увагу до першої сторінки результатів пошуку. На даний момент я виключаю сайти бронювання і вказую прямо на ті, що виділені зоряними фрагментами, де, прочитавши деякі позитивні відгуки, я вирішив відвідати веб-сайт готелів.

Ситуація, що представляє мені вивчення перших 8 сайтів з багатими фрагментами, полягає в тому, що лише 3 з 8 мають мобільну присутність. Інша частина сайтів, що дозволяє переглядати версію настільного комп'ютера часто нерозбірливо.

Дозвольте мені бути зрозумілим, я взяв до уваги сектор, туризм, який, хоча і конкурентоспроможний, є, мабуть, одним з найбільш «оптимізованих» з мобільної точки зору. У багатьох інших секторах, навіть конкурентоспроможних, ситуація гірша. Наприклад, я можу розповісти вам про деякі великі міжнародні блоги, які проповідують seo, але не мають чуйної та / або мобільної версії свого блогу. 🙂

Важливість мобільної присутності.

Чому виникає необхідність мати мобільну присутність? Ну насамперед, тому що минуло майже десять років, що ми говоримо про меблевий бум, його важливість і т.д. і т.д. про цей бум, ймовірно, говорили про це трохи раніше, але, починаючи з минулого року, він став реальністю, представленою постійно зростаючими числами і які можна перевірити з облікових записів Google Analytics. Візьмемо, наприклад, Facebook: можливо, доступ до веб-сайтів, що надходять з Facebook цього року, перевищуватиме доступ до робочого столу.

Але маркетингова сторона, посилаючись на трафік убік, що повинна підштовхнути всі компанії до інвестування в мобільну присутність, є пунктами, переліченими в пошуках, опублікованих минулого року самою компанією Google, і, щоб підсумувати, перенести в наступні слайди.

1. споживачі здійснюють пошук на мобільних сайтах протягом всього процесу закупівель.

2. Споживачі зазвичай шукають розташування магазину на своєму мобільному телефоні.

3. 93% користувачів, які використовують мобільний телефон для пошуку, приходять купувати.

Не слід також недооцінювати той факт, що все більше користувачів купують (і купують) безпосередньо зі своїх мобільних пристроїв. Ви можете прочитати інше в Подумайте про Google ,

Все це суперечить італійській реальності; скільки ресторанів мають мобільну версію свого сайту в Італії? Дуже мало!

Рішення для побудови мобільного присутності.

З технічної точки зору можна розробити мобільний сайт, виконавши одну з наступних трьох альтернатив:

1. Чуйний дизайн;

2. Динамічне обслуговування;

3. Окремий сайт з виділеною адресою URL.

Я проаналізую альтернативи один за іншим, висвітлюючи їхні плюси і мінуси та надаючи найкращі практики для SEO оптимізації (mobile seo).

1. Чуйний веб-дизайн.

кредитне зображення: SEL

Основною особливістю адаптивного дизайну є те, що з будь-якого пристрою, який ви переглядаєте сайт, макет буде адаптуватися до розміру екрану . Чуйний веб-дизайн, крім того, що краща альтернатива для будівництва мобільного сайту - це рекомендований самим Google.

Так, наприклад, діючи безпосередньо в css-файлі, використовуючи медіа-запити, ми можемо визначити, як шаблон буде відображатися на пристроях iPhone, навіть в ландшафтному режимі.

5 6 7 8 9 @media екран і (max-width: 600px) {h1 {font: 24px / 50px "Helvetica Neue", Helvetica, Arial, sans-serif; }}

@media screen і (max-width: 600px) {h1 {font: 24px / 50px "Helvetica Neue", Helvetica, Arial, sans-serif; }}

У прикладі код корисний для зміни розміру шрифту.

Переваги адаптивного дизайну:

• існування єдиного html-шаблону (більш унікального сайту і, отже, унікальної інституційної ідентичності бренду в Інтернеті);
• єдиний css-файл, завдяки медіа-запитам;
• немає сценарію для розпізнавання пристроїв;
• унікальна SEO оптимізація

Серед недоліків швидкого реагування часто можна прочитати, що час завантаження єдиного шаблону високий, порівняно з побудовою окремого сайту. Насправді це помилковий міф, тому що все залежить від того, що ми маємо намір завантажити. Якщо ми не будемо показувати користувачам вміст, який не є корисним для потреб їх перегляду, наприклад, реклами та / або відео, час завантаження не буде високим, і ми будемо надавати пріоритет мобільному вмісту над папкою .

джерело зображення: feedthebot - пріоритет видимого вмісту

2. Динамічне обслуговування

кредитне зображення: www.ayima.com

За допомогою динамічної подачі ми все ще маємо один URL, на якому завантажуватиметься вміст з мобільного, але сервер перехоплює тип пристрою, який користувач використовує, і з якого відбувається запит, і повертає найбільш відповідний вміст для типу пристрою . Відмінність з адаптивним дизайном полягає в тому, що це забезпечує більше шаблонів html та css залежно від пристрою, який робить запит.

Серед переваг Dynamic Serving існує, звичайно, можливість запропонувати більш персоналізовані шаблони залежно від пристрою і, як для чуйного дизайну, існування єдиного URL та інституційної ідентичності бренду. Серед недоліків, труднощів реалізації, так як вам доведеться обладнати себе хорошим програмістом, який буде змінювати HTTP-заголовок так, щоб вони правильно відповідали на запити.

9 10 11 12 13 14 15 16 17 GET / page-1 HTTP / 1.1 Ведучий: www.example.com (... інші заголовки HTTP-запитів ...) HTTP / 1.1 200 OK Тип вмісту: text / html : User-Agent Content-Length: 5710 (... інші заголовки відповідей HTTP ...)

GET / page-1 HTTP / 1.1 Хост: www.example.com (... інші заголовки запитів HTTP ...) HTTP / 1.1 200 OK Тип вмісту: text / html Вари: User-Agent Довжина вмісту: 5710 (... інші заголовки відповіді HTTP ...)

3. Окремий мобільний сайт

Третя альтернатива полягає в розробці окремого мобільного сайту на іншій URL-адресі . Це, з того, що я бачу, одна з широко використовуваних альтернатив. На мій погляд, це найскладніша і дорога альтернатива, тому що, крім того, що потрібно будувати і підтримувати два різні сайти (подумайте про електронну комерцію, коли вам доведеться оновлювати продуктову лінійку на робочому столі, вам доведеться оновити її також на сторінках мобільний сайт), вимагає серії seo дій, спрямованих на те, щоб боти зрозуміли, що ви зіткнулися з мобільною версією сайту.

Серед переваг , окремий сайт, безумовно, пропонує повну настройку мобільного перегляду.

Перенаправляє найкращі практики зіставлення для окремих мобільних сайтів.

Перш за все нам необхідно звернути пильну увагу на правильність переадресацій . Чи відбувалося це, наприклад, для збереження мобільного URL-адреси, окремого мобільного сайту, а потім для повторного відкриття його вдома з вашого робочого столу і перегляду версії для мобільних пристроїв? (на робочому столі!). Або навпаки відкрийте URL-адресу сайту зі свого мобільного телефону та перегляньте, як ви завантажуєте його версію на робочому столі (і, можливо, ви також знали про існування мобільної версії сайту).

Так що давайте звернемо увагу на перенаправлення користувачів, які запитують URL-адресу стільничного сайту, на відповідний мобільний url і користувачів, які переглядають з мобільних пристроїв і запитують мобільний url, до своєї версії .

Для управління перенаправленнями ми рекомендуємо написати сценарій, який буде вставлено в заголовок, який перехоплює пристрій і завантажує правильну версію.

Так що давайте не будемо бачити таких ситуацій, завантажених на робочий стіл (і ми не говоримо про сітареллі!)

Що гірше, ніж не перенаправляти користувача (і бота) на правильний URL? Переадресуйте його на домашню сторінку ! Якщо URL-адреса, запитана користувачем, не має відповідної мобільної версії, завжди краще показувати йому настільну версію запитаної URL-адреси . Марно перенаправляти його на домашню сторінку, тому що це не головна сторінка, яку користувач запитує на той момент.

Крім того, Google рекомендує перенаправляти користувачів планшетів на версію веб-сайтів для настільних ПК, оскільки зібрані дані показують, що останній є кращою версією під час перегляду з планшета.

Увага також до часу завантаження мобільних переадресацій , краще тримати їх якомога коротшим. У цьому дослідженні було показано, як додавання ще однієї секунди до часу завантаження мобільного контенту, дуже сильно і негативно впливає на перегляд сторінок, швидкість залишення і перетворення.

кредити: webperformancetoday
Що стосується швидкості завантаження, завжди стежте за порадами щодо продуктивності та оптимізації, які надаються інструментами, такими як PageSpeed ​​від Google, які надають послуги та консультації навіть на мобільних пристроях.

Одна річ, яку я ніколи не знайшов присутніх і що я рекомендую програмістам, з якими я працюю, це додавання двох метатегів у робочому столі та мобільних версіях сайту URL.

У заголовках мобільних версій url потрібно буде додати rel = "canonical", що вказує на версію робочого столу тієї ж url. Це, на додаток до консолідації індексування та ранжирування сторінок, дозволить Google уникнути потенційних проблем дублювання вмісту.

1 <link rel = "canonical" href = "http://www.example.com/page-1">

<link rel = "canonical" href = "http://www.example.com/page-1">

Натомість у вікні для настільних комп'ютерів має міститися відносний альтернативний носій для відображення стільничних та мобільних URL-адрес.

2 3 <link rel = "альтернативний" media = "лише екран і (max-width: 640px)" href = "http://m.example.com/page-1">

<link rel = "альтернативний" media = "лише екран і (max-width: 640px)" href = "http://m.example.com/page-1">

Нарешті, якщо компанія також має мобільний додаток, ми уникаємо показу гігантського спливаючого вікна для користувача, який запрошує його завантажити програму. Якщо це необхідно, покажемо вам зміст сторінки та посилання на завантаження програми , як у прикладі нижче.

Ви хочете створити мобільний сайт, мати реагуючий або оптимізувати свій сайт для мобільного SEO ? Ми готові виконати ваш проект!

Зв'яжіться з нами!

На закінчення: яка альтернатива краще?

Припустимо, що багато чого залежить від цілей мобільного присутності . Сайт є вітриною, інформативним, а мета - дозволити читання змісту? Тоді сайт для вас відповідає. У випадку більш складних проектів, в яких необхідно перетворити цілі, ми думаємо про електронну комерцію, можливо, краще розробити окремий сайт. У будь-якому випадку, однак, все повинно включати детальний аналіз досвіду пошуку користувачів, розчісувати Google Analytics і порівнювати пристрої використання та поведінки на місці.

джерело: http://ssl.gstatic.com/think/docs/creating-moments-that-matter-infographic_infographics.pdf