Задание "Креативное письмо, дизайн и верстка печатных и сетевых СМИ",
1) Укажите сайт СМИ, который вы рассматриваете. В целом оцените его графический интерфейс - кажется ли он вам удачным или нет?
Беру случайный региональный новостной портал - Омск-Информ - Последние новости Омска и Омской области ( https://omskinform.ru )
Дизайн сайта. У меня произвел впечатление типичного современного регионального новостного портала, ориентированного на быстрый доступ к информации. Интерфейс построен по принципу новостной ленты: в центре располагается главная новость с крупной фотографией, рядом размещены дополнительные материалы, рубрики и рекламные блоки.
Цветовая гамма. Темно-синий, белый, оранжевый. Синий цвет используется в шапке, навигации и на фото, как градиент, благодаря чему формируется узнаваемый стиль сайта. Оранжевый - акцент, он привлекает внимание к важным разделам и новостям.
В целом интерфейс можно оценить как функциональный, но перегруженный. Пользователь сразу получает доступ к большому количеству материалов, однако рекламные баннеры, боковые блоки и высокая плотность информации создают визуальный шум и усложняют восприятие страницы. Но ничего, это же СМИ, нужно донести как можно больше информации.
К плюсам сайта можно отнести понятную навигацию, удобное расположение основных разделов. Недостатком является перегруженность главной страницы и устаревший по современным меркам стиль оформления. И реклама АЗС на полстраницы...но это тоже ничего, это доп.заработок.
2) Укажите тип верстки на этом сайте (симметричная, рваная или рандомизированная). Аргументируйте;
Тип верстки - рандомизированная.
Аргументы. С одной стороны, на сайте есть элементы симметричной верстки: верхняя панель с логотипом, меню и поиском расположена ровно и стабильно, а основная структура страницы делится на несколько колонок.
Однако центральная часть страницы выглядит более «рваной». Новости имеют разный размер, некоторые материалы выделяются крупными фотографиями, рядом расположены короткие текстовые новости, рекламные баннеры и боковые информационные блоки. Элементы не выстроены строго симметрично и визуально отличаются по высоте и ширине.
Также на сайте заметен принцип сеточной организации контента: новости распределены по блокам и колонкам, что частично напоминает Grid Layout. Однако сама структура страницы остаётся смешанной, поэтому верстку сайта можно охарактеризовать именно как рандомизированную.
3) Предположите какой колоночный макет использован на сайте - Grid Layout, Foundation или Bootstrap,а возможно такого макета нет вообще? Есть ли на выбранном вами сайте экранная анимация?
Проверка по запросу grid не выявила совпадений, поэтому сделать вывод об использовании Grid Layout как основной технологии нельзя. Поиск по ключевым Bootstrap-селекторам (col-sm, col-xs, col-md, col-lg) также показал отсутствие совпадений, следовательно, данный фреймворк на сайте, вероятно, не используется.
Проверка по ключевым словам columns и medium не подтвердила использование Foundation. Также не было найдено совпадений по запросу @keyframes, поэтому выраженная CSS-анимация на сайте отсутствует.
Однако визуально на сайте присутствуют простые интерактивные эффекты: подсветка элементов при наведении курсора, изменение состояния кнопок и плавная смена рекламных баннеров. Такие эффекты делают интерфейс более динамичным и улучшают взаимодействие пользователя с сайтом.
Я проверяла на других сайтах, подумав, что что-то делаю неверно ,почитала другиеисторичники и вот какой вывод могу сделать. Судя по структуре страницы, сайт использует собственную систему верстки с элементами сеточной организации контента: материалы распределены по колонкам и блокам, однако явных признаков Bootstrap, Foundation или Grid Layout обнаружено не было.
4) Охарактеризуйте типографику сайта - тип шрифта, если можете установить - то и сам шрифт. Насколько на ваш взгляд используемый шрифт удобен?
Типографика сайта соответствует формату современного новостного портала. На сайте используется преимущественно текстовый шрифт без засечек (sans-serif, он визуально похожий на Arial, Helvetica или их веб-аналоги) Такой шрифт удобен для чтения с экрана, поэтому хорошо подходит для новостных сайтов с большим количеством информации.
На сайте соблюдается понятное разделение текста по важности, благодаря чему пользователь быстрее ориентируется в новостной ленте. Для основного текста используются простые текстовые шрифты, а заголовки выполняют титульную функцию, так как визуально выделяют важные материалы. Акцидентные элементы также частично присутствуют, например, в логотипе сайта и некоторых рекламных баннерах, где используются более яркие и декоративные шрифты для привлечения внимания.
В целом используемая типографика выглядит достаточно удобной и читаемой. Однако из-за большого количества новостей, рекламы и дополнительных блоков страница местами кажется перегруженной, что немного усложняет восприятие информации.
5) Охарактеризуйте юзабилити сайта. Насколько верстка сайта СМИ удачна в целом? Влияет ли она на ваше восприятие информации, и если да, то как?
5. Юзабилити сайта. В целом можно оценить как достаточно удобное для новостного портала. Сайт хорошо выполняет свою главную задачу- быстро предоставляет пользователю большое количество актуальной информации.
На сайте соблюдается принцип группировки информации. Новости разделены по блокам, присутствуют отдельные колонки с главными материалами, лентой новостей и дополнительными разделами. Пользователю легко понять, где находится основная информация, а где второстепенная. Также используются привычные элементы управления: меню, поиск, новостная лента и кнопки навигации расположены в стандартных местах, поэтому интерфейс интуитивно понятен.
С точки зрения UX-дизайна сайт ориентирован скорее на информативность, чем на минимализм. Главные новости хорошо выделяются фотографиями и крупными заголовками, благодаря чему пользователь быстро просматривает страницу и находит важные материалы. Это соответствует принципу «люди не читают, а просматривают».
Однако на сайте присутствует большое количество рекламы, дополнительных блоков и ссылок, из-за чего возникает визуальный шум. Это немного нарушает принцип KISS («делай проще») и увеличивает нагрузку на восприятие информации. Иногда пользователю сложно сосредоточиться только на новостях, так как внимание постоянно переключается на рекламные элементы и боковые колонки. Радует, что нет блока куки и окон всплывающих.
В целом верстку сайта можно считать удачной для регионального СМИ, так как она позволяет быстро получать доступ к новостям и большому объему контента, о чем я писала выше. При этом интерфейс выглядел бы современнее и удобнее при меньшем количестве визуально перегружающих элементов. Но это СМИ, а не сайт по мастер классам или контентному мероприятию. Задачи разные.
Информация о UX-дизайне и принципах юзабилити очень помогла при анализе сайта, потому что благодаря ей стало проще понять, почему одни элементы интерфейса воспринимаются удобно и логично, а другие создают ощущение перегруженности и визуального шума. Это прям очень годная информация, мне это помогло разобраться в моих рабочих моментах, спасибо Вам!
Комментарии
Отправить комментарий