Скорость загрузки страниц
Согласно исследованию компании Strangeloop Networks, 57 % посетителей покидают страницу, которая грузится более трех секунд. Не хотите терять этих людей? Тогда сделайте так, чтобы ваш лендинг грузился быстро на всех устройствах.
Сервисы, с помощью которых можно тестировать скорость загрузки сайта:
• Pingdom (https://tools.pingdom.com);
• Google PageSpeed insights (http://bit.ly/pg-insights);
• WebPageTest (https://www.webpagetest.org).
Обращаю внимание: данные сервисы не смогут решить ваши проблемы. Их главная функция – проанализировать скорость загрузки сайта. Все дальнейшие действия должны исходить именно от вас.
Способы ускорить загрузку сайта
Уменьшение веса страниц. Слишком «тяжелый» контент долго загружается. Уменьшая вес страниц сайта, вы автоматически увеличиваете скорость его загрузки. Кроме этого, вы экономите средства, если хостинг-провайдер берет с вас плату за трафик.
Чтобы уменьшить вес страниц, в первую очередь воспользуйтесь сжатием данных в протоколе HTTP. Это уменьшает вес текстовых ресурсов, включающих элементы HTML, CSS и JavaScript, на 50 % и более. Для сжатия данных протокола HTTP используются технологии zip, gzip и другие.
Попросите хостинг-провайдера или администратора сервера включить опцию сжатия данных протокола HTTP. Оценить эффект вы сможете с помощью одного из сервисов проверки сжатия, такого как http://bit.ly/com-test. Если администратор сервера все сделал правильно, результат вас порадует (см. рис. 49).
Снижение веса графики. Графика часто составляет 80 % и более от общего размера страниц. Поэтому очень важно оптимизировать публикуемые фотографии. Данные рекомендации помогут вам облегчить изображения на 50 % и более:
• Публикуйте фотографии в формате JPEG, избегайте формата PNG. Формат JPEG позволяет сильно сжимать изображения без потери качества. Например, в день представления Windows 8 компания Microsoft опубликовала на главной странице сайта фото в формате PNG, вес которого составил 1 Мб. Фото аналогичного качества в формате JPEG весит приблизительно 140 Кб.
• Не злоупотребляйте использованием формата PNG для обеспечения прозрачности графики. Такие изображения очень красивы, но не всегда функциональны.
• Корректно выбирайте уровень качества картинок в формате JPEG. Уменьшив качество фото на 25–50 %, вы практически не заметите разницы по сравнению с исходным изображением. При этом вес иллюстрации значительно уменьшится.
• Очищайте графические файлы от цифрового мусора. Различные редакторы фотографий, которыми наверняка пользуется ваш дизайнер, оставляют в файле много ненужных данных, например комментарии, рабочие версии изображения, неиспользуемые палитры и т. п. Этот цифровой мусор не нужен вашим читателям. Чтобы очистить файл, воспользуйтесь сервисом Pngcrush (https://goo.gl/JDOaT8).
Уменьшая вес фотографий, постарайтесь сохранить эстетические достоинства сайта. Пользователи и поисковые системы больше ценят визуально привлекательные ресурсы.
Упрощение кода JavaScript и CSS. Использование специальных средств упрощения кода JavaScript и CSS уменьшает вес соответствующих элементов значительнее, чем стандартные технологии сжатия, такие как gzip. Сервисы упрощения удаляют из кода лишние элементы, а также сокращают названия функций.
Чтобы упростить код элементов JavaScript и CSS, воспользуйтесь программными средствами или онлайн-сервисами, например Online Javascript Compression Tool (https://jscompress.com) или Online JavaScript/CSS Compression (http://refresh-sf.com).
Уменьшение числа запросов браузера. Чем больше запросов посылает браузер читателя при загрузке страницы, тем медленнее она загружается. Чтобы сократить время загрузки, необходимо создать условия, при которых от браузера посетителя будет поступать как можно меньше запросов. Этого можно добиться, уменьшив количество фотографий, файлов JavaScript, кодов сторонних ресурсов и сервисов и т. п.
