Как оптимизировать изображения для Интернета и SEO: подробное руководство

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

Изображения не только делают ваш контент более приятным для чтения, они также могут помочь вам SEO на странице , В этом посте вы узнаете, как убедиться, что все изображения, которые вы используете на своем сайте, оптимизированы с точки зрения имени файла, размера, альтернативного текста (супер важно!), Релевантности темы, размещения и многого другого.

), Релевантности темы, размещения и многого другого

Если вы предпочитаете видеоуроки, посмотрите нижеприведенный Bjorn из WPLearningLab.

WordPress Image SEO для лучшего рейтинга в поисковых системах | WP Learning Lab

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

Давайте начнем, не так ли?

Выбор правильного изображения

Релевантность является ключевой:

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

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

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

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

Вы также можете использовать расширенный поиск картинок Google и выполнять различные поиски, чтобы сузить свои результаты: все эти слова; это точное слово или фраза; любое из этих слов; ни одно из этих слов. Я обычно просто вписываю слово для поиска в поле «все эти слова», и оно, кажется, работает хорошо.

Далее вы можете дополнительно сузить свои результаты по следующим параметрам: размер изображения; соотношение сторон; цвета в изображении; тип изображения; область, край; сайт или домен; Безопасный поиск (вы можете использовать это, чтобы отфильтровать явные результаты); тип файла (.jpeg, .png, .gif и т. д.); и наконец права использования.

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

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

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

Обратите внимание: перед повторным использованием контента, найденного с помощью расширенного поиска изображений Google на вашем веб-сайте, убедитесь, что его лицензия является законной, и ознакомьтесь с полными условиями повторного использования. В некоторых случаях лицензия может потребовать от вас предоставления кредита (в виде ссылки или иным образом) создателю исходного изображения.

Выбор лучшего формата файла

При определении размера изображений для Интернета есть несколько различных форматов файлов, которые вы можете использовать. Я почти всегда использую файлы JPEG или PNG, но в свое время я создал пару анимированных GIF-файлов.

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

Что я делаю: используя Adobe Photoshop Размер изображения соответствует ширине области содержимого моего сообщения или страницы, затем выберите «Сохранить для Web и устройств». Оказавшись в этом окне, я переключаюсь между JPEG-High и PNG-24 и вижу, какой из них дает наименьший тип файла. Для фотографий JPEG всегда меньше и его следует использовать. Для графического текста или других изображений PNG часто меньше.

Смешивая это

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

Используйте красивую смесь следующих типов изображений:

иллюстрации, картины и рисунки
диаграммы, графики и таблицы
инфографика или другая графика, которую вы разрабатываете сами
анимированные GIF
скриншоты (особенно хорошо они подходят для постов туториалов)

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

Использование описательных имен файлов

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

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

Если у вас есть изображение улыбающегося ребенка, гораздо лучше назвать файл Smiling-child.jpg, чем просто оставить оригинальное имя файла (например, _DSC0428.jpg). Убедитесь, что когда вы называете свои файлы, вы разделяете слова тире (name-your-file-like-this.jpg), потому что эта черта интерпретируется Google как пробел (и Bing тоже).

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

Написание подписей при необходимости

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

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

Убедитесь, что вы используете альтернативный текст

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

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

Описательный альтернативный текст (выделен жирным шрифтом) в следующей ссылке на изображение помогает идентифицировать картинку для поисковых систем (действительно ли люди используют что-то кроме Google?)

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

Обращая внимание на размещение изображения

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

Правильный размер изображений

Ширина области содержимого на моем сайте составляет 665 пикселей, поэтому я соответствующим образом изменяю размер своих изображений (иногда даже меньше).

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

Если вы загружаете изображения с размерами 4288 x 2848 пикселей и отображаете их с разрешением 600 x 400 пикселей путем изменения исходного кода, это серьезно замедлит работу вашего веб-сайта (и излишне займет много места на сервере). Сделайте одолжение посетителям вашего сайта и сохраните ваши изображения в правильном размере для вашей области контента.

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

Вот что я делаю

Я использую Adobe Photoshop для определения размера своих изображений, затем выбираю «Сохранить для Web и устройств» и выбираю jpg или png в зависимости от того, какое это изображение и какой тип файла меньше. Затем я использую EWWW Image Optimizer для дальнейшего сжатия моих файлов изображений. Это бесплатный плагин, который отлично работает и даже позволяет оптимизировать изображения.

Сжатие ваших файлов

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

Доступно несколько различных плагинов, включая следующие:

EWWW Image Optimizer - Это мой плагин для сжатия файлов изображений, и я очень рекомендую его. Любые изображения, которые вы загружаете в медиатеку, будут автоматически оптимизированы, и вы можете использовать их инструмент массовой оптимизации, чтобы сжать любые файлы, которые были загружены перед установкой и активацией плагина.

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

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

В бесплатной версии WP Smush используется сжатие без потерь, но если вы приобретаете профессиональную версию, вы можете использовать сжатие с потерями (называемое Super-Smush), которое дополнительно уменьшает размеры файлов с минимальной потерей качества изображения.

Kraken.io - С помощью API Kraken вы можете оптимизировать файлы .png, .jpg и .gif. Чтобы настроить плагин, вы должны сначала зарегистрировать бесплатный аккаунт на kraken.io. После регистрации вы получите API и секретный ключ, который вы можете использовать на нескольких сайтах WordPress.

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

Сжатие изображений JPEG и PNG - В отличие от других плагинов, уже упомянутых, этот предлагает только методы сжатия с потерями. Он не предлагает слишком много опций конфигурации в настройках, но позволяет вам выбрать максимальное разрешение для загружаемых изображений и указать, какие именно размеры изображений вы хотите сжать (например, уменьшенное изображение, большое и т. Д.).

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

Почему я должен сжимать изображения моего сайта?

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

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

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

Заключение

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

Напомним, вы хотите иметь в виду следующие вещи:

Выберите правильный тип изображения для вашего контента.
Выберите правильный формат файла (JPEG, PNG или GIF).
Используйте уникальную смесь изображений (фотографии, иллюстрации, диаграммы, инфографика и т. Д.).
Используйте описательные имена файлов с ключевыми словами и тире между каждым словом.
Вставьте подписи к изображениям, но только если они повышают ценность для читателя. Вам не нужно использовать их все время.
Не забудьте ввести альтернативный (или альтернативный) текст для ваших изображений. Объясните изображение с ключевыми словами естественным образом. Никогда не набивайте нигде ключевые слова!
Помните о размещении изображения. В коротком посте поместите изображение вверху. Если ваш пост длиннее, рассмотрите возможность размещения изображений рядом с каждым подзаголовком.
Размер изображения для ширины содержимого ваших сообщений / страниц. Не загружайте гигантские файлы, только чтобы отобразить их в небольшом размере.
Используйте плагин или онлайн-инструмент, чтобы сжать файлы изображений и сделать их еще меньше.

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

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

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

Вам нужна помощь в создании веб-сайта WordPress? Зарегистрируйтесь для вашего БЕСПЛАТНАЯ установка WordPress сегодня.

Если вы нашли этот пост полезным, пожалуйста, поделитесь им и распространите информацию!

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

Вы и я (если вы являетесь SEO, и если вы читаете это, то, скорее всего, знаете), оба знают, что это не так, но так ли это?
Вы и я (если вы являетесь SEO, и если вы читаете это, то, скорее всего, знаете), оба знают, что это не так, но так ли это? И даже если вы скажете им, они поймут? Возвращаясь к мой пост на прошлой неделе , если бы я остановился и сдался в середине 2016 года, я был бы здесь:

Как вы знаете, SEO означает поисковая оптимизация Это просто означает, что веб-страницы должны быть лучше для рейтинга в поисковых системах, но как именно это работает?
Вы и я (если вы являетесь SEO, и если вы читаете это, то, скорее всего, знаете), оба знают, что это не так, но так ли это? И даже если вы скажете им, они поймут? Возвращаясь к мой пост на прошлой неделе , если бы я остановился и сдался в середине 2016 года, я был бы здесь:

Как вы убедитесь, что ваш сайт оптимизирован для местного ресторана SEO?
Как вы убедитесь, что ваш сайт оптимизирован для местного ресторана SEO? Физический адрес . Важно, чтобы ваш физический адрес отображался на вашем веб-сайте. Во-первых, ваши клиенты ищут ваше местоположение. В конце концов, как они могут посетить и поесть, если они не знают, как вас найти? Во-вторых, поисковые системы, такие как Google, используют ваш адрес в своих результатах. Поисковые системы хотят направлять людей на лучший результат для каждого поискового

Аудит занимает как минимум 1 день для небольших сайтов, так что вы можете себе представить, что бесплатный аудит SEO не будет аудитом, но может составить 2% от аудита?
Аудит занимает как минимум 1 день для небольших сайтов, так что вы можете себе представить, что бесплатный аудит SEO не будет аудитом, но может составить 2% от аудита? 5%? И опять мне приятно. И к тому же не самые важные части конечно. Я предпочитаю не говорить, что я думаю об этом способе заманить (или «солгать», иди, я говорю слово) к потенциальным клиентам, что случайно дает ложное представление о SEO-аудите. заключение Короче говоря, не стесняйтесь делать аудит

Например, просмотрите это супер-полезное руководство от Google под названием Как работает поиск Поисковик Лендс отлично " Что такое SEO?
Аудит занимает как минимум 1 день для небольших сайтов, так что вы можете себе представить, что бесплатный аудит SEO не будет аудитом, но может составить 2% от аудита? 5%? И опять мне приятно. И к тому же не самые важные части конечно. Я предпочитаю не говорить, что я думаю об этом способе заманить (или «солгать», иди, я говорю слово) к потенциальным клиентам, что случайно дает ложное представление о SEO-аудите. заключение Короче говоря, не стесняйтесь делать аудит

После того, как вы настроили свой веб-сайт на успех в поисковых системах, как вы можете определить, достигли ли вы результатов?
После того, как вы настроили свой веб-сайт на успех в поисковых системах, как вы можете определить, достигли ли вы результатов? Маркетологи должны знать, как отслеживать рейтинг своих сайтов и прогресс SEO, чтобы они могли продолжать делать то, что работает, и корректировать то, что не работает. Цели вашего сайта уникальны для вашего бизнеса. Тем не менее, есть некоторые показатели, на которые почти все сайты должны обратить внимание. На этом уроке по SEO вы научитесь

Но как только вы подготовите свою страницу (или если она уже опубликована), как вы узнаете, сколько раз вы фактически использовали ключевое слово на странице?
Но как только вы подготовите свою страницу (или если она уже опубликована), как вы узнаете, сколько раз вы фактически использовали ключевое слово на странице? Есть два простых способа проверить это. 1. (Это лучше всего работает на рабочем столе). Выберите нужную страницу на экране, затем, удерживая нажатой кнопку ctrl на клавиатуре, нажмите клавишу F. Маленькая коробка появится. В этом поле введите ключевое слово, которое вы ищете, нажмите ввод, и он не только покажет вам,

Это не означает, что вы никогда не должны делиться личными данными, но это означает оценку всего потенциального контента через призму «подходит ли это моим клиентам и коллегам?
Это не означает, что вы никогда не должны делиться личными данными, но это означает оценку всего потенциального контента через призму «подходит ли это моим клиентам и коллегам?» Создавайте социальные сигналы, делая контент простым для обмена: есть ли на каждой странице вашего сайта кнопки, которые облегчают обмен вашим контентом? Как насчет каждого сообщения в вашем блоге? Потратьте время, чтобы установить программу, такую как Поделись этим

Как эта статья о том, что такое SEO на странице и SEO вне страницы, и как они могут быть важны для вашего электронная коммерция ?
Это не означает, что вы никогда не должны делиться личными данными, но это означает оценку всего потенциального контента через призму «подходит ли это моим клиентам и коллегам?» Создавайте социальные сигналы, делая контент простым для обмена: есть ли на каждой странице вашего сайта кнопки, которые облегчают обмен вашим контентом? Как насчет каждого сообщения в вашем блоге? Потратьте время, чтобы установить программу, такую как Поделись этим

Вы владелец электронной коммерции и у вас есть SEO агентство , Вы постоянно спрашиваете себя, насколько хорошо они на самом деле справляются, и как вы должны судить и оценивать их успех?
Это не означает, что вы никогда не должны делиться личными данными, но это означает оценку всего потенциального контента через призму «подходит ли это моим клиентам и коллегам?» Создавайте социальные сигналы, делая контент простым для обмена: есть ли на каждой странице вашего сайта кнопки, которые облегчают обмен вашим контентом? Как насчет каждого сообщения в вашем блоге? Потратьте время, чтобы установить программу, такую как Поделись этим

Но что, если вы делаете все это и все еще испытываете затруднения при ранжировании в местном SEO?
Но что, если вы делаете все это и все еще испытываете затруднения при ранжировании в местном SEO? Эта проблема Компания, которую мы собираемся посмотреть, - это клининговая компания, расположенная за пределами Атланты. Это небольшая компания, которая стремится победить своих крупных конкурентов. Проблема в том, что физическое местонахождение их компании находится за пределами Атланты, и они пытаются ранжировать ключевые слова Атланты. Ранжирование по ключевым словам,

Давайте начнем, не так ли?
Действительно ли люди используют что-то кроме Google?
Почему я должен сжимать изображения моего сайта?
Вам нужна помощь в создании веб-сайта WordPress?
Хотите больше как это?
Обы ваш сайт чувствовался онлайн"> Хотите, чтобы ваш сайт чувствовался онлайн?
Надоело получать очень низкий трафик на ваш сайт или блог?
Это видно (позиционирование)?
Каковы его сильные стороны?
Что нуждается в улучшении?