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

Ккількість користувачів, що використовують мобільні пристрої для доступу до мережі Інтернет, в 2016 році становило 68% а в 2017 цей показник виріс до 75%. Тому мобільний трафік стає більш значущим і власники веб-сайтів повинні зважати на цю статистикою.

Тому одні з найважливіших вимог в Mobile First розробці це:

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

Про важливість цього підходу уже писав пошуковий гігант Google:

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

Плюси Mobile First підходу

  • Один веб-сайт для всіх пристроїв
  • Користувачі отримають важливий зміст сторінки в першу чергу
  • Швидке завантаження сторінок при низькій швидкості підключення
  • Зручний інтерфейс для навігації в мобільному екрані
  • Мінімальна кількість веб ресурсів необхідних для відображення основного вмісту

Мінуси Mobile First підходу

  • Підхід Mobile First може плавно перейти в Mobile Only
  • Підхід складно застосуємий для величезних порталів з сотнями сутностей. Якщо ви розробляєте Amazon, Ebay або Yelp, проектування з даним підходом може зайняти дуже багато часу і закінчитися невдачею
  • У вас не відразу буде версія для великого інтернету. Якщо Ви зрозумієте, що без окремої версії для десктопів вам не обійтися, отримаєте ви її не скоро. І якщо у вашому проекті основна ставка робиться на великий веб, а терміни запуску тиснуть, ви можете просто не встигнути зробити дві версії

Також варто зауважити що один з найпопулярніших CSS фреймворків Bootstrap також побудований на принципі Mobile First.

Корисні матеріали:

https://habrahabr.ru/post/269419/

https://habrahabr.ru/company/futubra/blog/136370/

https://videoportal.epam.com/video/8JY3B6od

Книга “Mobile First” – https://abookapart.com/products/mobile-first

Схожі статті