Как уравновесить логотипы в одном ряду

Проверьте видимый знак внутри каждого файла, прежде чем менять ширину в макете.

Подготовка материалов2 мин чтения

Двум PNG-логотипам задана ширина 120 пикселей, но один выглядит намного меньше. Прежде чем увеличивать его, откройте файл на контрастном фоне: прозрачные поля могут занимать большую часть выделенной ширины.

Ширина включает пустое пространство

Браузер масштабирует всё изображение, включая прозрачные края. Если один знак занимает половину ширины своего файла, а другой заполняет её целиком, одинаковая ширина изображений не уравняет знаки.

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

При одинаковых границах файлов видимые знаки различаются по размеру; удаление лишних прозрачных полей уравнивает видимый размер одного и того же знака.

Удаляйте только ненужные пустые края. Обязательное охранное поле бренда вокруг логотипа сохраняйте в готовом макете.

Уберите лишние поля из копии

  1. Сохраните утверждённый оригинал; сделайте копию для передачи.
  2. Покажите копию на светлом и тёмном фоне, чтобы найти слабые штрихи, тени и настоящий силуэт.
  3. Обрежьте неиспользуемые прозрачные поля, не задев эти детали. Руководство по прозрачному фону поможет отличить остатки по краям от самого изображения.
  4. Экспортируйте без изменения пропорций, верните копию в то же место шириной 120 пикселей и сравните ещё раз.

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

Разные формы всё равно требуют визуальной проверки

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

Проверьте читаемость названий, визуальный вес и целостность краёв. Если нужное увеличение размывает знак, получите более чёткий исходник по руководству по разрешению изображений. Итогом должны стать пропорциональные знаки и осмысленные отступы, а не одинаковые значения ширины ради самих значений.

Все статьи