Оптимизация изображения

Оптимизация изображения

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

 

optimizaciya izobrazheniya

Содержание:


Оптимизация изображений, вариант — 1: Alt Text.

Что такое альтернативный текст, для изображения?

Оптимизация изображений вариант 2: Размер файла.

Оптимизация изображений вариант 3: Имя файла.

Оптимизация изображений вариант 4: Описание.

Почему кто-то вернулся к результатам поиска, покинув вашу страницу?

Как изменить размер и сделать изображения больше без потери качества?

Какое выбрать  решение?

Методы оптимизации!

Если кто-то не знает, то подскажу, что изображения может генерировать тонны трафика на основе поисковых систем (Google Images, например).

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

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

Оптимизация изображений, вариант — 1: Alt Text

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

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

Что такое альтернативный текст, для изображения?

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

Для того чтобы включить текст (описание) в изображение, вы просто добавляете в тег Alt = " альтернативный текст" тега изображения. Вот пример:

 

<IMG SRC = "child-crying.jpg" Alt = "Ребенок плачет" />, смотри рисунок.

optimizaciya-izobrazheniya

Как вы сами видите это очень просто. В настоящее время для WordPress существует множество плагинов по оптимизации изображения, как для сжатия, так и для "включения" в тег ALT заголовка статьи, и краткого описание (descriptions).

Оптимизация изображений вариант 2: Размер файла.

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

Таким образом, чтобы у вас появилась гарантия того, что ваши изображения могут в буквальном смысле "торпедировать" то есть уменьшить время загрузки страницы, нужно сделать размер файла изображения как можно меньше (без ущерба для качества, конечно). Опять же повторюсь, есть плагины для сжатия изображения для wordpress, но если вы не хотите использовать плагин, то предлагаю сервиз для оптимизации изображения, http://optimizilla.com. Выбираете файл, жмете оптимизировать, затем скачиваете и устанавливаете на страницу, все просто.

С помощью бесплатных плагинов, можно легко оптимизировать все изображений, которые находятся в блоге. CW Image Optimizer. Да, и еще одно но: Не позволяйте вашему браузеру изменять размер большого изображение самостоятельно, чтобы оно выглядело меньшего размера, что это значит?

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

Для того чтобы решить проблему со сжатием изображения, всегда используйте программы для редактирования изображений, например фотошоп, где достаточно для оптимизации изображения, просто нажать: "Файл — Сохранить для Web устройств" и указать размер, затем сохранить изображение на компьютере, ну а далее грузите уже на страницу, рисунок -1.

 

optimizaciya izobrazheniya

рисунок-1

Оптимизация изображений вариант 3: Имя файла.

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

Наберите в поисковике: "Картинки, оптимизация изображения" рисунок -2

 

optimizaciya izobrazheniya

Рисунок-2

и Google выдаст изображения, именно по этому запросу или схожему по запросу. Нажмите на любую картинку, далее нажмите "Посмотреть на странице" рисунок-1, и вы увидите это изображение на сайте.

Чтобы посмотреть подробней для полного сознания, как это видят поисковые системы, щелкните правой кнопкой мышки по изображению и выберите "Посмотреть код элемента" рисунок -3.

optimizaciya izobrazheniya

Рисунок-3

Теперь вы понимаете, что все изображения имеют ключевое слово, где seo-target, является ключевым словом. 

Оптимизация изображений вариант 4: Описание.

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

Для начала я хочу сказать, что я имею в виду показатель отказов!

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

Почему кто-то вернулся к результатам поиска, покинув вашу страницу?

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

Почему пользователь, решил остаться на сайте и продолжить просмотр страницы?

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

Рядом с вашим заголовком «Причина, по которой плачет ребенок», и имеется изображение, где четко видно, что ребенок действительно плачет, ну и что еще хорошо, имеется краткое описание (Descriptions) вверху страницы, допустим: "Что же все-таки влияет на психику ребенка, почему ребенок плачет"?

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

Скажу сразу: Идут споры о том, нужно ли описание включать в само изображение? Вывод: Хуже от этого не будет!

Итог:

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

Как изменить размер и сделать изображения больше без потери качества?

Почему изображения теряют качество при увеличении?

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

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

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

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

Какое выбрать решение?

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

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

Методы оптимизации:

Метод 1: Сохранение идеального изменения размера с Adobe Photoshop

Думаю, даже и не стоит много говорить о такой программе как Adobe Photoshop, которая позволяет изменять размеры изображения для web устройств, сохраняя качество. Программа доступна как бесплатное программное обеспечение, и имеет возможность подключения плагинов и фильтров (ограничено) для Adobe Photoshop, так и платная.

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

После установки программного обеспечения, откройте файл изображения, который вы хотите изменить в Photoshop. Просто зайдите в меню «File» и нажмите «Сохранить для Web – устройств», выбрав подходящий размер для вашей страницы!

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

optimizaciya-izobrazheniya

 

Метод 2: Использование свободного программного обеспечения Gimp.

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

Вот как можно сделать маленькое изображение большего размера в Gimp без потери качества.

Чтобы открыть изображение, которое вы хотите изменить в Gimp, нужно  просто нажать «Файл – Открыть – Выбрать диск, на котором загружены изображения – Выбрать папку – И щелкнуть по изображению». После того, как программа загрузить изображение, щелкните в меню «Изображение – Размер изображения» и в открывшемся окне задайте необходимые размеры. В разделе: «Качество – Интерполяция», выберите Sinc (Lanczos3) в качестве метода интерполяции и нажмите на кнопку «Изменить».

 optimizaciya-izobrazheniya

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

Метод 3: Увеличить изображения, использовав Irfanview:

Irfanview это компактная программа для редактирования/конвертирования фотографий. Она доступна только для операционной системы Windows. Irfanview обеспечивает разумный способ изменения размера изображений,  делая их больше сохраняя отличное качество. Большинство web- мастеров, которые не имеют программу Photoshop, используют именно этот способ или же прибегают к сервисам для сжатия.

Просто откройте изображение в Irfanview и перейдите к «Image» «Изменить размер / Resample»

После этого появится всплывающее окно для редактирования изображения. Прежде всего, необходимо, ввести нужный размер изображения. После этого вам необходимо выбрать Resamaple (petter quality) use Filter, из фильтра выпадающего меню выберите Lanczos (dowest). И, установите флажок рядом с параметром «Apply Sharpen After Resample» .

optimizaciya-izobrazheniya

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

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

 

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

This blog is kept spam free by WP-SpamFree.