(TemplateMonster) - Как сделать сайт адаптивным: полезные советы

2

Содержание

Адаптивный дизайн. Что это такое и почему его нужно использовать

3

Что такое RWD

3

Адаптивные макеты

4

Гибкий макет на основе сетки (Mostly Fluid)

4

Макет Shifter

5

Колонка Drop

5

Off Canvas

6

Твики

6

Адаптивная навигация

6

Фиксированная панель или “ничего не делай” подход

6

Футер

7

Off-canvas навигация

7

Адаптивная типографика

7

Гибкие изображения

8

max-width: 100%;

9

srcset

9

<picture>

10

Выбор правильного формата

10

JPG или JPEG

10

SVG

10

PNG

11

GIF

11

Медиа-запросы

11

Пример

12

HTML

12

HTML5.js

13

CSS

13

Масштабируемые встроенные видео

15

Сжатие

16

Минификация

16

GZIP

16