Дизайн и юзабилити новостного сайта играют важнейшую роль наравне с контентом. Основная цель дизайна — удержать человека на сайте как можно дольше, увеличить количество кликов, а также создать удобную и понятную навигацию, сделать пользование сайтом комфортным. Можно разделить вопросы дизайна на две части: дизайн, который создает эмоциональный контакт и дизайн, который выполняет более функциональное назначение (удержание на сайте, увеличение глубины просмотра). UI и UX дизайн. 1. На эмоции влияют шрифты, соотношение свободного и заполненного пространств, верстка, цветовое решение, логотип и многое другое. Я проанализировал несколько изданий с этой точки зрения. Lenta.ru выиграла конкурс на лучший дизайн. С точки зрения эмоциональный сайт практически нейтрален и даже холодноват, не уютен. В таких вопросах приходится уходить в оценочные суждения. Три цвета, красный и бежевый применяются очень сдержанно. Бежевый создает как раз уютную атмосферу, но безликое оформление и отсутствие графических деталей эту атмосферу делают холоднее. Такая картина характерна и логична для журналистских изданий, ведь здесь важна независимость и нейтральность. ABCNews имеет не самый красивый сайт, даже аляповатый. Это позиционирует его как сайт с быстрой и не очень хорошо обработанной информацией. Но оформление как раз кажется более дружелюбным из-за использования гротескных шрифтов, что отличает ресурс от Lenta.ru. Еще одним «грехом» можно назвать перегруженность сайтов, зажатость и тесноту. Это характерно для РИА новостей, Регнум и многих других. Несоразмерностью элементов характерен дизайн Vesti.ru. Сайты СМИ условно можно поделить на две части - одна делает сайты красивые, выверенные, где много белых полей и минимум плашек, линий, и вторая часть делает сайты с огромным количеством информации, набранной самым популярным шрифтом, некачественными фотографиями, нарочитой рекламой. Яркий пример второй группы - Комсомольская Правда. Яркий пример первой группы Bloomberg. Вот уж действительно сайт, в который вложились. Здесь ничего лишнего, запоминающиеся цвета и шрифт, отличная адаптация под все экраны, оптимальный балланс белого и заполненного пространства, разнообразие верстки, близкое к журнальной. Полная противоположность сайт КП, который и рассчитан на менее требовательную публику, которая привыкла к такому дизайну. Если дизайн КП соответствует запросам аудитории, то сайт Forbes.ru отнюдь не похож на сайт для богатых бизнесменов. Он скромный, с большим количеством рекламы и куцым оформлением и совершенно не соответствует статусу. 2. Возможно, более важна, чем сторона эмоциональная, сторона функциональная. Ведь именно удобство навигации, удобочитаемость и правильное расположение блоков на странице обеспечивает комфорт пользователю и заставляет его смотреть глубже. Возьму для анализа сайт Lenta.ru. Дизайн Lenta.ru признан лучшим в мире дизайном новостного сайта, по версии The Society for News Design (SND). Заключение международного жюри: «Сайт красиво оформлен, правильное количество свободного пространства во всех разделах», «Тонкие, но функциональные детали прекрасно вписываются в интерфейс», «сдержанная, но последовательная цветовая палитра делает сайт приятным для просмотра», «страницы специальных проектов, архивы и другие специальные разделы сайта усиливают общую красоту и самобытность проекта». И вообще, «У сайта простая, доступная и приятная навигация». Действительно, читая статью, ничего не отвлекает, по бокам страницы белые поля. Казалось бы, это уменьшит вероятность, что пользователь перейдет прочитать что-то еще, однако они сделали более эффективный ход. Врезка прямо в текст небольшого блока с подборкой новостей. Это не навязчиво, это противодействует «баннерной слепоте» пользователя на сайте и увеличивает глубину просмотра. Главная страница в настоящее время уже практически не используется, так как 80% переходов обеспечивается из соц. сетей прямо на страницу материала. Поэтому Forbes.com (английская версия) сделали главную страницу невыразительной, но когда переходишь в рубрику или на страницу материала, то сайт преображается, появляется множество графических эффектов, большие и яркие фотографии. Одним из важнейших показателей главной страницы является то, насколько быстро и удобно человеку найдет интересующие его новости. Некоторые сайты выкладывают всего и побольше, в надежде, видимо, что человека хоть что-то из этого заинтересует. Другие сайты напротив сужают разброс и четко управляют глазами пользователя. ABCnews имеет один главный материал, ленту новостей слева и по центру списком заголовки. Направление взгляда пользователя предопределено. На сайте Риа Новости, например, глаза будут блуждать по экрану и искать за что зацепиться, шум вокруг отвлечет человека. С другой стороны, такой же дизайн КП помогает людям, которым нечего делать подольше «побродить» по сайту, и это не кажется скучным пролистыванием страницы вниз. Bloomberg показывает себя с лучшей стороны. Четко выделено главное, дополнительные материалы по теме, топ-статьи и новости. Присутствует цветовое выделение рубрик. Под последними новостями на главной странице идут блоки сюжетов, по которым много материалов и которые развиваются долго, например, скандал с Volkswagen. Необычное решение: когда дочитываешь один материал, ниже подгружается следующий. Таким образом создается “бесконечная страница”. По бокам есть реккомендации, но они вписаны органично и не раздражают. Новый сайт «Медузы» предоставляет выпускающему редактору полную свободу действий в формировании информационной картины дня. Вся страница представляет собой конструктор, построенных на нескольких шаблонах. Каждый шаблон —это   линия. Единственное ограничение: линия всегда должна быть полностью загружена материалами. Шаблонов существует 5. Такой способ верстки сайта копирует газетную верстку. Сайт постоянно меняется, лучше выделяется главное и вообще сайт живее и оригинальнее. Об этом в блоге Meduza «Зачем это нужно? Чтобы главные страницы сайта соответствовали текущему моменту. Например: — Тихий день. Ничего не происходит. Новости можно поставить пониже, а сверху поставить крутой материал, не связанный с новостной повесткой. — Адский день. Происходит что-то из ряда вон. Вся главная должна быть про это и очень быстро и заметно меняться. Материалы (быстрая реакция) меняются на срочные новости, все это собирается в темы и постоянно обновляется». Важный момент — писать ли описание к новости или только заголовок? Опасны обе крайности. Если не делать описание, то пользователя можно не зацепить заголовком. Если сделать слишком большое описание, то человеку может просто не захотеться переходить на страницу новости и читать дальше. Также необходимо учесть такой сценарий, который могут закладывать разработчики — главным итогом должен быть клик по рекламе. Сделать это проще всего, если сделать рекламу неотличимой от редакционных. Чаще всего надпись «новость от партнеров» делают, но глаз пропускает эту информацию. Раньше этим страдали многие сайты, Эхо Москвы, например. Сейчас эта реклама ушла с большинства качественных сайтов, осталась на маленьких и таких, как http://argumenti.ru/, например. Mail.ru активно работает с новыми форматами подачи материалов. Их главная страница построена по формату «гамбургера», многие рубрики так же. «Это серия «поясов», «строк», «врезов» или «контейнеров», которые активно используются в современных промо-сайтах. Мобильные построены по схожему принципу. http://afisha.mail.ru/», — пишет Юрий Ветров, UX разработчик mail.ru. Он продолжает: «Мы объявили войну колонкам – как правило, это склад чего попало, который ограничивает и портит компоновку страницы. Благодаря этому главная стала «строчной». Она и выглядит более собранной, и работать с ней удобнее. … Воронки прокрутки для главных страниц и ключевых разделов показали, что пользователи охотно скроллятвниз и отваливаются мало». Как и во всех дизайн продуктах, нужно ориентироваться на задачи, которые стоят перед СМИ. В первую очередь нужно увеличивать глубину просмотра и точно удовлетворять эстетические предпочтения аудитории. Во всем нужно соблюдать баланс: читателю должно быть комфортно. Большинство сайтов справляются с необходимым минимумом задач. В основном же видны явные недоработки и непродуманность. Вероятно, это связано с недостаточным профессионализмом и уровнем финансирования СМИ.