Please enable JavaScript.
Coggle requires JavaScript to display documents.
Техніки адаптивної верстки (Сервіси для перевірки адаптивності верстки…
Техніки адаптивної верстки
Верстка веб-сторінки
Адаптивне верстання – підхід, що припускає зміну дизайну залежно від поведінки користувача, розміру екрана, платформи і орієнтації девайса. Іншими словами, сторінка повинна автоматично підлаштовуватися під дозвіл, змінювати розмір картинок і так далі.
Типи версток
Гумовий
Простий в реалізації і очевидний для користувача тип подання контенту. Основні блоки стискаються до ширини екрану мобільного пристрою, де таке неможливо - перебудовуються в одну довгу стрічку. Такий макет дуже просто реалізувати за допомогою адаптивних CSS-фреймворків, наприклад Twitter Bootstrap.
Перенесення блоків
Очевидний спосіб для многоколоночной сайту: при зменшенні ширини екрану додаткові блоки (сайдбарі) переносяться в нижню частину макета.
Перемикання макетів
Цей спосіб найбільш зручний при читанні сайту з різних пристроїв: під кожний дозвіл екрана розробляється окремий макет. Спосіб трудомісткий, тому менш популярний, ніж попередні два.
Адаптивність «малою кров'ю»
Дуже простий спосіб, який підходить для нескладних сайтів. Досягається елементарним масштабуванням зображень і типографіки. Не дуже популярний, тому що не є гнучким.
Панелі
Спосіб, що прийшов з мобільних додатків, де додаткове меню може з'являтися при горизонтальному або вертикальному тапе.
Сервіси для перевірки адаптивності верстки
Browsershots
Browserling
CrossBrowserTesting
IE NetRenderer
IE Tester
MultiBrowser
Litmus
Browser Sandbox
Browserstack