Что скрывается за выражением Medium внешность

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

Что скрывается за выражением «Medium внешность»? Это не про волосы и одежду, а про внешний вид самой платформе и ваших публикаций: шрифты, отступы, цветовые акценты и общее ощущение «уюта для мыслей», которое Medium дарит читателю. Ниже — подробная разметка того, что делает Medium визуально особенным, как настроить «обличье» своего блога и куда бежать, если что-то пошло не так.

Почему Medium выглядит «как в кино» — 5 главных фишек дизайна

  1. Единый шаблон, который нельзя испортить.
    Платформа предлагает минимум опций форматирования, поэтому 95 % статей выглядят аккуратно и одинаково читаемо: «жирный», курсив, заголовки H2–H4, цитата, ссылка, и всё.
  2. Типографика как фетиш.
    Serif-шрифт Charter для заголовков и sans-serif Kievit для основного текста создают ощущение печатного журнала.
  3. Щедрые «воздушные» поля.
    По бокам экрана до 50 % свободного пространства, глаз «дышит» и быстрее бегает по строкам.
  4. Фон всегда белый, чёрный текст #1a1a1a.
    Никаких ядовитых цветов и мигающих баннеров — Medium сразу говорит: «контент важнее обёртки».
  5. Адаптив без компромиссов.
    На 320 px и на 2560 px статья смотрится одинаково элегантно: изображения масштабируются, цитаты не «ехать».

Как «примерить» внешний вид на себя — пошаговая инструкция

Личный блог vs Публикация

На Medium есть два уровня внешности:

  • Личный аккаунт. URL вида medium.com/@yourname, кастомизации ноль — только аватарка и био.
  • Публикация (Publication). Это как «журнал» внутри Medium. Можно:
    • загрузить логотип (PNG, 72×72 px),
    • выбрать акцентный цвет (один из 8 предустановленных),
    • сделать собственный заголовок и подзаголовок,
    • задать фоновое изображение хедера (jpeg, 1400×400 px).

Настройка «обличья» публикации

  1. Зайдите в Settings → Publication → Homepage & Design.
  2. Загрузите логотип и фон хедера. Важно: Medium сама обрежет изображение до 16:9, поэтому держите лица и тексты по центру.
  3. Выберите Brand color. Он станет цветом кнопок «Follow» и ссылок. Вариантов немного, но глаз не устанет.
  4. Добавьте favicon (32×32 px), иконка появится во вкладке браузера.

Оформление самой статьи

  • Обложка: Settings → Story → Change featured image. Размер 1200×675 px (соотношение 16:9).
  • Верхний «kickers» (поджанр над заголовком): просто на первой строке поставьте заглавные буквы и оформите как H3.
  • Разделители: используйте --- — Medium превратит их в элегантную тонкую линию.
  • Видео лучше вставлять с YouTube: платформа автоматически поставит превью 16:9 и кнопку «Play» Medium-стайл.

Типовые ошибки «внешности» и как их исправить

  • Поменяйте фоновое изображение или выберите спокойный акцент (#00AB6B)
  • Ошибка Как выглядит Быстрое решение
    «Тесный» абзац Все строки слитно, отступ 0 px Между абзацами ставьте пустую строку
    Огромные картинки Фото 4000 px в ширину весит 10 МБ Сжать до 1600 px, вес до 250 КБ
    Красный логотип на розовом фоне Brand color = #FF1744, фон #FFC0CB
    Лишние ссылки в шапке В меню 15 пунктов Оставьте 3–4 самых важных

    Контакты и поддержка, куда бежать за помощью

    • Официальный справочный центр Medium
      https://help.medium.com/hc/ru
      Разделы «Design & Layout» и «Publications», исчерпывающие гайды на английском, но с GIF-скриншотами.
    • Форум русскоязычных авторов в Telegram
      https://t.me/medium_ru
      3 200+ участников, обсуждаем внешний вид статей и делимся шаблонами обложек.
    • Почта поддержки
      yourfriends@medium.com — ответ приходит в течение 24–48 ч. Укажите тему «Publication design issue».
    • Twitter-поддержка
      @MediumSupport
      Отвечают с 9:00 до 18:00 EST. Можно приложить скриншот проблемы.
    • Консультация дизайнера-волонтёра
      Пишите в личку в Telegram @medium_mentor, бесплатно помогает начинающим публикациям «одеться» за 30 минут.

    Краткий чек-лист перед публикацией

    1. Обложка статьи 1200×675 px, ≤250 КБ.
    2. Аватар публикации 72×72 px, читаемый на белом фоне.
    3. Brand color не сливается с фоном хедера.
    4. В статье не менее трёх заголовков H2 для навигации.
    5. Каждая картинка с подписью в italics.
    6. Ссылки открываются в новой вкладке (target="_blank" проставляется автоматически).

    Главное помнить: на Medium «внешность» не должна кричать о себе. Чем проще и чище визуальный ряд, тем больше внимания достаётся самому смыслу. Удачных публикаций и безупречного «Medium-фейса»!