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