DUMP-2013 Проектирование интерфейсов - Адаптивный дизайн:...

Preview:

Citation preview

Доклад

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

Авторы:Алябьев Александр, Курочкин Евгений, Белоусов Евгений

Немного истории1. Фиксированный дизайн.

2. Резиновый дизайн.

3. Ограничено-резиновый дизайн.

4. Отзывчивый дизайн / Адаптивный дизайн (первое упоминание 2010 год).

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

Примеры сайтов

www.mediaqueri.esподборка сайтов с адаптивным дизайном

www.skinnyties.comот создателя Angry Birds

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

Преимущества

+ удобно на любом устройстве

+ два сайта в одном: для мобильных устройств и десктопа

+ можно отказаться от разработки мобильного приложения

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

Недостатки- упрощает дизайн или вводит

пользователя в заблуждение

- долго и дорого

- дважды долго и дорого

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

Для каких сайтов подойдет?

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

Блоги

Сайты-визитки

Новостные сайты

Простые и понятные сервисыE-commerce (Интернет-магазины, службы)

Корпоративные сайты

Порталы

Когда мы называем сайт «резиновым» ?

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

«Резина» = %

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

/

При любой ширине хорошо использовалась площадь экрана.

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

2500 px

768 px

320 px

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

Сетка

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

Навигация

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

Меню

Продукты

Загружаемые файлы

Поддержка

Таблицы

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

Видео, изображения

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

Текст

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

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

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

Формы

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

Подпись

ПодписьПодпись

Подпись

И что в итоге?

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

И что в итоге?

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

2.0

• АД — замена мобильной версии сайта

• АД для SEO: преимущества и недостатки

• АД для Екоммерс

• Заменит ли АД мобильные приложения?

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

Трафик есть! Работать необходимо!

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

Рост сегмента мобильного трафика

www.zhivika.ru

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

Решения для работы с мобильным трафиком• Специальная мобильная версия

сайта

• Адаптивный дизайн для всех типов устройств

• Мобильное приложение

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

Советы от

• Прекратите создавать сайты для мобильных устройств!

• Один сайт для всех типов устройств. Одна контентная база, один функционал.

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

Почему АД полезен для SEO?

• Юзабилити

• Уникальный контент

• Плюсы при ранжирование в мобильном поиске

• Равномерное наращивание ссылочной массы

• Преимущество раннего использования

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

Минусы

- Время установки

- Большой объем страницы? Не лишайте свой сайт для мобильных устройств информации.

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

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

Для iOS:• Рост числа конверсий 65.71%• Рост числа транзакция 112.50%• Рост дохода 101.25%

Для Android:• Рост числа конверсий 407.32%• Рост числа транзакция 333.33%• Рост дохода 591.42%

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

Мобильный трафик:• Рост числа конверсий 162.50%• Рост числа транзакция 382.61%• Рост дохода 370.61%

Не мобильный трафик:• Рост числа конверсий 71.70%• Рост числа транзакция 177.03%• Рост дохода 136.06%

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

Наличие всей необходимой информации для выбора и покупки товара на одном экране, для любого устройства.

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

Заменит ли АД мобильные приложения?

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

Заменит ли АД мобильные приложения?

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

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

http://blog.index-art.ru/

Задавайте вопросы.

Кто не успеет, можно обсудить в нашем блоге:

Recommended