Руководство для начинающих по размерам изображений WordPress (лучшие практики)

Вы хотите узнать о размерах изображений WordPress?

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

В этом руководстве для начинающих мы объясним распространенные размеры изображений WordPress и поделимся лучшими практиками о том, как узнать, какие размеры использовать на вашем сайте.

Что такое размер изображения?

Размер изображения обычно обозначает ширину и высоту изображения, измеряемые в пикселях. Например, 1600×900 пикселей означает изображение шириной 1600 пикселей и высотой 900 пикселей.

Эти измерения также называются размерами изображения.

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

WordPress Design Tips for Beginners | The Journey

Размер файла изображения — это место, которое файл изображения занимает на компьютере, и измеряется в байтах. Например, 100 KB (килобайт).

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

Что приводит нас к форматам файлов изображений.

Форматы файлов изображений — это технологии сжатия для сохранения файлов изображений. Наиболее часто используемые в Интернете — JPEG и PNG.

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

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

Более подробно о форматах файлов изображений читайте в нашей статье о том, как оптимизировать изображения в WordPress.

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

Какого размера должны быть мои изображения для сайта WordPress?

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

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

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

Вы увидите три размера: средний, миниатюра и большой.

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

Эти размеры не будут видны на экране «Медиа», и единственный способ увидеть эти дополнительные размеры — зайти в диспетчер файлов на вашем хостинге WordPress.

Затем перейдите в папку /wp-content/uploads/ и выберите там любую папку года для просмотра. Это поможет вам увидеть все различные размеры изображений, которые генерирует ваш сайт WordPress.

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

Какие размеры изображений использовать в записях блога

Вы должны выбрать размер изображения для постов вашего блога в зависимости от вашей темы WordPress.

Например, некоторые темы WordPress имеют одноколоночный макет, который позволяет использовать более широкие изображения.

С другой стороны, некоторые темы WordPress используют многоколоночные макеты (контент + сайдбар), что означает, что вам нужно соответствующим образом настроить ширину изображения.

Для большинства блогов вы можете использовать следующие размеры изображений:

• Одноколоночный макет: 1200×675
• Двухколоночный макет: 680×382

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

Например, если вам нужно добавить блок ‘Media and Text’, то вы можете соответствующим образом настроить размер изображения. В примере ниже мы используем изображение в портретном размере рядом с текстом.

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

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

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

Какие размеры изображений использовать для Featured Images

Популярные изображения, также называемые миниатюрами постов, — это функция темы WordPress. Это означает, что ваша тема будет определять, какого размера изображения отображать.

Например, некоторые темы WordPress могут использовать стандартное соотношение сторон 16:9 для размеров главного изображения (например, 680×382 пикселей).

Некоторые темы WordPress могут также использовать главное изображение в качестве более крупного изображения заголовка. Для этого могут понадобиться изображения большего размера (например, 1200×675).

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

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

Аналогично, если ваша тема WordPress использует квадратные изображения для главной картинки, то мы рекомендуем использовать изображения размером не менее 600×600 пикселей.

• Для тем, использующих прямоугольные главные изображения: 1200×687 пикселей
• Для тем, использующих квадратные изображения: 600×600 пикселей

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

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

Теперь, если ваша тема WordPress использует встроенные изображения с соотношением сторон 16:9, то вы также можете использовать их в качестве изображений для социальных сетей Twitter и Facebook (признана экстремистской организацией на территории РФ).

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

Для этого вам понадобится плагин All in One SEO для WordPress. Это лучший плагин WordPress SEO на рынке, используемый более чем 3 миллионами сайтов. Он поможет вам оптимизировать ваш сайт для поисковых систем и социальных сетей.

Обратите внимание на : Существует также ограниченная бесплатная версия All in One SEO, которую вы можете попробовать.

Сначала вам нужно установить и активировать плагин. Для более подробной информации смотрите наше пошаговое руководство по установке плагина WordPress.

После активации плагин запустит мастер настройки. Следуйте инструкциям на экране, чтобы завершить работу мастера. Вы также можете посмотреть наше руководство по настройке All in One SEO для получения пошаговых инструкций.

После этого вам нужно посетить Все в одном SEO » Социальные сети страницу и переключиться на вкладку Facebook (признана экстремистской организацией на территории РФ). Отсюда вы можете установить ‘Featured Image’ в качестве источника изображений Open Graph по умолчанию.

Затем вы можете переключиться на вкладку Twitter и сделать то же самое.

Не забудьте нажать на кнопку Save Changes, чтобы сохранить настройки.

Если в вашей теме WordPress используются изображения другого размера, то Facebook (признана экстремистской организацией на территории РФ) и Twitter могут не отобразить их должным образом.

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

Просто создайте изображение с соотношением сторон 16:9 (1200×675 пикселей или 680×382 пикселей). Затем отредактируйте пост или страницу и прокрутите вниз до раздела Настройки AIOSEO под редактором.

Отсюда вам нужно перейти на вкладку Social и прокрутить вниз до раздела Image source. В выпадающем меню выберите «Пользовательское изображение», а затем загрузите изображение Facebook (признана экстремистской организацией на территории РФ).

Повторите этот процесс и на вкладке Twitter.

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

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

Какой размер изображения использовать для логотипа сайта в WordPress

Многие темы WordPress позволят вам узнать, какой размер изображения следует использовать для логотипа вашего сайта.

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

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

В этом случае мы рекомендуем загрузить изображения разных стилей и размеров, чтобы увидеть, что лучше всего подходит для вашего бренда. Размер изображения логотипа 300×200 пикселей может быть хорошей отправной точкой.

Редактирование изображений для вашего сайта WordPress

Большинство пользователей WordPress не являются графическими дизайнерами по профессии. Однако для создания изображений для вашего сайта WordPress вам придется использовать программное обеспечение для редактирования изображений.

WordPress сам по себе поставляется с некоторыми базовыми инструментами редактирования изображений. Чтобы воспользоваться ими, просто перейдите в раздел Медиа » Библиотека страница и нажмите на изображение.

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

Откроются опции редактирования.

Инструменты включают в себя базовое изменение размера изображения, обрезку, поворот и переворачивание.

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

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

• Canva — бесплатное веб-программное обеспечение для редактирования изображений. Она также включает готовые шаблоны для изображений на сайте, логотипов, изображений для социальных сетей и т.д.
• Pixlr — бесплатное программное обеспечение для редактирования изображений на основе веб-приложений. Может использоваться для легкого изменения размера изображений для записей вашего блога.
• Gimp — бесплатное программное обеспечение для редактирования изображений с открытым исходным кодом. Она работает как встроенное настольное приложение на Windows, Mac и Linux. Можно использовать для изменения размера изображений, добавления текстовых слоев, редактирования фотографий и т.д.

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

Источник: www.wpbeginner.com