Связьстрой Связьстрой - решение интегрированных задач Главная страница   Написать письмо    
 О КОМПАНИИ  СОБЫТИЯ  КЛИЕНТЫ  КОНТАКТЫ

Контент, готовый к адаптации

 

С начала 2011 года мы занимаемся изучением развития направления responsive web-design, транслируем достижения западных коллег в этой области и свои наработки на различных профессиональных конференциях и форумах проходящих у нас в России.

 

В этот раз мы хотим капнуть немного глубже и представить рассуждения, касающиеся необходимости систематизировать контент перед разработкой сайта по технологии responsive web-design. В тексте встречаются термины, которые могут показаться незнакомыми для многих читателей, и это нормально, т.к. они новые и мы их сформулировали, пытаясь как можно более точно передать в них смысл западной терминологии. Так, немногим более года назад мы ввели термин адаптивный веб-дизайн (responsive web-design), который уже хорошо прижился у наших дизайнеров и разработчиков. 

Контент - это основа всего. Рациональный подход к веб-разработки заключается в том, чтобы максимально точно отразить его суть средствами дизайна, типографики, верстки и другими возможными вспомогательными элементами. Адаптивный дизайн не исключение, а даже наоборот сфера, где контенту необходимо уделять значительно больше внимания, т.к. он должен быть не только по-разному структурирован для различных устройств отображения, но порой и быть сокращен, расширен или даже изменен.

Не важно, насколько поразительным кажется гибкое будущее адаптивного дизайна, оно может оказаться не таким уж радужным, если вы сперва не ответите на вопрос: «А готов ли Ваш контент к адаптации?»

Итак, сегодня мы хотели продолжить обсуждение адаптивного дизайна более детально, демонстрируя, почему нам для его подготовки нужна основа из разных типов контента, разных микроструктур, и правил, которые нам диктует бизнес, в случае если мы хотим сохранить приоритеты, взаимосвязи и смысл на страницах сайта.

Перемещение контента

Трент Уолтон из агентства Paravel прошлым летом писал в своем блоге о концепции перемещения контента. В той записи Уолтон ставит под сомнение рациональность типового подхода, который заключается в том, что при сужении размера экрана, все, что находится в боковой колонке просто сдвигается вниз под основной контент, он пишет:

«Что происходит, если первая колонка очень длинная? Действительно ли содержание колонки №2 менее важно, чем все содержание колонки №1? Скорее всего, так и есть, если это обычная статья, но, боюсь, в некоторых случаях такой метод нарушает иерархию».

Так как же происходит перемещение контента в действительности? Давайте попробуем в этом разобраться на примере нового адаптивного сайта компании Starbucks.

Если вы его еще не видели, главная страница сайта работает довольно хорошо. По ходу сужения экрана, большие ротирующиеся баннеры уменьшаются, тизеры с дополнительными сообщениями превращаются просто в точки, а новые продукты остаются выше менее важной информации, такой как публикации в блоге:

Однако, допустим, нашего пользователя интересует супермодная кофемашина Clover, которую Starbucks выкупил несколько лет назад. Cтраницу со всеми подробностями о Clover можно легко найти под разделом «Кофе», и на широких экранах визуальный приоритет вполне очевиден: сначала описание, затем модуль для поиска кафе, где есть Clover, а дальше детали о машине и о том, почему она варит такой феноменальный напиток.

Но взгляните теперь на версию для смартфона, и всё, что вы увидите - это изображение, заголовок и 400 слов маркетингового текста: о машине, процессе и даже длинный пассаж текста о качестве зёрен Starbucks. И только после всего этого, далеко-далеко внизу, вы найдёте ссылку, по которой можно выяснить, где же можно раздобыть чашечку кофе из машины Clover.

 

То же самое мы наблюдаем, если посмотрим на описание зёрен Starbucks. Переходим, в качестве примера, в раздел «Starbucks Reserve» и выбираем органический эфиопский сидамо. На обычном компьютере мы видим изображение, краткие данные о продукте и призыв купить, все на видном месте, по центру. Но на дисплее смартфона всё совсем не так: там кнопку «купить» и не найдёшь.

Так почему же блок поиска кафе оснащенного машиной Clover так сильно отделен от контента вверху страницы? Почему кнопка для покупки зёрен уехала так далеко от информации о продукте?

Почему Starbucks не может лучше координировать свой контент? Потому, что они, по всей видимости, упускают два момента:

  • Типы контента: Без определения типов контента, исходя из того, что он должен донести и какая цель в результате должна быть достигнута, ко всякому контенту относятся одинаково. Не важно, призвана ли страница информировать, помогать совершить покупку или помочь найти какое-нибудь месторасположение. Правая колонка попросту перемещается вниз, вне зависимости от того, что она содержит.

Вместо этого следует определить несколько типов контента, исходя из элементов, которые этот контент содержит и задач, которые он призван решать. В этом случае к каждому типу контента можно применять разные правила его перемещения.

  • Микроструктура: На всех страницах сайта Starbucks основной контент представлен одним большим блоком, а не разбит на части. Боковая колонка тоже один большой блок.

На сайте следует каждый тип контента привести к единой структуре, установить связи с отдельными частями информации, имеющими конкретное назначение: тизер, броская цитата, вступительный абзац.  Также стоит методично разделить длинный текст на части и вставить элемент в середину (что Уолтон называет «переплетением»), это выглядит примерно так:

Разве не идет на пользу целостности контента размещение этих кратких фактов и кнопки «купить» ближе к верху страницы? Не говоря уже о целях компании Starbucks продать кофе.

источник: advertology.ru


  Н-ТЕХНОСВЯЗЬСТРОЙ
СТРОИТЕЛЬСТВО КАБЕЛЬНЫХ ЛИНИЙ СВЯЗИ
ПРОКЛАДКА КАБЕЛЯ В ГРУНТ
ПРОКЛАДКА КАБЕЛЯ МЕТОДОМ ГНБ
ПРОИЗВОДСТВО ОПТИЧЕСКИХ КАБЕЛЕЙ И КАБЕЛЬНОЙ ПРОДУКЦИИ
  СВЯЗЬСТРОЙ
ГРАЖДАНСКОЕ СТРОИТЕЛЬСТВО
ПРОИЗВОДСТВО БЕТОНА И РАСТВОРА
УСЛУГИ АВТОБЕТОНОНАСОСА
УСЛУГИ АВТОБЕТОНОСМЕСИТЕЛЯ
ПРОИЗВОДСТВО ЖЕЛЕЗОБЕТОННЫХ ИЗДЕЛИЙ
ПРОИЗВОДСТВО МЕТАЛЛОКОНСТРУКЦИЙ
ПРОИЗВОДСТВО ПЛАСТИКОВЫХ ОКОН И ВИТРАЖЕЙ
ДЛЯ АКЦИОНЕРОВ РЕКВИЗИТЫ
НАШ КЛИЕНТ:

ОАО «Казанская ГТС»
Смотреть всех клиентов

 
Всегда отличный бетон и раствор с доставкой Участвуйте в долевом строительстве Широкий ассортимент продукции от Эликс-Кабель К
 

© 2005 ОАО «Связьстрой»
420088 Россия, Республика Татарстан,
г. Казань, ул. 1-ая Владимирская, 106,
тел. (843) 272-59-22, 273-47-36,
факс (843) 273-15-58
Контактная информация

Лицензия Государственого комитета
Российской Федерации по строительству
и жилищно-коммунальному комплексу Д 344107

ГС-4-16-02-27-0-1660003313 от 29.05.2003 г.