Почему скорость загрузки важнее эффектной анимации для вашего сайта
В процессе переговоров с клиентом обсуждаем дизайн будущего веб-сайта. Клиент выразил пожелание: «Хочу, чтобы, когда открываешь сайт, элементы всплывали, выезжали, вращались, а важная информация была представлена бегущей строкой. Это возможно?» - «Да, современные технологии позволяют достичь впечатляющих эффектов, но...». Мы уточнили: «Что для вас важнее – динамичные элементы на сайте или быстрая загрузка контента, важного для вашей аудитории? Ведь сайт создается для вашей целевой аудитории, а не для вас лично».
Замечая недопонимание клиентов в таких ситуациях, мы решили рассказать подробнее с деталями и примерами. Начнем с самого начала.
Ваш сайт – это инструмент продаж. На желание клиента остаться на сайте и ознакомиться с контентом и услугами влияет множество факторов, но скорость загрузки – ключевой.
Представьте, у вас экстренная ситуация, и вам срочно нужна медицинская услуга, открываете сайт, а он загружается несколько десятков секунд. Скорее всего, вы уйдете, не дождавшись загрузки, и найдете более быстрый ресурс. Не самая приятная ситуация, верно?
На скорость загрузки значительно влияют 2 фактора, которые часто упускаются начинающими разработчиками на любых платформах, включая Tilda:
1. Анимация элементов должна быть уместной. Это один из главных факторов, имеющих влияние на скорость загрузки сайта, его трафик и конверсию. Рекомендуется ограничивать их количество до 3-5 для лендинга и 5-10 для многостраничного сайта. Например, целесообразно применить анимацию на главной странице на первом экране, где расположено основное предложение, заголовки блоков или логотип компании.
2.Фотографии и изображения должны быть оптимизированы без потери качества.
Формат SVG идеально подходит, а также рекомендуется использовать PNG, оптимизированный для веба.
Замечая недопонимание клиентов в таких ситуациях, мы решили рассказать подробнее с деталями и примерами. Начнем с самого начала.
Ваш сайт – это инструмент продаж. На желание клиента остаться на сайте и ознакомиться с контентом и услугами влияет множество факторов, но скорость загрузки – ключевой.
Представьте, у вас экстренная ситуация, и вам срочно нужна медицинская услуга, открываете сайт, а он загружается несколько десятков секунд. Скорее всего, вы уйдете, не дождавшись загрузки, и найдете более быстрый ресурс. Не самая приятная ситуация, верно?
На скорость загрузки значительно влияют 2 фактора, которые часто упускаются начинающими разработчиками на любых платформах, включая Tilda:
1. Анимация элементов должна быть уместной. Это один из главных факторов, имеющих влияние на скорость загрузки сайта, его трафик и конверсию. Рекомендуется ограничивать их количество до 3-5 для лендинга и 5-10 для многостраничного сайта. Например, целесообразно применить анимацию на главной странице на первом экране, где расположено основное предложение, заголовки блоков или логотип компании.
2.Фотографии и изображения должны быть оптимизированы без потери качества.
Формат SVG идеально подходит, а также рекомендуется использовать PNG, оптимизированный для веба.
Почему важна скорость загрузки сайта
Проблема в том, что запас внимания пользователя на изучение каждого сайта ограничен. Сейчас наука имеет несколько теорий и исследований по вопросу, сколько конкретно секунд человек готов потратить, например, на интернет-страницу, чтобы найти на ней нужную информацию. Клиповое мышление и обилие информации вокруг привело к тому, что эта цифра сокращается каждые 5 лет и даже по самым оптимистичным данным составляет 8 секунд.
Всего 8 секунд от клика на ваш сайт до решения - уйти или остаться и перейти на следующий этап цикла продаж (более подробное изучение, консультация, оставление заявки или сразу покупка). А теперь представьте, что из этих 8 секунд 5 ушли на загрузку сайта. Успеет потенциальный клиент за 3 секунды оценить ваше предложение? Скорее всего, он закроет страницу, так ничего о вас и не узнав.
Компания Google изучила, как время загрузки страницы влияет на показатель отказов. Оказалось, что больше половины пользователей не готовы ждать дольше 3 секунд.
Всего 8 секунд от клика на ваш сайт до решения - уйти или остаться и перейти на следующий этап цикла продаж (более подробное изучение, консультация, оставление заявки или сразу покупка). А теперь представьте, что из этих 8 секунд 5 ушли на загрузку сайта. Успеет потенциальный клиент за 3 секунды оценить ваше предложение? Скорее всего, он закроет страницу, так ничего о вас и не узнав.
Компания Google изучила, как время загрузки страницы влияет на показатель отказов. Оказалось, что больше половины пользователей не готовы ждать дольше 3 секунд.
Согласно опросам Google, медленная загрузка сайта раздражает пользователей больше всего. Исследования показывают, что 52% пользователей предпочитают отсутствие анимации в пользу скорости загрузки и работы ресурса, 79% не возвращаются на медленные сайты, а 66% считают скорость загрузки важной частью имиджа компании. Мы согласны, ведь это проявление заботы о клиенте.
По этим причинам мы рекомендуем веб-разработчикам и заказчикам избегать излишней анимации на сайте. Мы не против анимации в целом, мы за ее осознанное применение. Когда анимация полезна, помогает быстро передать смысл и подчеркнуть важную информацию - мы ее делаем. И, сделав один анимированный элемент в блоке странице, мы не будем использовать больше ничего, активно привлекающего внимание в том же блоке, чтобы элементы не конкурировали между собой.
Там, где возможно, мы заменяем анимацию другими средствами привлечения внимания пользователей. Например, верстка и типографика могут эффективно управлять вниманием через логичное расположение текстовых элементов, их цвет, размер и форму, что мотивирует пользователей к целевым действиям.
Текст должен быть ясным, лаконичным и содержать конкретные предложения с указанием преимуществ и стоимости. Это позволит пользователям быстро находить нужную информацию и совершать покупки без лишних затруднений.
Проверить скорость загрузки можно на https://pagespeed.web.dev/ . Просто вводите адрес сайта и получаете много важной и полезной информации о своем сайте.
По этим причинам мы рекомендуем веб-разработчикам и заказчикам избегать излишней анимации на сайте. Мы не против анимации в целом, мы за ее осознанное применение. Когда анимация полезна, помогает быстро передать смысл и подчеркнуть важную информацию - мы ее делаем. И, сделав один анимированный элемент в блоке странице, мы не будем использовать больше ничего, активно привлекающего внимание в том же блоке, чтобы элементы не конкурировали между собой.
Там, где возможно, мы заменяем анимацию другими средствами привлечения внимания пользователей. Например, верстка и типографика могут эффективно управлять вниманием через логичное расположение текстовых элементов, их цвет, размер и форму, что мотивирует пользователей к целевым действиям.
Текст должен быть ясным, лаконичным и содержать конкретные предложения с указанием преимуществ и стоимости. Это позволит пользователям быстро находить нужную информацию и совершать покупки без лишних затруднений.
Проверить скорость загрузки можно на https://pagespeed.web.dev/ . Просто вводите адрес сайта и получаете много важной и полезной информации о своем сайте.