«Медуза» выглядит как-то по-другому… Или мне кажется? Не кажется! Мы обновили дизайн по случаю 12-летия (и просто потому, что давно хотели это сделать)

20 октября «Медузе» исполнилось 12 лет. Сайт, запущенный в 2014 году, был сделан совсем для другой «Медузы», которая работала совсем в другом интернете (как минимум он стабильно работал!). У нас были короткие заголовки, мало форматов, мы любили горизонтальные фотографии. Теперь у нас большое издание с кучей разделов, с материалами в самых разных жанрах, включая игры, а еще: книжное издательство, магазин, мобильное приложение и целое семейство отдельных продуктов, включая обожаемые нами инстаграм и ютуб. Что это значит? Правильно, самое время кое-что переделать.

Мы называем это обновление дизайна «Медузы» глоу-апом, а не редизайном. Мы не переделываем все с нуля, но исправляем то, что за 12 лет перестало хорошо работать, убираем ненужные ограничения и расширяем возможности там, где это нужно.

То есть вам не придется заново разбираться, как пользоваться «Медузой»: все самое важное — на месте, но стало удобнее и выглядит, как мы надеемся, лучше. Мы вводим обновления постепенно. Начали летом с мобильной версии сайта, теперь пришла очередь самого важного апдейта — главной страницы «Медузы» (и это еще не конец!).

Новая главная страница: больше воздуха, меньше ограничений

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

Звучит как небольшое обновление. На самом деле теперь главная страница «Медузы» может (и будет) выглядеть очень по-разному — в зависимости от того, какие истории нашли наши журналисты и на чем редакция хочет сделать акцент.

Чтобы представить себе, как это работает, посмотрите несколько версий главной страницы с одним и тем же набором публикаций (нажимайте кнопку «плей»):

Заголовки больше не перекрывают фотографии

Когда «Медуза» только появилась, редакция использовала более короткие заголовки — в среднем на две-три строки. Со временем заголовки, мягко говоря, подросли и стали занимать пять-шесть строк. Теперь мы не просто сообщаем, что произошло, а сразу даем контекст: объясняем, почему новость важна и о чем будет материал. В наших внутренних правилах так и написано: «Заголовок должен рассказывать историю». 

Старая верстка не была рассчитана на такие длинные заголовки, и это стало проблемой. Когда заголовок ложился поверх обложки, иногда нельзя было ни прочитать текст, ни рассмотреть изображение. 

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

Кроме того, мы поменяли размер шрифта у заголовков и подзаголовков, чтобы в этой группе появилась визуальная и смысловая иерархия. Редакторам это нововведение тоже на руку: теперь в заголовок и подзаголовок влезает еще больше букв (надеемся, они не будут злоупотреблять).

Разные форматы фотографий

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

Теперь мы можем использовать квадратные и вертикальные фотографии. Это особенно важно, когда изображение нужно показать крупнее. 

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

Конечно, горизонтальные фотографии тоже никуда не исчезнут. Не каждый кадр можно обрезать без потери смысла, и в этой ситуации мы выберем достоверность, а не верстку.

Меньше рамок

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

Но материалы у нас очень разные. Где-то важно показать большую фотографию, где-то нужен длинный заголовок. Что уж говорить о новых форматах, которые мы давно придумали, но не могли воплотить из-за ограничений старой верстки.

В общем, как вы уже поняли, мы отказались от большинства рамок и разделителей. И очень этому рады! Потому что теперь можем свободнее сочетать материалы разного размера и по-новому расставлять акценты на главной странице «Медузы».

Другие мелочи, но тоже важные

Что еще нового:

• Блоки «Читайте также» внутри материалов — теперь это всегда превью материала с картинкой. Раньше было то с картинкой, то без нее. Стало, кажется, нагляднее и красивее. Надеемся, это мотивирует вас чаще переходить по ссылкам!
• Все тексты внутри материалов отныне отцентрованы. Когда-то в большинстве публикаций «Медузы» справа располагался баннер, и в этом случае текст прижимался к левому краю. Затем баннеры куда-то исчезли (вместе с рекламой), и в итоге в половине материалов правая часть страницы стала пустой. Этого дисбаланса больше нет, все аккуратно и логично.
• Разделы «Истории», «Разбор» и «Подкасты» можно скроллить до бесконечности, а наполняются они автоматически. Раньше редакторы вручную добавляли туда новые тексты, и какие-то из них, естественно, терялись по дороге. Больше не будут!

Конечно, на этом мы не остановимся. Следом за главной страницей будем переделывать оформление самих материалов, которое мы неромантично называем «внутренностями».

Запуск новых форматов — дело времени. Намекнем, что мечтаем смотреть видео и фотоистории прямо на главной странице «Медузы». 

Если у вас идеи, что еще было классно добавить или улучшить, присылайте их сюда [email protected].

В конце — о самом важном

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

Глоу-ап — это проект из нормальной реальности, по которой мы все так скучаем. Он связан не с борьбой за жизнь, а с желанием навести красоту, экспериментировать, создавать новое. Вы не представляете, как мы истосковались по таким задачам и с каким удовольствием готовили эти обновления.

Заодно мы обещаем снова начать рассказывать о внутренней жизни «Медузы». Постараемся делать это регулярно и не уныло.

«Медузе» исполнилось 12 лет. Если вы хотите поддержать и как-то поздравить редакцию, пожалуйста, подпишитесь на донат. Получать подарки на день рождения — еще одна традиция из нормальной жизни, по которой мы скучаем.