Привет, это команда HUB. В этом материале мы не будем говорить о том, что Apple убирает из коробки блок зарядки и наушники из-за заботы об окружающей среде, о цене на акции Tesla или о новом документальном фильме от Netflix «The Social Dilemma» – мы поговорим о картинках.
Работа с изображениями добавляет материалам вариативности и в целом делает их интереснее для читателя. Сейчас мы расскажем о требованиях платформы и о том, как оформить ваш материал без проблем.
Минимально рекомендованные размеры:
Материал:
- Обложка — 1280 на 1280 (формат: .PNG, размер не должен превышать 2MB)
- Изображение внутри материала – 1280px на 960px (формат: .PNG, размер не должен превышать 2MB)
Страница резидента:
- Аватар – 180 на 180 (формат: .PNG, размер не должен превышать 2MB)
- Шапка – 1600 на 98 (формат: .PNG, размер не должен превышать 2MB)
При загрузке изображений (обложек, оформления страницы резидента или картинок внутри материалов) мы рекомендуем:
Не делать этого из режима инкогнито
Для обработки изображения используется браузерное хранилище «local storage», отключенное в режиме инкогнито (режим инкогнито запрещает доступ к файловой системе пользователя).
Не использовать сторонние файлообменники/фотохостинги
Мы заботимся о скорости загрузки ваших медиафайлов, доступности и сохранности вашего контента – он может стать недоступным в связи с прекращением предоставления услуг по самым различным причинам. Поэтому мы настаиваем на загрузке ваших медиафайлов на наш сервер.
Придерживаться правил по формату и размеру изображений
Большинство проблем с изображениями возникает именно из-за того, что они не соответствуют форматам платформы.
Изображение на обложке:
Обложка – 1280 на 1280 (формат: .PNG, размер не должен превышать 2MB)
Интерфейс загрузки изображения (шаг 2 при создании поста) выглядит интуитивно понятным. Если же у вас возникают сложности с картинками каждый раз, когда вы постите материал, – вот краткий гайдлайн, который поможет избежать ошибок.
При загрузке картинки (если вы не использовали рекомендованный размер) она может не полностью заполнить выделенное для нее место (см. рисунок ниже «Неправильно») – картинка на обложке будет обрезанная, или же с белыми бортами там, где изображение не заполнило выделенное для нее место.
Как избежать подобной ошибки? HUB позволяет растягивать и перемещать (для перемещения следует «зажать») изображение внутри превью посредством меню (см. рисунок ниже).
Пожалуйста, учтите, что в некоторых вариантах отображения ваше изображение будет обрезано в связи с изменением пропорций отображения – отцентрируйте изображение в редакторе так, чтобы основная смысловая нагрузка находилась в его центре (особенно, если на изображении присутствует текст).
Изображение внутри материала:
- Иллюстрация –1280 на 720 (формат: .PNG, размер не должен превышать 2MB)
Продублируем еще раз важную информацию:
- не используйте режим инкогнито/впн при публикации изображений;
- не используйте сторонние файлообменники/фотохостинги;
- придерживайтесь рекомендаций по формату и размеру изображений
Нативные инструменты HUB позволяют изменять изображения в публикации.
После загрузки медиафайла наведите на него курсор и нажмите на пиктограмму карандаша:
Мы рекомендуем настроить изображение согласно скриншоту ниже:
Внутри материала вы можете изменять размер изображения. Просто потяните за границы изображения:
Инструменты, которые использует команда ForkLog HUB для создания изображений:
Pixelmator Pro – MacOS приложение для создания/редактирования изображений. Пригодится как автору, так и целой команде из-за удобного экспорта изображений и максимального количества удобных инструментов (например, набора профессиональных кистей для художников, или инструментов, которые позволяют вырезать элементы изображений за считанные секунды).
Figma – кросс-платформенный онлайн-сервис дизайнеров и разработчиков интерфейсов. Главное преимущество – возможность командной работы в общем рабочем поле.
Есть вопросы?
Пишите @romankoshevoy или hub@forklog.com
Немного спойлеров к будущему обновлению – чуть позже мы обо всем расскажем:
