Изображения - важная часть вашей маркетинговой стратегии. Я уверен, что вы слышали это много раз раньше: «картинка стоит тысячи слов». Ну, согласно NewsCred:
- Статьи, содержащие изображения, получают94% больше просмотров, чем статьи без изображений.
- 40% людей лучше отреагируют на визуальную информацию, чем на простой текст.
- 93% людей говорят, что визуальные образы являются фактором №1, влияющим на решение о покупке.
С учетом вышесказанного, после того, как вы потратили часы на создание идеального поста или страницы в блоге, не экономьте на визуальных эффектах! Дополните свое сообщение диаграммой, графикой, видео или даже gif, но независимо от того, какой носитель вы выберете, не забудьте убедиться, что файл полностью оптимизирован.
Как бы ни были важны визуальные эффекты, они могут значительно замедлить время загрузки вашего сайта. Имея это в виду, вот шесть распространенных ошибок, которые вы допускаете при добавлении изображений на свой сайт, и способы их избежать.
Ошибка №1: вы загрузили огромные изображения
Имейте это в виду: большинство посетителей ждут около трех секунд загрузки веб-сайта на настольном компьютере или ноутбуке и около пяти секунд на своем мобильном устройстве. Если загрузка вашего изображения занимает больше времени, вы можете помахать посетителю на прощание, потому что у него нет терпения ждать.
Решение: Уменьшите размер изображений на своем веб-сайте, используя Photoshop «Сохранить для Интернета и устройств» или для тех, у кого нет Photoshop, Compressor.io. Старайтесь, чтобы размер файла не превышал 700 КБ.
Ошибка №2: Вы не переименовали файлы
Это действительно легко не заметить.
Многие люди просто сохраняют имя файла по умолчанию, будь то соглашение об именовании с их камеры или со стокового сайта с фотографиями, но когда дело доходит до SEO, важно включить ключевые слова, которые помогут вашей странице повысить рейтинг их.
Создание описательного имени файла, насыщенного ключевыми словами, абсолютно необходимо для оптимизации изображений.
Поисковые системы сканируют не только текст на вашем сайте, но и ключевые слова в именах файлов изображений.
Решение:Потратьте несколько дополнительных минут и переименуйте свое изображение, но помнитеНЕ ВБЕДИТЕ КЛЮЧЕВЫЕ СЛОВА.
Ошибка №3: Вы не добавили описание (ALT-тег)
Как и в случае с переименованием изображения, многие люди склонны игнорировать добавление тега ALT.
ALT-теги представляют собой текстовую альтернативу изображению, когда браузер не может правильно их отобразить, а также помогают слабовидящим понять, какое изображение вы отобразили на странице.
Как и имя файла, тег ALT также повышает ценность SEO. Соответствующие теги к изображению могут помочь вашему веб-сайту повысить рейтинг, когда роботы сканируют вашу страницу.
Решение: Точно так же, как вы потратите несколько минут на переименование изображения, потратьте еще несколько минут на добавление к нему тега ALT. Простые правила, которым следует следовать, когда дело касается тегов ALT:
- Опишите свое изображение на английском языке, как и имена файлов
- НЕ ВБИРАЙТЕ КЛЮЧЕВЫЕ СЛОВА
Ошибка №4: вы использовали неправильное расширение файла
Многие спросят, есть ли какая-нибудь разница в разных типах файлов? Короткий ответ: да. Не все форматы файлов одинаковы, каждый из них имеет свое особое применение и имеет свои плюсы и минусы. Вот разбивка наиболее распространенных:
- JPG (или JPEG) стало стандартным изображением в Интернете. Изображения JPG идеально подходят для фотографий с насыщенными цветами и градиентных изображений. Файлы JPG также «слабые», что означает, что они сохраняют всю информацию о цвете, но сжимают размер файла, что может привести к потере качества.
- GIF - это изображения более низкого качества, чем JPG, и они отлично подходят для тех, у кого есть простые иллюстрации и цветные блоки (не лучший вариант для фотографий). GIF-файлы также широко используются в анимации, поскольку это единственный тип файлов, обеспечивающий прозрачность и чересстрочную развертку.
- PNG становятся все более популярными. PNG поддерживают гораздо больше цветов, чем GIF, и они не ухудшаются со временем при повторном сохранении, как JPG. Этот тип файла подходит для логотипов, диаграмм и т. д.
- SVG - это векторный формат, который останется четким и четким независимо от того, на каком устройстве вы его просматриваете.
Решение: Узнайте разницу между различными типами файлов и убедитесь, что вы используете лучший вариант для имеющегося изображения. Это поможет обеспечить максимально возможный эффект от вашего изображения без ущерба для технических характеристик.
Ошибка №5: Ваше изображение выглядит неправильно (искажение)
Искажение изображения часто происходит тогда, когда вы меньше всего этого ожидаете. Самая распространенная версия - ваше изображение растянуто до непропорций.
Искаженное изображение
Правильно масштабированное изображение
Решение:Пропорционально масштабируйте изображение, и если это не то, что вы можете контролировать, поговорите со своим разработчиком и попросите его взглянуть. Например, в HubSpot захватите угол изображения. Если вы захватите любую другую часть изображения, ваше изображение не будет масштабироваться должным образом.
Другое распространенное искажение возникает, когда изображение было сохранено в низком качестве.
Решение: Возьмите исходное изображение и заново сохраните его. Если вы используете Photoshop, вы можете просмотреть и сравнить несколько версий вашего изображения и узнать примерное время загрузки.
Что касается размеров изображений, мы обычно предпочитаем, чтобы наши изображения были не шире 1200 пикселей и меньше 600 КБ, но если он немного больше, это не конец света. Мы знаем, насколько сложно сохранить качество этих детальных изображений.
Если у вас нет Photoshop, попробуйте другие инструменты редактирования изображений: PicMonkey, Pixlr, FotoFlexer и GIMP, которые помогут вам эффективно изменять размер изображений.
Ошибка №6: вы купили стандартную стоковую фотографию
Да, стоковые фотографии могут быть удобным вариантом, когда у вас нет времени на собственную фотосессию, но иногда это не лучший вариант. Существует множество часто используемых стоковых фотографий, и если вы используете ту, которую, как вы знаете, видели раньше, скорее всего, ваша аудитория тоже.
Решение: Если вы не можете найти время, чтобы провести собственную фотосессию или создать собственную графику, найдите время и найдите подходящую стоковую фотографию. Посмотрите дальше первой страницы результатов поиска. Найдите изображение, которое отличается от других и которое действительно хорошо сочетается с вашим брендом. Даже ищите те, которые вы можете отредактировать или настроить в соответствии со своими потребностями.
Взгляните на этот список из 10 бесплатных стоковых фото-сайтов, которые не отстой, которые мы собрали. Тогда, если вы все еще застряли, вот несколько советов, которые помогут вам выбрать идеальную стоковую фотографию.