Салина Мария ФЖЗ-401

Задание 1

Сравнительный анализ дизайна сайтов


       Для сравнения я взяла два новостных сайта с разными подходами: BBC News (https://www.theguardian.com/media/bbc) и Lenta.ru (https://lenta.ru/). Это позволит наглядно рассмотреть контраст между современной и устаревшей дизайн-моделями.


1)BBC News

1. Характеристика дизайн-модели

BBC News нельзя назвать современным новостным сайтом. Здесь видно,что используется чистый, консервативный Flat-дизайн с акцентами в духе Material Design (особенно в интерактивных элементах). Доминирует, безусловно, flat-подход: минимализм, отсутствие декоративных эффектов, четкая сетка и типографика. Всё это напоминает газетный разворот, что ещё раз указывает на устаревшую модель дизайна. Material Design проявляется в логике работы интерактивных компонентов. 

2. Доказательства на примерах (описание элементов)

· Плоские элементы: кнопки, навигационные вкладки, карточки новостей — все это простые прямоугольные области без градиентов, теней, скруглений или текстуры. Цвет фона и обводки сплошные.

· Монохромная иконография: иконки (меню, поиск, шевроны) выполнены в тонкой линии (line icon style), одноцветные, предельно упрощенные.

· Четкая типографика и сетка: основной акцент на тексте. Используется фирменный шрифт BBC Reith, строгая модульная сетка. Заголовки четко отделены от тела текста, нет нагромождения.

· Элементы Material Design: при наведении на карточку новости или ссылку появляется тонкая, едва заметная тень или изменение цвета фона (эффект поднятия), что соответствует принципу тактильности Material. Анимации плавные и функциональные (например, раскрытие меню).

 


 


3. Избыточные или неудачные элементы других моделей

Практически отсутствуют. BBC — эталон последовательности. Можно отметить лишь очень сдержанное использование скругленных углов у некоторых тегов или кнопок (что является тенденцией "пост-flat" эпохи), но это интегрировано органично и не противоречит общей модели.

4ехнологическое юзабилити сайта удобно на компьютере или ноутбуке (указывает ещё раз на старый формат дизайна). Если же зайти с телефона весь текст превратиться в сплошную стену текста, а между ними будут пустые пробелы. Можно сделать вывод, что сайт не настроен под телефон.  В целом технологии больше помогают перемещаться по сайту, они не мешают восприятию информации, как и говорилось уже выше - ничего лишнего. 

· Преимущество: простота и ясность, скорость восприятия и доступность. Дизайн полностью подчинен контенту и формату старого новостного сайта, не отвлекает читателя. 

· Недостаток: пользователям он может показаться излишне строгим, холодным и честно просто напросто скучным. Бренд BBC явно строго относится к экспериментам, оставляя формат газетного разворота, что явно оттолкнет современную аудиторию.

· Коррективы: если смысл сайта именно в старом формате, то хотелось бы, чтобы была и ориентация под телефон. 

2) Lenta.ru 

1. Характеристика дизайн-модели 

Lenta.ru выглядит более современный формат сайта, но все-таки прям его технологичность нельзя назвать прям новой, скорее здесь используется смешанная и скорее устаревшая модель. В основе лежат остатки скевоморфизма и тяжелого веб-дизайна 2000-х, с наложенными сверху элементами Flat-дизайна.

2. Доказательства на примерах (описание элементов)

· Элементы скевоморфизма и «тяжелого» дизайна. Градиенты и объем: кнопка «Читать далее», шапка сайта, фоны некоторых блоков используют насыщенные градиенты (от темно-к красному к черному) все эти элементы выглядят громоздко и создают не нужный «шум».
·Текстуры: в фоне шапки, разделителях есть слабовыраженные текстуры, имитирующие матовую поверхность.
·Массивные рамки и разделители: сплошные жирные линии разделяют блоки, создавая ощущение «клетки».
·Плоские (Flat) элементы вперемешку: плоские иконки в основном меню, простые цветные плашки для рубрик. Но они соседствуют с объемными элементами, создавая диссонанс.
·Нарушенная сетка и типографика: множество шрифтов разных размеров и насыщенности из-за этого сетка выглядит перегружена, количество колонок и их ширина часто меняются, что мешает восприятию.
·Основная проблема — смешение несмешиваемого. Например, плоская карточка новости с простым текстом (flat) помещена в блок с градиентной рамкой и тенями (скевоморфизм). Кнопки в разных частях сайта выглядят по-разному: одни плоские, другие — объемные с градиентом. Все это создает хаос.







3. Основная проблема — смешение несмешиваемого. Например, плоская карточка новости с простым текстом (flat) помещена в блок с градиентной рамкой и тенями (скевоморфизм). Кнопки в разных частях сайта выглядят по-разному: одни плоские, другие — объемные с градиентом. Это создает хаос и плохую UX-логику.

4. Технологическое юзабилити сайта удобная, перемещаться и искать что-то вполне легко. Про технологии говорилось подробнее выше, с одной стороны они помогают, с другой есть бесполезный шум, который мешает восприятию.

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

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

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

Общий вывод

С точки зрения современной дизайн-модели, юзабилити и эстетики мне кажется лучше сайт BBC News. Хотя он и выглядит устаревшим, по функционалу кажется проще. Здесь есть последовательность и чистота модели: BBC придерживается выбранного плоского дизайна, что создает целостный, предсказуемый и профессиональный интерфейс. Lenta.ru — пример эклектики, где разные стили борются друг с другом. Также можно сказать про ориентацию на контент и пользователя: дизайн BBC служит одной цели — донести новость. Он минималистичен, не мешает чтению, имеет отличную доступность. Дизайн Lenta.ru часто конкурирует с контентом за внимание. Можно еще добавить про визуальную иерархию: на BBC сразу понятно, что главная новость, а что второстепенная. На Lenta.ru из-за нагромождения элементов иерархия смазана.


Задание 2

Технологическая модель сайта СМИ


1.Выбор сайта и общая оценка технологичности

Для анализа я выбрала уже более близкую для русскоязычной аудитории новостную платформу РИА Новости (https://ria.ru/).

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

2.

2.1 Наличие RSS и мультимедиа

· RSS: Присутствует. Сайт предоставляет обширную ленту RSS (rss.ria.ru), что характерно для традиционных новостных ресурсов.



· Мультимедиа (видео, аудио, фото): Очень развиты. Это одна из сильных сторон сайта.

· Видео: Прямые трансляции, видео новости, отдельный раздел «Видео». Плеер функционален, но не самый современный.

· Аудио: Подкасты «РИА Новости» и «радио Рио Новости» в специальном разделе с встроенным плеером.

· Фото: Высококачественные фотоленты, слайд-шоу, часто в формате «фотогалереи».

2.2 Наличие интерактивных элементов

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

· Чат-окна, онлайн-консультанты: Отсутствуют в явном виде на главной странице. Возможно, есть в сервисных разделах.

2.3 Наличие многомерных элементов (3D, VR, AR)

· 3D, VR, AR: Практически отсутствуют в ежедневном контенте. Технологии виртуальной и дополненной реальности могут изредка использоваться в отдельных специальных мультимедийных проектах (например, виртуальные туры по историческим местам), но они не являются частью основного интерфейса или потока новостей.





3. Функция технологичных элементов и их важность

· Мультимедийные элементы (видео, аудио, фото): Важнейшие. Их функция — повышение информационной насыщенности, наглядности и эмоционального воздействия материалов. Они превращают текст в мультимедийную историю, что критично для современной журналистики.

· Интерактивная инфографика и карты: Важные, но второстепенные в основном потоке. Их функция — объяснение сложных данных, процессов и географических событий. Они служат инструментом аналитики и визуализации, повышая глубину понимания.

· Браузерные уведомления: Второстепенные с точки зрения контента, но важные для платформы. Их функция — маркетинговая и "удерживающая". Они возвращают пользователя на сайт, увеличивая его охват и время использования.

· Отсутствие массовых 3D/VR: Показывает, что эти технологии для РИА Новости остаются экспериментальными и нишевыми, не core-функцией, а способом выделить отдельный проект.

4. Технологическое юзабилити сайта

Помощь vs. Помехи:

· Помогают:

  1. Четкая структура и обилие ссылок (хотя и приводит к визуальному шуму) позволяют быстро найти нужный раздел (Политика, Экономика и т.д.).

  2. Встроенные плееры удобны для потребления аудио и видео без перехода на сторонние платформы.

  3. Push-уведомления эффективны для отслеживания срочных новостей.

· Мешают:

1. Сильная перегруженность страницы элементами: огромное количество новостных блоков, баннеров, ссылок. Это затрудняет фокусировку, создает ощущение информационного винегрета.

2. Не всегда адаптивный дизайн: На некоторых разрешениях или мобильных устройствах сайт может выглядеть тесным, элементы наезжают друг на друга.

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

4. Некоторые интерактивные элементы (например, сложные карты) могут грузиться медленно.

Влияние на восприятие информации:
Технологии на ria.ru формируют восприятие информации как массивного, официального, всеохватного потока. Вы не получаете лаконичную curated-ленту (как в некоторых современных медиа), а погружаетесь в море разносторонних данных. Мультимедиа и интерактив делают сложные темы доступнее, но общая перегруженность интерфейса может утомлять и рассеивать внимание. Сайт технологичен изнутри (контент), но его оболочка (юзабилити) отстает от трендов на минимализм и фокус.

Комментарии

Популярные сообщения из этого блога

салина ми фжз-301 задание по верстке

Аудитория печатных и сетевых СМИ (Слина М.И. ФЖЗ-301)