Google PageSpeed Insights – онлайн-сервис, который поможет увеличить скорость загрузки сайта

Сервис PageSpeed Insights проверяет, с какой скоростью загружается сайт, и дает советы для исправления ошибок. На фото: итоги тестирования на скорость загрузки сайта Теплицы. Изображение: скриншот с сайта developers.google.com
Сервис PageSpeed Insights проверяет, с какой скоростью загружается сайт, и дает советы для исправления ошибок. На фото: итоги тестирования на скорость загрузки сайта Теплицы. Изображение: скриншот с сайта developers.google.com

Если ско­рость ваше­го сай­та быст­рая, то вы полу­ча­е­те зна­чи­тель­ные плю­сы ран­жи­ро­ва­ния у поис­ко­вых систем. А это важ­ный момент для SEO. Нуж­но так­же пом­нить: чем доль­ше гру­зит­ся ваш сайт, тем боль­ше вы теря­е­те потен­ци­аль­ных чита­те­лей. Что сде­лать, что­бы стра­ни­цы ваше­го сай­та загру­жа­лись мгно­вен­но? В этом помо­жет онлайн-сер­вис PageSpeed Insights, раз­ра­бо­тан­ный Google. Кор­ре­спон­дент Теп­ли­цы про­те­сти­ро­вал инстру­мент.

С помо­щью сер­ви­са мож­но само­сто­я­тель­но уве­ли­чить ско­рость загруз­ки сай­та. Нуж­но толь­ко сле­до­вать его реко­мен­да­ци­ям. PageSpeed Insights про­ве­ря­ет, с какой ско­ро­стью загру­жа­ет­ся сайт, и дает сове­ты для исправ­ле­ния оши­бок. Сер­вис про­во­дит два ана­ли­за: для ком­пью­тер­но­го бра­у­зе­ра и мобиль­но­го. Если ваш сайт адап­ти­ро­ван под мобиль­ные устрой­ства – оцен­ка будет высо­кая. Оцен­ка про­хо­дит по двум пока­за­те­лям: вре­мя загруз­ки верх­ней части стра­ни­цы и вре­мя пол­ной загруз­ки стра­ни­цы.

Начать ана­лиз очень про­сто. Нуж­но вве­сти адрес ваше­го сай­та в стро­ку для ана­ли­за. Я вве­ла URL сай­та Теп­ли­цы. Через 10 секунд были резуль­та­ты тести­ро­ва­ния. Выхо­дит оцен­ка загруз­ки – от 0 до 100. И чем боль­ше оцен­ка, тем луч­ше. Если стра­ни­ца набра­ла боль­ше 85 бал­лов, зна­чит, она загру­жа­ет­ся быст­ро. У Теп­ли­цы пока­за­те­ли такие: для ком­пью­те­ра – 60 бал­лов, для мобиль­ной вер­сии – 61.

Что нужно исправить

Раз­бе­рем, как мож­но уве­ли­чить ско­рость загруз­ки, на при­ме­ре оши­бок, най­ден­ных при тести­ро­ва­нии сай­та Теп­ли­цы. Одни реко­мен­да­ции сер­ви­са выде­ле­ны крас­ным цве­том, это озна­ча­ет, что непо­лад­ку нуж­но обя­за­тель­но испра­вить, дру­гие – жел­тым, зна­чит, испра­вить по воз­мож­но­сти, зеле­ный цвет пока­зы­ва­ет, какие пра­ви­ла выпол­не­ны хоро­шо. К каж­до­му пара­мет­ру, кото­рый нуж­но дора­бо­тать, есть подроб­ная инструк­ция, как это сде­лать.

Еще по теме: Инстру­мен­ты для поис­ко­вой опти­ми­за­ции сай­та

1. Исполь­зо­вать кэш бра­у­зе­ра. Эта реко­мен­да­ция сер­ви­са была выде­ле­на крас­ным цве­том. Для нача­ла мож­но озна­ко­мить­ся с подроб­ной инструк­ци­ей от Google и понять, что же такое кэш. Бла­го­да­ря кэши­ро­ва­нию поль­зо­ва­те­ли посе­ща­ют сайт повтор­но и тра­тят мень­ше вре­ме­ни на загруз­ку стра­ниц. Дело в том, что ста­ти­сти­че­ские объ­ек­ты (скрип­ты, CSS фай­лы, фай­лы изоб­ра­же­ний, исполь­зу­е­мых на web стра­ни­це) долж­ны соот­вет­ство­вать опти­маль­ным тре­бо­ва­ни­ям. Выпол­нить эту зада­чу не так-то про­сто. Воз­мож­но, для это­го вам потре­бу­ет­ся зна­ние тех­ни­че­ских навы­ков или помощь про­грам­ми­ста.

Но мож­но посту­пить более про­стым спо­со­бом: уста­но­вить спе­ци­аль­ный пла­гин кэши­ро­ва­ния для WordPress WP Super Cache, кото­рый авто­ма­ти­че­ски устра­нит эту про­бле­му. При рабо­те пла­ги­на нуж­но выбрать функ­цию «упро­щен­ное кэши­ро­ва­ние». После такой мани­пу­ля­ции сайт будет загру­жать­ся быст­рее.

gugl-pejdzh-1
Зеле­ная галоч­ка озна­ча­ет, что про­блем не было обна­ру­же­но. Изоб­ра­же­ние: скрин­шот с сай­та developers.google.com

2. Опти­ми­зи­руй­те изоб­ра­же­ния. Сер­вис поре­ко­мен­до­вал умень­шить раз­мер иллю­стра­ций на несколь­ких стра­ни­цах и дал на них ссыл­ки, что очень удоб­но. Еще мож­но перей­ти по ссыл­ке и про­чи­тать подроб­ные инструк­ции, как сле­ду­ет загру­жать изоб­ра­же­ния на сайт. Напри­мер, необ­хо­ди­мо сжи­мать изоб­ра­же­ния с помо­щью спе­ци­аль­ных инстру­мен­тов. Для это­го подой­дут бес­плат­ные сер­ви­сы Compressor.io, TinyPNG или ImageOptim, кото­рые умень­ша­ют раз­мер гра­фи­че­ско­го фай­ла на 80% без поте­ри каче­ства. Еще нуж­но загру­жать фото­гра­фии толь­ко в JPG фор­ма­те, нико­гда не исполь­зо­вать фор­ма­ты BMP и TIFF. Итак, каж­дое изоб­ра­же­ние нуж­но сжи­мать и под­го­нять под нуж­ный раз­мер.

Полез­ным может ока­зать­ся пла­гин для сай­тов WordPress Regenerate Thumbnails (его уста­но­ви­ли более мил­ли­о­на раз!). Он помо­га­ет обно­вить раз­ме­ры мини­а­тюр: нужен, когда вы меня­е­те шаб­лон и изме­ня­е­те раз­мер типа мини­а­тю­ры. Сер­вис реко­мен­ду­ет опти­ми­зи­ро­вать изоб­ра­же­ния как мож­но ско­рее, поэто­му выде­ли­ли его крас­ным цве­том.

3. Сокра­ти­те CSS. Google пред­ло­жил сокра­тить объ­е­мы CSS фай­лов на сай­те. К ним мож­но отне­сти лиш­ние про­бе­лы, пере­но­сы, стро­ки, сим­во­лы и ком­мен­та­рии в JavaScript и CSS фай­лах, кото­рые появ­ля­ют­ся при коди­ро­ва­нии. Имен­но эти лиш­ние эле­мен­ты уве­ли­чи­ва­ют объ­ем, кото­ро­го долж­но быть как мож­но мень­ше. Устра­нить эту непо­лад­ку мож­но несколь­ки­ми спо­со­ба­ми: уста­но­вить пла­гин для WordPress Autoptimize или рас­ши­ре­ние для бра­у­зе­ра Chrome PageSpeed Insights. Общую инструк­цию о том, как сокра­тить такие фай­лы, мож­но почи­тать по ссыл­ке. Реко­мен­да­ция тоже была выде­ле­на крас­ным.

4. Уда­ли­те код JavaScript и CSS, бло­ки­ру­ю­щий отоб­ра­же­ние верх­ней части стра­ни­цы. Этот совет был выде­лен жел­тым цве­том. Его суть в том, что­бы изба­вить­ся от лиш­них опе­ра­ций при пока­зе стра­ни­цы. Дело в том, что перед пока­зом стра­ни­цы бра­у­зер выпол­ня­ет син­так­си­че­ский ана­лиз. Если при этом он обна­ру­жи­ва­ет внеш­ний скрипт, то он его загру­жа­ет. Но эта опе­ра­ция не нуж­на, она толь­ко замед­ля­ет загруз­ку. В таком слу­чае загруз­ку кода JavaScript мож­но отло­жить. Подроб­нее об этом мож­но про­чи­тать по ссыл­ке и узнать, как опти­ми­зи­ро­вать CSS.

5. Сокра­ти­те вре­мя отве­та сер­ве­ра. Тести­ро­ва­ние сай­та Теп­ли­цы пока­за­ло, что вре­мя отве­та сер­ве­ра соста­ви­ло 0,28 секун­ды. В иде­а­ле оно долж­но быть не более 0,2 секун­ды. На этот пока­за­тель вли­я­ют мно­же­ство фак­то­ров: мед­лен­ная рабо­та с базой дан­ных, марш­ру­ти­за­ция, нехват­ка про­цес­сор­ной мощ­но­сти или памя­ти. Изме­нить этот фак­тор мож­но раз­ны­ми спо­со­ба­ми: сжи­мать СSS, кар­тин­ки, вклю­чить кэш или вклю­чить сжа­тие фай­лов при помо­щи GZIP.

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

Начать ана­лиз сай­та по ссыл­ке.