Увеличиваем скорость загрузки сайта
Большинство пользователей своих ресурсов занимаются украшениями своих сайтов, запихивая в него все, что только считают нужным, не понимая даже о том что еще в первую очередь, сайт, должен быть еще и оптимизирован на скорость его открытия не только в ПК но еще и на мобильных ресурсах. Например, если зашедший на ваш ресурс человек будет набл.дать на ней длительную загрузку, то он уйдет и не будет ждать, когда у вас там покрутятся какие-то колесики загрузки, тупо созданные для красоты. Но ладно это может быть красиво с ПК и можно смотреть на загрузку хроть минуту, а вот различных мобильных приложений, не очень есть хорошо, дабы человек на сайт заходит за ИНФОРМАЦИЕЙ, а не смотреть на красоту исполнения дизайна и разных загрузчиков. Промониторив интернет и тем более когда я сам для себя занимаюсь созданием сайтов, прочитав несколько статей по оптимизации понял, что красота красотой, а вотоптимизация на скорость загрузки еще никому не помешает. На данный момент существует огромное количество сервисов для анализа скорости загрузки сайта и выявления проблемных мест, но несмотря на это, большинство сайтов все еще не оптимизированы надлежащим способом. Хочу обратить внимание: если вы проверяете свой сайт только в сервисе Google PageSpeed Insights, то в процессе изучения поймете, что большое количество параметров там скрыто и не показывается, несмотря на то что все равно влияет на скорость загрузки сайта. Под понятием "Рамки оптимизации скорости сайта" я понимаю такой объем CSS, JS, картинок и других файлов, которые загружаются на вашем сайте. Итак, разберемся для начала к оптимизации изображений Используйте изображения именно того разрешения, которое необходимо на странице. Часто встречаются ситуации, когда используются изображения, у которых разрешение большое (например, 800x600px), а на странице используется лишь миниатюра (например, 300x225px). Особенно часто встречается данная ошибка при создании фотогалерей. Используйте только то разрешение изображения, которое необходимо в конкретной ситуации. Оптимизировать изображения: PNG, JPG можно с помощью данного сервиса Научитесь уменьшать количество запросов Объедините все CSS файлы в один это уменьшит количество запросов к серверу. Плагины для сборщиков gulp-concat-css, grunt-concat-css, css-concat-loader Объедините все доступные вам JS файлы в один по возможности gulp-concat-js, или этим сервисом Конвертер HTML в PHP, JavaScript, ASP Оптимизируйте CSS и JS Сжать CSS файлы можно сжать вот этим сервисом, кстати им постоянно пользуюсь и я сам hammga, или cssminifier Сжимайте все доступные для вас JS файлы Предлагаю также воспользоваться такими сервисом которым работаю и оптимизирую сам, это JavaScript Compression Tool Загружайте все CSS и JS файлы в самом конце вашей страницы, по возможности в нижнюю часть сайта. Между тегами на страницах вашего сайта Код <style> и </style> Самое важное, это если вы берете скрипты с сторонних сайтов, то обязательным условием - удалите из адресов JS и CSS файлов все строки, которые указывают версию скрипта или стиля и т.д. Особенно если там стоят ссылки на авторство, дабы будет идти подгрузка ссылки на другой сайт через скрипт или файл CSS Ну на этом практически и все. У кого какие имеются добавления, то рады будем видеть данное в ответах к данной теме. Будем вместе делиться полезными материалами и вместе сделаем наши сайты, еще быстрее и комфортнее! |
Поделиться в социальных сетях
Материал разместил
Комментарии: 16 | |
| |
1 2 » | |