Setka Editor и WordPress Атрибут srcset для оптимизации размера изображений на странице просмотра поста

Атрибут srcset для оптимизации размера изображений на странице просмотра поста

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

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

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

В настройках плагина Setka Editor вы можете выбрать размеры, доступные на странице просмотра поста. Мы выводим в доступный список только размеры с установленной настройкой crop=false, чтобы не менять пропорции изображения. Оригинал изображения включен в настройках по умолчанию.

Screen_Shot_2019-07-05_at_18.03.40.png

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