адаптивна верстка - це вже давно прийнятий стандарт при розробці сайтів. Однак його формування має починатися ще на стадії проектування дизайну. Тому в даній статті ми розглянемо основні типи адаптивних макетів і їх візуальну інтерпретацію.
гумовий макет
Це один з найпростіших варіантів зробити адаптивну верстку сайту. Він також є більш звичним і для користувача, так як використовується зараз найчастіше. Суть його в тому, що блоки сайту стискаються по ширині до розміру використовуваного електронного пристрою, а де не поміщаються по ширині екрану, там перебудовуються один під одним. Одним з найпростіших програмних рішень для реалізації даного макета є використання Tweetter -Bootstrap CSS -фреймворка.
перенесення блоків
Цей варіант буде найкращим, якщо сайт має многоколончатую структуру. У міру зменшення ширини екрану девайса, такі блоки, як сайдбар, просто переносяться в нижню частину макета.
перемикання макетів
Цей спосіб розробки адаптивного макета сайту полягає в моделюванні окремого макета для кожного дозволу екрану. Спосіб досить трудомісткий, тому на практиці використовується не так часто. До того ж, дозволу екрану далеко не завжди можна стандартизувати з огляду на їх різноманіття.
найпростіша адаптивність
Цей спосіб стосується швидше адаптивності не тільки сайту, а його окремих частин, тому найбільш простий як для дизайнера, так і для верстальника. Однак до ідеалу йому далеко. Адаптивність досягається за допомогою масштабування типографіки і зображень.
панелі
Цей тип адаптивного макета швидше характерний для мобільної версії сайту, але також іноді використовується і на звичайних веб-версіях, хоча використовувати його не так звично. Меню в ньому з'являється при горизонтальному або вертикальному тапе.
Перераховані рішення - це стандартизовані типи, які застосовуються найбільш часто, однак найкраще опрацьовувати адаптивність індивідуально.
Повернутися назад