Upload
wakeupprovince
View
94
Download
2
Embed Size (px)
DESCRIPTION
Доклад с конферениции http://w-u-p.ru Алексей Варламов из http://voxweb.ru
Citation preview
АДАПТИВНЫЙ ДИЗАЙН САЙТОВ
ВАРЛАМОВ АЛЕКСЕЙ / VOXWEB.RU
2АДАПТИВНЫЙ ДИЗАЙН САЙТОВ / VOXWEB.RU
ОСНОВНАЯ ИДЕЯ АДАПТИВНОСТИ
Корректное и удобное отображениестраниц сайтов на различных экранахи устройствах.
3
КОНТЕКСТ И КОНТЕНТ
АДАПТИВНЫЙ ДИЗАЙН САЙТОВ / VOXWEB.RU
Контекст
Транспорт/метро/автомобили
TV и приставки
Ожидание в очереди
Контактные данные
Схема проезда
Быстрый заказ
Контент
4
ПРЕДПОСЫЛКИ СОЗДАНИЯ
АДАПТИВНЫЙ ДИЗАЙН САЙТОВ / VOXWEB.RU
15-20%Мобильный трафик
5
ПРИНЦИПЫ И ОСОБЕННОСТИ
АДАПТИВНЫЙ ДИЗАЙН САЙТОВ / VOXWEB.RU
Breakpoints
6
ПРИНЦИПЫ И ОСОБЕННОСТИ
АДАПТИВНЫЙ ДИЗАЙН САЙТОВ / VOXWEB.RU
Резиновая вёрстка и адаптированные изображения
7
ПРИНЦИПЫ И ОСОБЕННОСТИ
АДАПТИВНЫЙ ДИЗАЙН САЙТОВ / VOXWEB.RU
Медиазапросы и специальные js-библиотеки
IE
Нативные решения
8
МОБИЛЬНЫЙ ИЛИ АДАПТИВНЫЙ
АДАПТИВНЫЙ ДИЗАЙН САЙТОВ / VOXWEB.RU
Адаптивный сайт
+ Гарантированная работа сайта на любых устройствах и экранах+ Возможность выкладывать изменения на сайт быстрее- Относительная сложность реализации
Мобильный сайт
+ Технологичесвкая простота+ Облегчённая версия сайта- Дополнительный домен- Поддержка 2-х сайтов- Не поддерживает многообразие устройств
9
ПРИМЕРЫ САЙТОВ
АДАПТИВНЫЙ ДИЗАЙН САЙТОВ / VOXWEB.RU
10
ПРИМЕРЫ САЙТОВ
АДАПТИВНЫЙ ДИЗАЙН САЙТОВ / VOXWEB.RU
КНИГА
10
Responsive Web Designby Ethan Marcotte
АДАПТИВНЫЙ ДИЗАЙН САЙТОВ / VOXWEB.RU 11