• Как оптимизировать сайт по предложениям PageSpeed Insights

    УрокиКомментариев нет

    В данной статье коротко разберем основные вопросы касающиеся оптимизации сайта с помощью сервиса

    PageSpeed Insights. Я опишу какие решения мне помогли для улучшения рейтинга сайта в глазах гугла.

    1. Удалите код JavaScript, препятствующий отображению

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

    Пример:

    <script async src=»my.js»>

    Внимание! Проверьте что бы после внесения правок ваш код работал правильно, использование async не всегда является лучшим вариантом.

    Данная доработка дала мне + 5% по рейтингу PageSpeed Insights.

    2. Оптимизируйте работу CSS

    Тут можно проделать трюк что и с js, использовать анинхронную загрузку.

    Или перенести стили в подвал, но для нормального отображения составить маленький файл .css с основными стилями, что бы сайт не прыгал при загрузке. CSS стили долны быть обязательно выше js файлов.

    Также возможно

    3. Удалите из верхней части страницы код JavaScript и CSS, блокирующий отображение

    Важным моментом при переноси стилей и файлов js в подвал сайта(footer.php) является то что все стили .css обязательно! должны быть выше файлов js. В противном случае, гуглу будет все равно перенесли вы стили и js в подвал или нет. Весь css обязательно должен располагаться выше js кода, тем самым не мешая визуальному отображению сайта.

     4. Сократите(сжатия) CSS

    Для сокращения(сжатия) можно использовать вот этот скрипт: http://www.phpied.com/cssmin-js/. Так же можно обойтись бес скрипта а сразу отдавать браузеру сжатый скрипт, сжати можно тут: http://tools.w3clubs.com/cssmin/. Это то же самый скрипт, только в работе. Он удалит лишние пробелы и переходы на новую строку. При этом помните что у вас должна храниться полная версия кода, которую можно будет отредактировать и опять сжать. Сжатую версию .css файла проблематично будет править.

    Данная статья будет обновляться по мере выявления новых положительных решений оптимизации.

    Полезные ресурсы:

    http://highloadtools.com/gzip  — проверяет включен ли на сервере gzip

    http://last-modified.com/ru/if-modified-since.html  —  Проверка If-Modified-Since

     


    Будь первым кто прокомментирует статью.

    Добавить комментарий

    Войти с помощью: