Увеличение скорости загрузки сайта

123 просмотра

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

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

Оптимизация картинок

Именно от размера (веса) и количества картинок, прежде всего, зависит скорость загрузки сайта. Чем крупнее и четче изображение, тем дольше оно будет открываться. Но тут желательно найти «золотую середину» и не ухудшить качество графики настолько, что подаваемый контент потеряет свою привлекательность. Если, даже используя Фотошоп либо иную графическую программу, вы не сможете самостоятельно провести нормальную их оптимизацию, сохраните все в начальном варианте либо попробуйте воспользоваться сервисом, предоставляемым Yahoo. Он максимально уменьшит их вес, но сохранит качество с существующим расширением.

Когда возникают вопросы с форматом, выбирайте jpg или png: первый больше других сожмет выбранное изображение, а второй отличается поддержкой высокого качества прозрачного фона.

Функция кэширования

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

Активировать функцию, способную ускорить сайт, можно, прописав в файле .htaccess следующий алгоритм:

<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType application/javascript «access plus 30 days»
ExpiresByType text/javascript «access plus 30 days»
ExpiresByType text/css «access plus 30 days»
ExpiresByType image/gif «access plus 30 days»
ExpiresByType image/jpeg «access plus 30 days»
ExpiresByType image/png «access plus 30 days»
</IfModule>

Тут указан месячный срок хранения, оптимальный по нашему мнению, но он может быть вполне изменен как на несколько дней («7 days»), так и на год («1 year»). Чтобы код работал, на хостинге должен быть включен модуль mod_expires.c. И хоть обычно провайдеры его не выключают, бывают компании, у кого он отключен. Также правильно кэшировать скрипты поможет следующий алгоритм:

FileETag MTime Size
<ifmodule mod_expires.c>
<filesmatch «.(jpg|jpeg|gif|png|ico|css|js)$»>
ExpiresActive on
ExpiresDefault «access plus 1 month»
</filesmatch>
</ifmodule>

Gzip-архивация

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

Оптимизация CSS и JavaScript

Эти действия обычно не увеличивают ощутимо скорость сайта, но возрастает Page Speed. Для оптимизации CSS можно использовать любые бесплатные онлайн-сервисы (их сейчас достаточно на просторах интернета). Они очистят ваши страницы от лишних пробелов и сократят предоставляемую информацию, где это будет возможно. Из рекомендуемых можете воспользоваться cleancss.com, iceyboard.no-ip.org (без галочки «Output using smallest size»!), cy-pr.com, YUI Compressor. Оптимизировать код JavaScript можно сервисом jslint.com, рекомендуемым Yahoo или сервисом closure-compiler.appspot.com, предлагаемым Google.

Для увеличения скорости сайта не стоит использовать асинхронную загрузку CSS, JS с основным содержимым страницы (текстом, таблицами, картинками и др.). Этим вы достигнете цели, и контент начнет загружаться практически сразу. Но, если пользователь увидит текст с изображением и нажмет на что-то, а загрузка стилей и скриптов тут еще не закончится, у него с большой вероятностью выскочит ошибка и все придется начинать сначала.

Дополнительные «секреты»

Существует еще несколько способов, позволяющих хоть и несущественно, но повлиять на скорость сайта. Рассмотрим основные:

  • Использование редиректа. Перенаправление страниц всегда занимает лишнее время на их открытие. И хоть на это не особо обращают внимание пользователи, поисковые машины всегда его фиксируют. Хотите ускорить сайт – прибегайте к этой функции в самых крайних случаях. Исключение может составить лишь смена используемого домена, тогда применение редиректа будет неизбежным.
  • Порядок загрузки страницы. Верхняя часть загрузочного кода должна включать верхний фрагмент загружаемой страницы. Это особенно эффективно для длинных страничек. В этом случае зашедший к вам посетитель сразу видит сначала предназначенную для него информацию. Пока он ее просмотрит, загрузится все остальное.

Также можно прибегнуть к рекомендациям Google, изложенным в их руководстве Page Speed, но они будут влиять на скорость сайта совсем не существенно.