Связаться с нами

  • (097) ?601-88-87
    (067) ?493-44-27
    (096) ?830-00-01

Статьи

Адаптивна верстка: типи макетів

  1. гумовий макет
  2. перенесення блоків
  3. перемикання макетів
  4. найпростіша адаптивність
  5. панелі

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

гумовий макет

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

перенесення блоків

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

перемикання макетів

Цей спосіб розробки адаптивного макета сайту полягає в моделюванні окремого макета для кожного дозволу екрану. Спосіб досить трудомісткий, тому на практиці використовується не так часто. До того ж, дозволу екрану далеко не завжди можна стандартизувати з огляду на їх різноманіття.

найпростіша адаптивність

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

панелі

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

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

Повернутися назад

Статті по темі:

Новости