Анализируемый сайт: https://www.vedomosti.ru

Интерфейс:

Строгий, выдержанный, в деловом стиле: светлый фон, контрастный шрифт и чёткие блоки. Акцент на читаемость, сдержанные цвета и крупные изображения. Общий вид приятный и удачный для делового издания, контент легкодоступен. Выбирая сайт для задания, еще не прочитав полностью критерии, я искала тот, который меня в наибольшей степени привлечет и где-то на подсознательном уровне именно «Ведомости» меня больше всего порадовали интерфейсом. Что самое главное по моему мнению - весь сайт структурирован, что позволяет легко и быстро в нем разобраться. (скрин 1) 

Можно быстро определиться, где основной поток новостей, где «Главное», а где можно найти статьи по тематикам. Нравится, что все быстро «попадает на глаза» и можно определить где заканчивается одна новость и начинается другая. Для примера, чтобы было понятно о чем говорю, вставлю скрин с другого сайта. 

На сайте другого СМИ, по моему мнению, трудно разобраться и "глаза разбегаются" 

Тут же все структурованно

Также, как перфекциониста, радует расположение фотографий: например, на большой собрали анонсы сразу нескольких материалов, что позволяет быстро перейти к одной теме (ПМЭФ), тут же в левом верхнем углу подписано «Сюжет», а справа - партнеры сюжета и реклама. Наведя курсор на один из сюжетов, можно перейти к нему с этой же фотографии. 

Также в интерфейсе стоит отметить то, что каждый материал подписан под определенной рубрикой. Навигация по сайту интуитивно понятна - все элементы управления легко распознаются и для большинства действий достаточно всего одного клика. Это делает взаимодействие с ресурсом простым и удобным. Особенно помогает визуальная маркировка: ключевые кнопки выделены жирным шрифтом, что сразу привлекает внимание и подсказывает пользователю, куда следует нажать. Все кнопки активны, на сайте можно также быстро найти как авторизоваться, можно выбрать «локацию» новостей (по значку «лупа»), предлагается «Россия и мир», «Северо-запад» (при нажатии перебрасывается на сайт https://spb.vedomosti.ru), и «Юг» (при нажатии перебрасывает на сайт (https://south.vedomosti.ru). Также мы видим ссылку на телеграмм канал СМИ и две кнопки «Подписка» и «Газета», при том, что обе перебрасывают на страницу с покупкой подписки, но могу предложить, что при ее наличии, страница «Газета» может открыться и по-другому.

Вызывают негатив только значки «Замка» рядом с некоторыми новостями, кликнув на материл с такой, сайт предлагает купить подписку для ее прочтения, к сожалению, таких материалов много. 

(Пока писала и делала скрины, новости обновились поэтому на скринах разные материалы)

Из приятных плюсов: при чтении непосредственно самой статьи, сверху появляется «Бегунок» по горизонтали, который увеличивается при пролистывании вниз, давая понять объем материала, также радует то, что что блоки с рекламой не мешают чтению. 

Тип верстки

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

Колоночный макет и технологии

Используется адаптивная сортировка колонок. Вероятно, применён Grid Layout. Bootstrap/Foundation не очевидны: стиль сайта. фирменный, с кастомной сеткой. Анимации экрана - минимальные: плавный переход между состояниями меню, нет всплывающих подсказок/окон, есть бегущая строка, которую, кстати, можно поставить на паузу. 

Типографика

Шрифт - современный без засечек (сан‑сериф?), однородный, удобочитаемый. На вебе вероятно используются системные шрифты (Arial, Roboto, Helvetica?). Удобен: буквы разборчивы, контраст достаточен, расстояние между строкми оптимально для чтения.

Юзабилити и влияние верстки

Адаптивность: на мобильных верстка перестраивается и блоки выстраиваются в одну колонку, меню превращается в гамбургер - удобно. 

Также есть «карусель», то есть остановившись на одном блоке можно начать листать вправо. 

Карусель, где Мнения

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

Вывод 

Верстка сайта «Ведомости» в целом удачна: она структурирована, логична и не перегружена лишними элементами. Благодаря этому информация воспринимается легко - взгляд быстро находит ключевые блоки, а навигация не отвлекает от содержания. Такой подход способствует лучшему усвоению новостей и аналитики.