Я мясоед, но если вы не едите мясо, то придумайте своё сравнение.
9. ОПРЕДЕЛИТЕ СВОИ РАЗМЕРЫ
Если вы используете AMP или PWA, вам необходимо указать размеры изображения в исходном коде.
Однако, если вы их не используете, лучше всего определить ширину и высоту. Это обеспечивает качественное отображение изображения.
Кроме того, это позволяет браузерам изменять размер изображения до загрузки CSS.
Атрибуты размеров изображения также важны для предотвращения проблем с кумулятивным сдвигом макета (CLS), которые могут помешать вашей оптимизации Core Web Vitals.
Ключевым моментом является включение атрибутов ширины и высоты для каждого элемента изображения и видео.
Это сообщает браузеру, сколько места следует выделить для ресурса, и предотвращает раздражающее смещение содержимого, которое снижает вашу оценку CLS. Узнайте больше можете в руководстве «Оптимизация совокупного сдвига макета».
10. СТРУКТУРИРОВАННЫЕ ДАННЫЕ ИЗОБРАЖЕНИЯ
Добавление структурированных данных на ваши страницы помогает поисковым системам отображать ваши изображения в качестве расширенных результатов. Google Images поддерживает структурированные данные для изображений продуктов, видео и рецептов.
Например, если у вас есть рецепты на сайте, и вы добавляете структурированные данные к своим изображениям, Google может добавить к вашему изображению значок, показывающий, что оно принадлежит рецепту.
Добавление структурированных данных на ваши страницы помогает поисковым системам отображать ваши изображения в качестве расширенных результатов.
Воспользуйтесь Общими рекомендациями Google по структурированным данным, чтобы узнать, как добавлять структурированные данные на свои страницы в рамках параметров поисковой системы.
11. СДЕЛАЙТЕ ИЗОБРАЖЕНИЯ УДОБНЫМИ ДЛЯ МОБИЛЬНЫХ ГАДЖЕТОВ
Если не сделать изображения удобными для мобильных устройств, то худшем случае это может дать вам высокий показатель отказов и низкую конверсию. Но, если всё сделать в соответствии с указаниями, изложенными ниже, то это может дать больше возможностей для ранжирования и улучшить взаимодействие с пользователем.
Проблема в том, как оптимизировать изображения для индекса, ориентированного на мобильные устройства?
Вы создаете адаптивные изображения. Это означает, что изображение будет масштабироваться в зависимости от размера сайта, независимо от того, использует ли пользователь настольный компьютер или мобильное устройство. Изображение подстраивается под размер устройства.
Mozilla предлагает всеобъемлющую на использование srcset и sizes атрибуты для обеспечения браузер дополнительных исходных изображений, позволяя отображать идентичное содержание изображения с измененным размером для данного устройства.
Важно отформатировать это с другой частью