CityHost.UA
Допомога і підтримка

Про адаптивність сайту і її вплив

 810
04.07.2019
article

Інтернет уже кілька років як перестав бути прив’язаний до ПК або ноутбука. Згідно з даними, опублікованими компанією Statista, кількість власників смартфонів у 2019 році склало 2.71 мільярда осіб. Для порівняння: у 2014 році цей показник дорівнював 1.57 млрд.

Оскільки власники смартфонів використовують їх здебільшого і для покупок в інтернет-магазинах, читання новин і статей у блогах, перегляду роликів на відеохостингах уявіть, якими темпами зростає число тих, хто виходить у Мережу з мобільного пристрою. Цей факт повинен підштовхувати веб-майстрів і розробників на одну думку — сайти потрібно створювати адаптивними.

Адаптивність сайту — це його властивість коректно відображатися на дисплеях різних пристроїв. Адаптивний блог або інтернет-магазин зручно переглядати на ноутбуках, нетбуках, смартфонах, планшетах. Онлайн-ресурси, які «криво» відображаються на якомусь із цих пристроїв, відлякають клієнта, який вирішив купити товар або замовити послугу через такий девайс.

Крім того, з 1 липня 2019 року Гугл за замовчуванням включає Mobile-First Indexing для всіх нових доменів. Це означає, що ранжування онлайн-ресурсів, що з’явилися після цієї дати, буде відразу ж виконуватися зважаючи на данні, отриманих із їхніх мобільних версій. Простіше кажучи — нові неадаптивні блоги, портали, форуми, інтернет-магазини навряд чи колись піднімуться до перших позицій видачі Гугла.

Зверніть увагу! Опрацьована структура сайту — не менш важливий фактор просування онлайн-ресурсу. Блоги та інтернет-магазини з невеликим рівнем вкладеності категорій, які мають релевантне контенту назва, швидше потрапляють у ТОП видачі пошукових систем.

Що краще: адаптивний сайт або його окрема мобільна версія

«А чи не простіше створити для смартфонів копію сайту у вигляді додатку, а для робочого столу залишити його поточну неадаптовану версію?», — швидше всього, це питання вже виникло у вашій голові. Непоганий варіант. Ось тільки якщо не враховувати купу підводних каменів, з якими зіткнетеся, якщо так зробите:

  • Доведеться створити додаток для iOS і Android. Це дорого й займає не один день. Зайнятися впровадженням адаптивності сайту під мобільні пристрої — дешевше і швидше.
  • Потрібно придумати рішення для автоматичного обміну інформацією між основним сайтом і додатком. Це також чимало коштує й довго робиться.
  • Користувачам доведеться завантажувати і встановлювати додаток. Не всі захочуть робити це. Особливо, якщо ваш сайт не дуже популярний.
  • Ви втратите трафік. Гугл може ніколи не дізнатися про те, скільки осіб виконує якісь дії в додатку. І вже тим більше не буде підсумовувати цей трафік із трафіком десктопного версії ресурсу.

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

Як перевірити адаптивність сайту

У Гугл Хрома і Фаерфокса є вбудовані інструменти розробників, які дозволяють подивитися, як сайт відображається на різних пристроях. Щоби скористатися цією функцією, перейдіть на онлайн-ресурс, який потрібно перевірити на адаптивність, і натисніть кнопку F12. У віконці, що з’явилося, клікніть на значок у вигляді смартфона, виберіть конкретну модель мобільного пристрою й обновіть веб-сторінку (F5).

Як перевірити сайт на адаптивність іншими способами? Це можна зробити, використовуючи спеціальний онлайн-інструмент, розроблений Гуглом. Для цього перейдіть за адресою https://search.google.com/test/mobile-friendly, введіть URL веб-сторінки, яку потрібно перевірити, і натисніть кнопку «Перевірити сторінку». Після того, як сканування буде виконано, ви побачите, чи є в сайту проблеми з адаптивністю. Наприклад, розташовані дуже близько один до одного інтерактивні елементи або надто дрібний шрифт.

Як зробити сайт адаптивним

Насамперед усуньте помилки, які знайшов згаданий інструмент від Гугла. Крім того, переконайтеся, що викладене далі стосується вашого інтернет-магазину, блогу або порталу:

  • довжина й ширина зображень автоматично змінюється на дисплеях із різною роздільною здатністю;
  • розмір шрифтів стає більше на пристроях із маленьким екраном і текст читається легко;
  • якщо сайт відкривається на пристрої, на якому раніше не відкривався, перевірка адаптивності виконуються автоматично, а її результати відправляються розробнику;
  • обрано хостинг сайту, на якому веб-сторінки швидко завантажуються навіть у разі підключенні через 3G;
  • дизайн автоматично змінюється на пристроях із різним співвідношенням сторін і роздільною здатністю дисплея — онлайн-ресурсом зручно користуватися під час перегляду на широкоформатному моніторі й на смартфоні з 4-дюймовим екраном.

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

Публікація була пізнавальною? Тоді поділіться нею в соціальних мережах і додавайтеся в наш Telegram канал. Нагадаємо, що купити український хостинг ви можете у хостинг-компанія CityHost. З технічних питань звертайтесь до онлайн чат або скористайтеся одним з номером телефону ☎️ 0 800 219 220.


Сподобалася стаття? Розкажіть про неї друзям: