6 способов ускорить загрузку вашего сайта

Опубликовано: 2021-08-19

Ваш веб-сайт может быть самым красивым сайтом в мире, но он не принесет вам никакой пользы, если он будет загружаться бесконечно. Давайте посмотрим правде в глаза. Люди нетерпеливы, а медленный веб-сайт не позволяет потенциальным клиентам совершить покупку.

Когда я иду за покупками в интернет, я ожидаю, что страницы загрузятся в худшем случае в течение 5-10 секунд. Еще немного, и я начинаю нервничать или вообще ухожу из магазина.

Конечно, некоторые люди могут быть более терпеливыми, чем я, но зачем рисковать? Не рискуйте и сделайте свой бизнес-сайт максимально быстрым.

slow

Фото Meddygarnet

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

Например, 3 года назад, когда мы с женой впервые открыли наш интернет-магазин, более 35% наших клиентов использовали коммутируемое соединение. В результате нам пришлось резко сократить дизайн нашего веб-сайта, чтобы обеспечить быстрый шоппинг при скорости загрузки всего 56 КБ.

Сегодня только 2% наших клиентов используют коммутируемое соединение (слава богу!), Поэтому мы можем безопасно добавлять больше мультимедийного контента, не влияя на взаимодействие с пользователем.

Чтобы определить максимальный размер любой данной страницы, я обычно умножаю 5 секунд на средневзвешенную пропускную способность моих посетителей. Например, если большинство моих посетителей используют DSL, я могу предположить скорость загрузки 1 Мбит и решить, что 5 Мбит - это максимальный размер любой данной веб-страницы.

Это не точная наука. В конечном итоге вам нужно решить для себя, насколько быстрым должен быть ваш сайт.

Однако во всех случаях быстрее всегда лучше. Как я упоминал в своем последнем посте, скорость веб-сайта не всегда зависит от вашего веб-хостинга. Фактически, в большинстве случаев веб-мастер виноват в медлительности веб-сайта, а не в медленном сервере. В этой статье будут описаны несколько советов, как ускорить процесс.

Решите, что является наиболее важным, и измените порядок загрузки

Чтобы сделать ваш сайт быстрее, не всегда нужно вырезать изображения и контент. Иногда вам может нравиться ваш сайт именно таким, какой он есть, и вы действительно не хотите что-либо менять.

Если это так и ваш веб-сайт работает медленно, то часто вы можете просто расставить приоритеты для загрузки страницы.

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

Например, с MyWifeQuitHerJob.com я всегда убеждаюсь, что весь интересный контент появляется раньше, чем реклама. Таким образом, если реклама загружается немного медленно, она не затянет весь блог.

Веб-страницы всегда загружаются в последовательном порядке, поэтому вы всегда должны размещать материалы, которые вы хотите загрузить первыми, вверху страницы, а наименее важные - в конце вашего html-документа.

В случае элементов, которые должны отображаться в определенной позиции на странице, вы можете использовать javascript или css для управления порядком загрузки.

Например, хотя мое объявление полноразмерного баннера 728 × 90 отображается в самом верху моего MyWifeQuitHerJob.com, я проверяю, что оно загружается последним, выполнив следующие действия.

  • Я создаю пустой <div id = ”banner728 ″> там, где должно быть объявление, и устанавливаю его идентификатор на« banner728 ». Это фактически создает пустой заполнитель, который я позже могу загрузить с помощью javascript.
  • В самом конце страницы я включаю следующий фрагмент javascript
    <script type = ”text / javascript”>
    document.getElementById («banner728»). innerHTML = «код желаемого рекламного баннера»;
    </script>
    Этот код находит заполнитель «banner728», который я установил выше, и вставляет рекламный баннер в <div>. Поскольку этот сценарий находится в самом конце файла, он загружается последним после всего остального.

Не используйте изменение размера изображения HTML

Распространенная ошибка, которую делают многие новички, - это полагаться на html для сжатия и изменения размера изображений. Хотя этот метод работает и кажется безвредным, он полностью убьет производительность вашего сайта.

Причина в том, что все исходное изображение должно быть загружено перед отображением, даже если вы показываете только гораздо меньшее изображение.

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

Оптимизируйте свои изображения

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

Убедитесь, что вы максимально оптимизировали и сжали изображения, прежде чем отображать их на своей странице. Я часто выбираю качество JPEG 50 процентов или меньше, используя Photoshop с изображениями на моих сайтах.

Если вы используете GIFS, убедитесь, что вы не используете большую цветовую палитру, чем вам действительно нужно. Если вы можете обойтись только 16 цветами, выберите свой GIF только из 16 цветовой палитры.

Проанализируйте все свои гифки, чтобы убедиться, что ни одно из цветовых слотов не тратится на дубликаты.

Размещайте видео и большие изображения с помощью сторонних поставщиков

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

Например, вместо размещения видео на собственном сервере, почему бы не использовать YouTube или Vimeo? Если вы хотите владеть создаваемым вами контентом, вы также можете заплатить и использовать такую ​​услугу, как Amazon S3. Оставьте контент с высокой пропускной способностью для больших мальчиков.

Избегайте использования стороннего кода или изображений с горячими ссылками

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

Кроме того, каждый раз, когда ваш сайт обращается к стороннему серверу, необходимо выполнять поиск DNS, который может занять довольно много времени в зависимости от перегрузки сети.

Задержка в несколько сотен миллисекунд может показаться не такой уж большой, но если вы загружаете код с 10 разных серверов, эти поиски могут привести к задержке в несколько секунд.

Воспользуйтесь преимуществом кеширования и сжатия

Большая часть большинства веб-сайтов - это текст, и текст сжимается очень хорошо. Вот почему, если вы включите сжатие на своем сервере, вы можете сократить время загрузки до 75%.

К сожалению, не все общие веб-хосты имеют включенное сжатие на своих серверах. Если ваш веб-сайт находится на общем веб-хосте, обязательно спросите их, поддерживают ли их серверы mod_deflate или mod_gzip.

Если ваш сервер поддерживает сжатие, убедитесь, что вы включили его на своем веб-сайте, выполнив действия, описанные в этой статье. Если вы используете WordPress, плагин WP-SuperCache уже выполняет сжатие за вас.

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

Скорость имеет значение

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

Я был очень шокирован, увидев, что в нашем интернет-магазине все еще есть клиенты по коммутируемому соединению! Если они у меня все еще есть, то могут и вы.