Частота обновления (передачи данных с веб-сервера в браузер клиента), как правило, ограничивается хостинг-провайдерами, так что, как владелец сайта, Вы должны убедиться, что он использует как можно меньше трафика, чтобы избежать дальнейших проблем.
В этой статье я опишу несколько наиболее полезных советов, чтобы сохранить максимальное количество трафика, и сделать свой сайт очень быстрым.
Используйте CSS вместо изображений
Изображения потребляют много трафика. Большинство современных браузеров имеют возможность отображать различную css-графику вроде округлых уголков и теней. Вы обязательно должны использовать CSS вместо изображений, везде где это возможно, так как CSS код потребляют намного меньше трафика, чем изображения.
Если Вам нужен сайт, совместимый со старыми браузерами, такими как печально известный IE6, решение заключается в использовании альтернативных стилей и изображений только для старых браузеров. Можно использовать условные комментариии и отдельные стили для IE6:
<!--[if IE 6]>
<link href="ieonly.css" rel="stylesheet" />
<![endif]-->
Оптимизируйте ваши изображения
Хотя вы можете заменить многие изображения с CSS, картинки по-прежнему являются важной частью сайта. Но когда вам нужно использовать изображения, вы должны убедиться, что они оптимизированы для отображения в Интернете.
Если вы используете Adobe Photoshop, вы можете использовать пункт меню «Save for web», который позволит вам с легкостью найти наилучший компромисс между качеством и размером изображения. Другим вариантом является использование бесплатных онлайн-сервисов для сокращения размера, сохраняя при этом высокое качество (например Smush It)
Если вы используете WordPress, вы будете рады узнать, что для него существует бесплатный плагин Smush It. Установите его, и он будет автоматически оптимизировать любое изображение, которое вы загрузите на сайт с помощью загрузчика WordPress. Круто, не правда ли?
Используйте кэширование
Кэширование — это извлечения готовых данных из специального хранилища (так называемый кэш), а не генерации страниц каждый раз, даже когда необходима одна и та же информация.
Приведенный ниже код добавляет кэширование файлов, форматов .JPG, .GIF, .SWF. Кэш будет храниться 1 неделю. Для других типов файлов, вы можете настроить другое время жизни кэша. Например, CSS и JavaScript файлы должны храниться в течение 12 часов.
вставьте его в свой .htaccess
<filesmatch ".(jpg|jpeg|png|gif|swf)$"="">
Header set Cache-Control "max-age=604800, public"
</filesmatch>
Используете WordPress? Тогда я рекомендую установить плагин W3 Total Cache. Это бесплатное и качественное решение для кэширования, которое помогает оптимизировать каждый аспект вашего блога или сайта. Это делает ваш сайт быстрее и использует меньше трафика.
Предотвращение кражи трафика и хотлинкинга
Плохая, но очень распространенная практика в Интернете, заключается в использовании хотлинкинга. Что такое хотлинкинг? Вот небольшой пример: Сайт A — хозяин изображения, отображаемого на HTML-странице. Сайт B хочет показать то же изображение, что используется на сайте A. Сайт B вставляет прямую ссылку на изображение, лежащее на сайте А, в результате чего сайт A тратит трафик при каждой загрузке сайта B.
Таким образом, определенно, вы не хотите делиться трафиком с другими, не так ли? Чтобы защититься, создайте изображение, которое будет выводиться вместо вставленных с помощью хотлинкинга (это может быть прозрачный пиксель или надпись «не воруйте мои картинки» и загрузите его на сервер, а еще лучше на бесплатный
RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(www.)?yourdomain.com [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www.)?yourdomain2.com [NC]
RewriteRule .(jpg|jpeg|png|gif)$ http://yourserver.com/yourimage.gif [NC,R,L]
Используйте сжатие CSS и JavaScript файлов
Minify — это PHP5 скрипт, который поможет вам следить несколько вы выполняете «Правила высокой производительности сайтов Yahoo!». Она объединяет несколько файлов CSS или JavaScript, удаляет ненужные пробелы и комментарии, и сжимает их с использование GZIP.
Minify входит в состав плагина W3 Total Cache.
Используйте отдельный хостинг для размещения больших файлов
Если у вас на сайте должны быть размещены большие файлы (видео, PSD-файлы, большие изображения, и т.д.) вы должны обязательно использовать другой
Используйте сжатие GZip для PHP файлов
Техника GZip-сжатия, обеспечивает сжатие данных отправляющихся с Вашего веб-сервера браузеру, который распаковывает эти данные на лету, тем самым уменьшая объем переданных данных, и увеличивая скорость отображения страниц. Все современные браузеры поддерживают сжатие GZip.
Для использования GZip-сжатия на вашем сайте, вы должны создать 2 файла. Имя первого gzip_header.php:
$phpver = phpversion();
$useragent = (isset($_SERVER["HTTP_USER_AGENT"]) ) ? $_SERVER["HTTP_USER_AGENT"] : $HTTP_USER_AGENT;
if ( $phpver >= '4.0.4pl1' && ( strstr($useragent,'compatible') || strstr($useragent,'Gecko') ) ) {
if ( extension_loaded('zlib') ) {
ob_start('ob_gzhandler');
}
} else if ( $phpver > '4.0' ) {
if ( strstr($HTTP_SERVER_VARS['HTTP_ACCEPT_ENCODING'], 'gzip') ) {
if ( extension_loaded('zlib') ) {
$do_gzip_compress = true;
ob_start();
ob_implicit_flush(0);
header('Content-Encoding: gzip');
}
}
}
Теперь создайте второй файл и назовите его gzip_footer.php:
$gzip_contents = ob_get_contents();
ob_end_clean();
$gzip_size = strlen($gzip_contents);
$gzip_crc = crc32($gzip_contents);
$gzip_contents = gzcompress($gzip_contents, 9);
$gzip_contents = substr($gzip_contents, 0, strlen($gzip_contents) - 4);
echo "x1fx8bx08x00x00x00x00x00";
echo $gzip_contents;
echo pack('V', $gzip_crc);
echo pack('V', $gzip_size);
После того как вы создали gzip_header.php и gzip_footer.php файлы, вам нужно инклудить их в ваш код, непосредственно в самом начале и в самом конце файлов.
Используйте надежный хостинг
Наконец, вы должны использовать надежный веб-хостинг, если вы хотите, чтобы ваш сайт был быстрым.
Оригинал — Cats who Code
Автор: Tairesh