Половина проблем со скоростью загрузки сайта связаны с плохой подготовкой изображений для веба. Несколько советов, которые помогут сделать ваши сайты быстрее:
1. Для иконок и иллюстраций используйте векторный формат SVG. Он в десятки раз меньше png или jpg и не теряет в качестве при масштабировании.
2. Не делайте размер изображений «с запасом». Для полноэкранных обложек загружайте изображения шириной 1680px. Для картинок внутри контента рассчитайте ширину по формуле: {количество колонок}*100 – 40px
3. Сжимайте картинки, но не увлекайтесь. Визульно изображение должно оставаться качественным. Используйте TinyPNG и Squoosh. Старайтесь добиться размера до 300 кб, идеально — до 100 кб.
4. Дайте изображениям нормальные названия файлов на латинице. Не оставляйте DC14353.jpg, а назовите файл my-company-office.jpg — Яндекс и Google учитывают то, как называется файл картинки. Это добавит баллов для SEO.
5. Задайте альтернативный текст изображениям (alt атрибут). Поисковики поймут, что вы структурируете контент для поисковых роботов и добавят баллов всей странице. А еще ваши изображения будут участвовать в поиске по картинкам и смогут принести дополнительные переходы.
Подробнее про Alt атрибуты
— Добавляйте alt-атрибуты к уникальным изображениям. Alt не нужно ставить на иконки, фоновые изображения, фотографии с фотостоков.
— Делайте alt длинной 70-250 символов. Без переизбытка ключевых слов.
— Для разных видов одного товара интернет-магазина можно использовать одинаковые alt, но добавьте в конце Вид1, Вид2 и т.п.
В Тильде вы можете задать alt-атрибуты почти в каждом блоке, где картинка не используется в качестве фона: http://help-ru.tilda.ws/search-engine#alt
В Zero Block можно задать alt в настройках элемента «Изображение». Если вы используйте элемент «shape» с картинкой на фоне, alt-атрибут задать не получится. Это элемент другого типа в HTML — к нему alt не применим.
