В последнее время в Интернете стало появляться все больше статей на тему адаптивного дизайна (АД). В основном, это переведенные статьи зарубежных авторов. Существует множество различных мнений и взглядов на этот подход к дизайну сайтов. Немало споров ведется даже при определении самого термина. И в нашей компании нет однозначного единого мнения.

1. Доклад
«Адаптивный дизайн:
модный тренд или реальное
будущее?»
Авторы:
Алябьев Александр, Курочкин Евгений, Белоусов Евгений

2. Немного истории
1. Фиксированный дизайн.
2. Резиновый дизайн.
3. Ограничено-резиновый дизайн.
4. Отзывчивый дизайн / Адаптивный
дизайн (первое упоминание 2010 год).
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

3. Примеры сайтов
www.mediaqueri.es
подборка сайтов с адаптивным дизайном
www.skinnyties.com
от создателя Angry Birds
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

4. Преимущества
+ удобно на любом устройстве
+ два сайта в одном:
для мобильных устройств и
десктопа
+ можно отказаться от разработки
мобильного приложения
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

5. Недостатки
- упрощает дизайн или вводит
пользователя в заблуждение
- долго и дорого
- дважды долго и дорого
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

6. Для каких сайтов подойдет?
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»
Блоги
Сайты-визитки
Новостные сайты
Простые и понятные сервисы
E-commerce (Интернет-магазины, службы)
Корпоративные сайты
Порталы

7. Когда мы называем сайт
«резиновым» ?
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

8. «Резина» = %
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»
/

9. При любой ширине хорошо
использовалась площадь экрана.
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»
2500 px
768 px
320 px

10. Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

11. Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

12. Сетка
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

13. Навигация
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»
Меню
Продукты
Загружаемые файлы
Поддержка

14. Таблицы
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

15. Видео, изображения
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

16. Текст
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

17. Медиазапросы
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

18. Формы
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»
Подпись
ПодписьПодпись
Подпись

19. И что в итоге?
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

20. И что в итоге?
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»
2.0«Резина »

21. • АД — замена мобильной версии сайта
• АД для SEO: преимущества и
недостатки
• АД для Екоммерс
• Заменит ли АД мобильные
приложения?
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

22. Трафик есть! Работать необходимо!
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

23. Рост сегмента мобильного
трафика
www.zhivika.ru
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

24. Решения для работы с
мобильным трафиком
• Специальная мобильная версия
сайта
• Адаптивный дизайн для всех типов
устройств
• Мобильное приложение
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

25. Советы от
• Прекратите создавать сайты для
мобильных устройств!
• Один сайт для всех типов
устройств. Одна контентная база,
один функционал.
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

26. Почему АД полезен для SEO?
• Юзабилити
• Уникальный контент
• Плюсы при ранжирование в
мобильном поиске
• Равномерное наращивание ссылочной
массы
• Преимущество раннего использования
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

27. Минусы
- Время установки
- Большой объем страницы?
Не лишайте свой сайт для мобильных
устройств информации.
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

28. Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

29. Для iOS:
• Рост числа конверсий 65.71%
• Рост числа транзакций 112.50%
• Рост дохода 101.25%
Для Android:
• Рост числа конверсий 407.32%
• Рост числа транзакций 333.33%
• Рост дохода 591.42%
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

30. Мобильный трафик:
• Рост числа конверсий 162.50%
• Рост числа транзакций 382.61%
• Рост дохода 370.61%
Не мобильный трафик:
• Рост числа конверсий 71.70%
• Рост числа транзакций 177.03%
• Рост дохода 136.06%
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

31. Наличие всей необходимой
информации для выбора и
покупки товара на одном экране,
для любого устройства.
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

32. Заменит ли АД мобильные
приложения?
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

33. Заменит ли АД мобильные
приложения?
Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»

34. Доклад:
«Адаптивный дизайн: модный тренд или реальное будущее?»
http://blog.index-art.ru/
Задавайте вопросы.
Кто не успеет, можно
обсудить в нашем блоге: