Воскресенье, 21 Июнь 2015

Передача PaPaYa №39

Новости

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

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

Витамины в спортивном питании
20 июня 2018 г. Что такое витамины ? Витамины – это вещества, которые производятся из витаминсодержащего сырья (как растительного, так и животного происхождения), а также вещества, созданные искусственно

Симптомы авитаминоза, причины и лечение


Витамины для стройности


Как сберечь витамины в ягодах?
Каждый знает, что ягоды являются природным источником витаминов – дары природы содержат богатую гамму полезных элементов. Как сберечь витамины в ягодах? Сайт mir-yagod.ru даст ряд ценных рекомендаций.

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

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

Витамины для роста детям
Еще нужно учитывать и такой момент: если родители имеют средние показатели роста (160 – 175 см), то ожидать в семье будущего баскетболиста вряд ли разумно. Показатель роста ребенка заложен генетически

Какие витамины жизненно необходимы - Центр Космоэнергетики и Рэйки ИСИДА
Давно известно, что без витаминов нормальная жизнедеятельность человеческого организма невозможна. Какие же витамины и в каких количествах человеку необходимо получать ежедневно? Витамин А (аксерофтол,

Новости партнеров

Кризис трехлетнего возраста: бороться или мириться...

Ваш малыш, еще вчера такой послушный и покладистый, вдруг начинает вести себя необычно.Подробнее (http://www.prostobaby.com.ua/zdorove/psihologiya/stati/krizis_trehletnego_vozrasta_borotsya_ili_miritsya)

Боремся с лактостазом: памятка кормящей маме...

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

Дородовое воспитание: ждем и обучаем

Дородовое воспитание: ждем и обучаем...

Во время беременности будущего малыша можно не только любить, ждать, общаться с ним и всячески оберегать – его, как бы...

Создавайте оптимизированные для SEO изображения для WordPress: оптимизируйте изображения для Интернета

  1. Веб-страницы и изображения
  2. Как оптимизировать изображения сайтов для поисковых систем
  3. Типы изображений и форматы
  4. Что такое оптимизация изображения?
  5. Почему требуется оптимизация изображения?
  6. Как измерить время загрузки страницы?
  7. Оптимизировать изображения для SEO
  8. SEO дружественные изображения
  9. Методы оптимизации изображения
  10. Ручные методы
  11. Автоматизированная крупномасштабная оптимизация
  12. Как оптимизировать изображения в WordPress
  13. Общие методы оптимизации
  14. Как оптимизировать изображения для SEO
  15. Как добавить Alt теги / текст к изображениям в WordPress
  16. Добавление тэгов Alt для существующих изображений в WordPres
  17. Добавление тэгов Alt для новых изображений в WordPress
  18. SEO оптимизированные изображения: использование плагинов WordPress
  19. Плагины оптимизатора изображений для SEO: Сравнительная таблица
  20. SEO оптимизированные изображения
  21. SEO Image Optimizer
  22. SEO дружественные изображения
  23. PB SEO Friendly Изображения
  24. Другие инструменты для оптимизации изображений в WordPress
  25. Заключение

Знаете ли вы, что оптимизация изображений повысит SEO-рейтинг вашего сайта? Понимание оптимизации изображений для Интернета и методов создания SEO-дружественных изображений.

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

Веб-страницы и изображения

Содержание и размер страницы является одним из основных факторов, способствующих снижению скорости веб-страницы. Размеры веб-страниц растут с поразительной скоростью с увеличением охвата Интернетом. Согласно последним данным, размер веб-страницы увеличился примерно на 243% с 2010 по 2016 год.

Визуально привлекательные сайты содержат в основном изображения. Большинство изображений имеют очень большой размер. На них приходится большая часть общего размера страницы или «веса страницы. Согласно статистике за 2016 год, около 64,3% контента веб-страницы состоит из изображений.

Среднее число байт на страницу по типу контента за июль 2016 года с httparchive.org

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

Большая часть контента сайта состоит из изображений, и большинство из них не оптимизированы для Интернета. Поисковые системы на основе изображений могут генерировать дополнительный трафик для вашего сайта, если изображения оптимизированы. Согласно последним данным, 39% людей покидают сайт с медленной загрузкой изображений (Источник: саман ). Поэтому создание веб-оптимизированных изображений необходимо для меньшее время загрузки страницы ,

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

Результаты последних тематических исследований также подтверждают важность оптимизированных веб-страниц:

  • Ancestory.com вырос на 7% в конверсиях. Это было связано с сокращением времени рендеринга веб-страниц на 68%, раздувания страниц на 46% и времени загрузки на 64%.
  • AliExpress уменьшается время загрузки их страниц на 36%. Их заказы увеличились на 10,5%, а показатели конверсии на 27%.

Типы изображений и форматы

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

Существует несколько форматов файлов изображений для конкретных потребностей обработки изображений:

  • .jpg - лучший тип файлов для фотографий, он хорошо масштабируется, но не наоборот. Качество изображения хорошо сохраняется после сжатия.
  • .png - формат полезен для изображений большого размера с меньшим количеством цветов. PNG хорошо масштабируются и используются для диаграмм, диаграмм и т. Д.
  • .gif - Формат GIF плохо масштабируется. Он используется для небольших изображений, таких как значки, кнопки и т. Д.
  • .svg - это векторный формат файла, файлы SVG имеют очень маленький размер изображения и очень хорошо масштабируются.
  • .bmp - BMP огромны по размеру и обычно имеют пикселизацию.

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

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

Почему требуется оптимизация изображения?

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

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

Как измерить время загрузки страницы?

Более быстрая загрузка веб-сайта обеспечивает положительный пользовательский опыт. Несколько инструментов доступны для измерения и анализа Время загрузки страницы , Инструменты как PageSpeed ​​Insights , Тест скорости сайта Pingdom а также YSlow измерить производительность страницы. Они измеряют время загрузки страницы для веб-сайта и предоставляют предложения по улучшению.

Оптимизировать изображения для SEO

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

SEO дружественные изображения

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

Методы оптимизации изображения

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

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

Ручные методы

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

  • Photoshop предлагает несколько вариантов сжатия размера изображения при сохранении качества. Диалоговое окно «Сохранить для Web и устройств» позволяет сравнить исходное изображение с другими вариантами сжатия.

Диалоговое окно «Сохранить для Web и устройств» позволяет сравнить исходное изображение с другими вариантами сжатия

Есть также плагины, такие как «JPEG XR», «NVIDIA Texture Tools» и «PNG Exported», которые расширяют возможности Photoshop. Опытные пользователи могут попробовать их для преодоления ограничений Photoshop.

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

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

Плагин GIMP «Сохранить для Интернета» предоставляет дополнительные параметры для оптимизации изображений JPEG, GIF и PNG.

Автоматизированная крупномасштабная оптимизация

PHP предоставляет встроенные пакеты GD а также GD2 для автоматической оптимизации изображения. Это позволяет изменять размер изображения на стороне сервера и манипулировать им.

Как оптимизировать изображения в WordPress

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

Общие методы оптимизации

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

  • Выберите правильный формат файла. Неправильное использование большого формата изображения может привести к увеличению размера.
  • Изменение размера изображения в соответствии с требованиями к отображению. Встроенный редактор изображений WordPress предоставляет опции для изменения размеров изображения.
  • Используйте обрезку, чтобы сохранить видные области, а также сохранить четкость изображения.
  • Понизьте качество изображения, сжав изображение.
  • использование Ленивая Загрузка изображений с установкой приоритета для изображений. Изображения в верхней части страницы имеют более высокий приоритет. Нижние изображения загружаются только при прокрутке страницы.
  • Используйте отзывчивые изображения, созданные с размером WordPress: «Миниатюра», «Средний», «Полный размер» и т. Д. Можно изменить тему, чтобы использовать альтернативную версию изображения для размера экрана устройства.
  • Предоставлять изображения в сетях распространения контента (CDN), которые хранят веб-сайт на нескольких серверах. Плагины WordPress, такие как JetPack а также Плагин W3 Total Cache обеспечить прямую интеграцию сайта с CDN.

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

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

  • Название изображения отображается, когда читатель прокручивает изображение. Заголовок должен быть отформатирован в регистре заглавия и не должен содержать дефисы.
  • Подпись отображается прямо под изображением. Это необязательное поле.
  • Описание уточняет название и предоставляет более подробную информацию.
  • Имя файла должно включать короткие ключевые слова и дефисы для лучшей оптимизации.
  • Alt-Text является наиболее важным полем для описания изображения. Он используется поисковыми системами, программами чтения с экрана и заполнителем, когда изображение не загружается.

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

Поле Alt-Text имеет многократное использование и является наиболее важным полем. Для отдельных изображений используйте основное ключевое слово в атрибуте поля Alt-Text. Для более чем одного изображения рассмотрите возможность использования Латентная семантическая индексация (LSI) ключевые слова в теге ALT.

Добавление тэгов Alt для существующих изображений в WordPres

Шаг 1: Выберите страницу для редактирования и опцию «Редактировать страницу».

Шаг 2: Выберите изображение, для которого необходимо добавить Alt-Text.

Шаг 3: Нажмите «Изменить» для изображения.

Шаг 4: Откроется панель «Детали изображения».

Шаг 4: Откроется панель «Детали изображения»

Шаг 5: Отредактируйте поле «Alt Text», чтобы добавить альтернативные текстовые ключевые слова.

Шаг 6: Нажмите «Обновить».

Добавление тэгов Alt для новых изображений в WordPress

Шаг 1: Выберите опцию «Добавить мультимедиа» на вкладке «Добавить новую страницу» или «Редактировать страницу».

Шаг 2: Выберите изображение для добавления на страницу.

Шаг 3: Панель «Детали вложения» открывается справа.

Шаг 4: Отредактируйте поле «Alt Text», чтобы добавить альтернативные текстовые ключевые слова.

Шаг 5: Нажмите «Вставить на страницу».

SEO оптимизированные изображения: использование плагинов WordPress

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

Плагины оптимизатора изображений для SEO: Сравнительная таблица

Имя

подключаемого модуля Рейтинг активных установок Совместимость WordPress Параметр Alt-text Параметр изменения размера Параметр сжатия изображения Параметр « Ленивая загрузка» Оптимизированные изображения SEO 10000+ 4.2 4.7.2 Да Нет Нет Нет SEO Image Optimizer 3000+ 5 4.7.2 Да Да Да Нет SEO Friendly Images 1000 + 4 4.4.7 Да Нет Нет Нет PB SEO Friendly Images 300+ 5 4.7.3 Да Да Да Да

SEO оптимизированные изображения

SEO оптимизированные изображения

Плагин SEO Optimized Images обеспечивает динамическое добавление SEO-дружественного Alt-текста и заголовка к изображениям. Плагин не изменяет базу данных и может быть безопасно отключен, если не требуется.

Особенности премиум-версии:

  • Поддержка избранных изображений.
  • Поддержка образов продуктов Woocommerce.
  • Поддержка пользовательских изображений типа пост.
  • Пользовательские правила выборочно добавляют тэги Alt и Title к изображениям.

SEO Image Optimizer

SEO Image Optimizer

Плагин SEO Image Optimizer динамически заменяет заголовок и тэг Alt изображений. Все изменения выполняются без изменения базы данных. Плагин также предоставляет настройки изменения размера и сжатия изображения.

Некоторые перечисленные функции плагина:

  • Оптимизация изображений для SEO.
  • Вставьте динамически заголовок и тэг alt для SEO дружественного изображения
  • Сожмите размер изображения, чтобы увеличить скорость загрузки сайта.
  • Загруженные изображения для сообщения.

SEO дружественные изображения

SEO дружественные изображения

Плагин SEO Friendly Images позволяет автоматически вставлять или заменять текст и заголовок ALT. Функции плагина могут быть использованы для увеличения рейтинга в поисковых системах для всех изображений.

PB SEO Friendly Изображения

PB SEO Friendly Изображения

PB SEO Friendly Images используется для автоматической оптимизации всех атрибутов изображений Alt-Text и Title. Плагин предоставляет опции для:

  • Синхронизация
  • Override
  • Схема
  • Для всех изображений
  • SEO доказано

Другие инструменты для оптимизации изображений в WordPress

Плагин сжатия и оптимизации Smush Image Для WordPress разрешено автоматическое изменение размера, оптимизация и сжатие всех изображений. Вы можете вырезать метаданные из JPEG и оптимизировать сжатие. Вы можете конвертировать изображения GIF в изображения PNG, а также удалять неиспользуемые изображения. В противном случае вы можете просто использовать онлайн компрессор изображения для радикального уменьшения размера ваших изображений JPG и PNG.

TemplateToaster это комплексный инструмент для WordPress, который поддерживает все плагины. Инструмент предоставляет «Опции темы» для использования тем, разработанных с помощью инструмента. Эти темы включают вкладку «SEO» по умолчанию. На вкладке представлены дополнительные параметры, позволяющие оптимизировать SEO для темы. TemplateToaster программное обеспечение для веб-дизайна также выводит веб-оптимизированные изображения.

Заключение

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