Оптимизация

7 новых способов ускорить загрузку страницы

5_via_9

Сегодня мы продолжим разговор об оптимизации скорости загрузки страницы. Если после нашей предыдущей статьи Вы все еще не уверены, стоит ли тратить на это время и деньги, напомним, что от того, насколько быстро грузится Ваш сайт зависит не только то, останется ли пользователь или уйдет, не дождавшись, но и Ваша позиция в поисковиках. Гугл и Яндекс учитывают этот фактор при ранжировании – а значит, медлительность (вкупе с увеличением количества «отказов») приведет Вас прямиком куда-нибудь на двадцатую страницу выдачи, где Вас ни один потенциальный клиент никогда не найдет. Как избежать этой скорбной участи? Мы собрали для Вас 7 лучших способов.

Уменьшаем общий вес веб-страницы

Это первое условие для того, чтобы уложиться в идеальные загрузочные 3 секунды. Напомним, что на длительность прогрузки веб-сайта влияет в первую очередь его общий объем, который, чтобы не было задержек, не должен превышать 3-4 мегабайт. Уменьшение его возможно с помощью нескольких методов:

  • Оптимизационная обработка изображений, доступная для наиболее распространенных форматов (jpeg, gif, png). О том, как ее производить, мы уже рассказывали.
  • Чистка css- и javascript-кода. Она позволяет существенно сжать файлы: как следствие, все будет загружаться скорее. Как чистить? Удаляем все закомментированные строки, незначимые пробелы, символы табуляции, абзацы. Чем меньше знаков останется – тем лучше. Совершенно не обязательно делать это вручную, существует множество онлайн-сервисов для автоматизированной минимизации кода, такие как Cssdrive или AskApache (последний еще и валидацию умеет производить).

Грузим JavaScript-библиотеки через CDN

Content Delivery Network – это особый инструмент, который соединяет множество веб-серверов по всему миру. За счет их географической близости к пользователю растет скорость отдачи контента. К тому же, все современные обозреватели кэшируют js-файлы, полученные из этой сети. Это означает, что, если Вы уже посетили какой-нибудь web-сайт, где был такой файл, то он сохранился на Вашем ПК в кэше, и нет нужды грузить его повторно. Выбор CDN довольно велик, но VIA рекомендует обратить внимание на Google Libraries – огромную библиотеку open-source javascript-фреймворков. Ее интерфейс выглядит так:

google-libraries

Включаем параллельное скачивание

HTTP/1.1 имеет кое-какие неприятные технологические ограничения. В частности, не дает браузерам одновременно скачивать более двух компонентов лендинга с одного хоста. Так что, если на Вашем много картинок или видео, имеет смысл вынести их на разные поддомены. Вам все равно, а веб-браузер будет думать, что это отдельные серверы, и сможет качать с них параллельно.

Минимизируем число запросов

Этот пункт логически вытекает из предыдущего – ведь компонентное наполнение веб-сайта не ограничивается одними фотографиями и видеороликами. Оно включает и flash, и ява-скрипты. Сократив их количество, можно выиграть полсекунды, а то и больше. Однако подходить к этой задаче следует с умом, чтобы не затронуть внешний вид. Проще всего – объединить много коротеньких подключаемых скриптов в один длинный. Еще вариант – встроить в таблицы стилей inline-картинки (это также уберет пару-тройку лишних http-запросов без утяжеления html-документа) или применить css-спрайты.

Сжимаем тексты «на лету»

Если передавать посетителю не исходную версию текстового документа, а заархивированную – соединение освобождается в 3-4 раза быстрее. И это верно почти для 100% случаев. Архив с данными весит всего 20% от начального их объема. Однако не всякое архивирование подойдет. Узнать, какое поддерживают те веб-клиенты, с которыми Вы работаете, можно в графе Accept-Encoding его запроса Вашему веб-серверу: в ней перечислены все поддерживаемые им форматы. Самый популярный – gzip.

gzip_on

Ставим CSS в начало…

Это сделает рендеринг Вашей landing page постепенным – она будет прогружаться сверху вниз, и прогресс будет заметен даже при подключении через неторопливый мобильный интернет. Это такой сигнал «мы не зависли, мы в процессе». Не так актуально для столиц, а вот для регионов, где скорости, увы, по-прежнему не космические, пригодится.

…а JavaScript – в конец

Запомните, если у Вас вначале грузится Java – со стороны это выглядит так, как будто ничего не происходит. Так что сначала – контент, а потом уже все «примочки». Заметим также, что их совокупный вес может достигать нескольких сотен килобайт, что при плохом коннекте потребует не одно мгновение для того, чтобы загрузиться.

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

comments powered by HyperComments
Похожие записи
5_via_6
Как обеспечить стабильную работу лендинга в любом браузере?
5_via_8
Быстрее, еще быстрее: сокращаем скорость загрузки сайта до трех секунд