Медиа Philipp Kontsarenko
3 977

Издание «Мотор» провело редизайн сайта

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

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

Новая рубрикация позволила нам тщательнее структурировать материалы — теперь все статьи, фотогалереи или видеоподборки относятся к одному из пяти разделов.

Для пользователей, которые заходят на сайт «Мотора» не каждый день, разработчики создали систему оповещений: «В левой колонке на главной странице всегда можно увидеть, сколько новых материалов появилось в каждой рубрике с момента последнего посещения». 

Страницы статей реализованы в виде лонгридов: фотографии на всю ширину страницы, более крупный текст и большие фотогалереи:

Мобильной версии у сайта издания нет.

Версия сайта motor.ru в конце 2014 года

ЦП попросил UX-специалиста Антона Фролова прокомментировать обновление «Мотора».

Антон ФроловUX-эксперт
Если коротко, то был «Большой тест-драйв» со Стиллавиным, а стал Top Gear с Джереми Кларксоном.

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

Ранее редизайну подверглись другие отечественные издания — « Ведомости» и «Слон».

#Интерфейсы #медиа #сми #интернет_издание #редизайн_издания

{ "author_name": "Philipp Kontsarenko", "author_type": "editor", "tags": ["\u0441\u043c\u0438","\u0440\u0435\u0434\u0438\u0437\u0430\u0439\u043d_\u0438\u0437\u0434\u0430\u043d\u0438\u044f","\u043c\u0435\u0434\u0438\u0430","\u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u044b","\u0438\u043d\u0442\u0435\u0440\u043d\u0435\u0442_\u0438\u0437\u0434\u0430\u043d\u0438\u0435","\u0434\u0438\u0437\u0430\u0439\u043d"], "comments": 14, "likes": 12, "favorites": 1, "is_advertisement": false, "subsite_label": "media", "id": 7140, "is_wide": true }
00
дни
00
часы
00
мин
00
сек
(function(){ var banner = document.querySelector('.teaserSberbank'); var isAdsDisabled = document.querySelector('noad'); if (!isAdsDisabled){ var countdownTimer = null; var timerItem = document.querySelectorAll('[data-sber-timer]'); var seconds = parseInt('15388' + '59599') - now(); function now(){ return Math.round(new Date().getTime()/1000.0); } function timer() { var days = Math.floor(seconds / 24 / 60 / 60); var hoursLeft = Math.floor((seconds) - (days * 86400)); var hours = Math.floor(hoursLeft / 3600); var minutesLeft = Math.floor((hoursLeft) - (hours * 3600)); var minutes = Math.floor(minutesLeft / 60); var remainingSeconds = seconds % 60; if (days < 10) days = '0' + days; if (hours < 10) hours = '0' + hours; if (minutes < 10) minutes = '0' + minutes; if (remainingSeconds < 10) remainingSeconds = '0' + remainingSeconds; if (seconds <= 0) { clearInterval(countdownTimer); } else { timerItem[0].textContent = days; timerItem[1].textContent = hours; timerItem[2].textContent = minutes; timerItem[3].textContent = remainingSeconds; seconds -= 1; } } timer(); countdownTimer = setInterval(timer, 1000); } else { banner.style.display = 'none'; } })();
{ "id": 7140, "author_id": 4, "diff_limit": 1000, "urls": {"diff":"\/comments\/7140\/get","add":"\/comments\/7140\/add","edit":"\/comments\/edit","remove":"\/admin\/comments\/remove","pin":"\/admin\/comments\/pin","get4edit":"\/comments\/get4edit","complain":"\/comments\/complain","load_more":"\/comments\/loading\/7140"}, "attach_limit": 2, "max_comment_text_length": 5000, "subsite_id": 199130 }

14 комментариев 14 комм.

Популярные

По порядку

Написать комментарий...
6

Мне вот интересно, они там бюджеты чтоли пилят с какими-нибудь знакомыми веб-студиями? Или у них там в штате сидят такие криворукие хрен пойми кто?
Шел 2015 год.
На первом скриншоте можно увидеть чудесную адаптивную верстку.
На втором скриншоте можно увидеть шикарную продуманную верстку, когда люди даже не проестировали её на двухстрочных заголовках.
Открыл статью, дошел до подобия слайдера картинок, жму вправо - с тормозами перемещается все. Заглядываю под капот - реализовано с помощью изменения margin-left. ПИЗДЕЦ.
И ко всему прочему, у меня сайт не может до конца загрузится не на одной из страниц, в статусе вкладки крутится лоадер а сайт слегка подтормаживает при скроллинге.

Ответить
0

Согласен, игнорить адаптивку - это просто убить Рамблер.

Ответить
2

И где тут интерфейсы?

Ответить
1

Текст крупноват, мало на странице убирается. Новости непонятно зачем всегда сверху нависают сужая пространство для чтения. Субъективно некомфортно.

Ответить
0

Согласен. У меня аж горит на этот "свисающий тренд". Очень некомфортно с ноутбука

Ответить
0

Вот-вот. Можно было сделать "выезжающую" панель, что куда удобнее и приятнее глазу.

Ответить
1

Сыро, сырее некуда. С ненужными наворотами при прокрутке, которые воспаляют мозг.

Косяков столько, что обскриншотиться можно.

Ответить
1

Галерея как не работала на Safari, так и не работает... Эх.

Ответить
1

drive.ru - дизайн более удобен на мой взгляд

Ответить

Комментарий удален

Комментарий удален

Комментарий удален

Комментарий удален

Комментарий удален

0

Статья классная, кстати. В топгировском стиле.

Ответить
0

Зачем меню и инфолента не прокручиваются? Занимают много места и раздражают...

Ответить
0

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

Ответить
0

Сразу видно, делал "типа модный UX дизайнер", который не был увлечен сайт.

Ответить
0

Не вижу главного комментария:
ГДЕ АВТОСПОРТ???

Ответить

Комментарий удален

Комментарий удален

Комментарий удален

0

Прямой эфир

[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox_method": "createAdaptive", "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fizc" } } }, { "id": 4, "label": "240х200_mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "flbq" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjog" } } }, { "id": 10, "disable": true, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "disable": true, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "bscsh", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "createAdaptive", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-223676-0", "render_to": "inpage_VI-223676-0-1104503429", "adfox_url": "//ads.adfox.ru/228129/getCode?pp=h&ps=bugf&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid10=&puid21=&puid22=&puid31=&puid32=&puid33=&fmt=1&dl={REFERER}&pr=" } }, { "id": 15, "label": "Плашка на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudx", "p2": "ftjf" } } }, { "id": 16, "label": "Кнопка в шапке мобайл", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byzqf", "p2": "ftwx" } } }, { "id": 17, "label": "Stratum Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvb" } } }, { "id": 18, "label": "Stratum Mobile", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvc" } } }, { "id": 19, "label": "Тизер на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "p1": "cbltd", "p2": "gazs" } } } ]
Приложение-плацебо скачали
больше миллиона раз
Подписаться на push-уведомления