Jump to content
  • 0

Как пройти Pagespeed от гугла?

Yamaradg

Asked by Yamaradg,

 Share

Question

Yamaradg Explorer

Yamaradg

Posted
Posted (edited)

Доброй ночи.
Народ.
Не подскажите как пройти спидтест для десктопа в гугле?
(впервые прохожу :) )

Есть такая страница например:
http://webmaster.ayrveda.ru/se_plus/index26083k.html
 

И результат по ней вот такой выдается:
https://yadi.sk/i/fdwugjQ5rQq9A

как уже только не оптимизировал те 2 картинки - спидтесту этому они все равно не нравятся )
+ не понятно что надо сделать со стилями и джаваскриптом.. )

Так же хотел бы поинтересоваться наиболее простым методом сжатия в GZIP
(может кто то толковую статью скинет на эту тему..)

P.S. Буду благодарен за помощь..

Edited by Yamaradg
Link to comment
Share on other sites

12 answers to this question

Recommended Posts

  • 1
kattiperk Explorer

kattiperk

Posted
Posted

97% - отличный показатель :)

Картинки пережимать не надо, ужали по максимуму - всё, иначе будет потеря качества значительная.

Да, ходит такое мнение, что пока не загрузит <head>, не выведет разметку с контентом. Скорее всего означает, что .css большой, и пока он тут грузится,контент бы уже давно загрузился и пользователь читал текст, а потом появились бы стили и текст стал красивым.

Проверьте, если хотите, тут - http://www.testmycss.com/

Вот статья, где хорошо написано про то, кто и когда загружается, кто кого блокирует и как исправить - https://varvy.com/pagespeed/critical-render-path.html

Насчет gzip - http://seo-mayak.com/sozdanie-bloga/skorost-zagruzki/kak-vklyuchit-gzip-szhatie-i-uskorit-sajt.html

Еще на хостинге можно настроить без дописывания в .htaccess, просто поставив галку там где надо в разделе личного кабинета.

  • Like 1
Link to comment
Share on other sites
  • 0
klierik Middle Developer

klierik

Posted
Posted

В данный момент указанный сайт имеет 97% с двумя рекомендациями:

  • Eliminate render-blocking JavaScript and CSS in above-the-fold content — из-за стилей

  • Leverage browser caching — из-за счетчика Я.Метрика

Рекомендации:

  1. Установить и настроить на сервере PageSpeed Module (если есть такая возможность)
  2. Перенести загрузку стилей перед закрывающимся </body>
  3. Перенести Я.Метрику перед закрывающимся </body>

Если интересно углубится в клиентскую оптимизацию то советую начать с Веб-дизайн. Лекция Виталия Фридмана и http://webo.in/articles/

 

  On 4/30/2016 at 6:49 PM, Yamaradg said:

Так же хотел бы поинтересоваться наиболее простым методом сжатия в GZIP
(может кто то толковую статью скинет на эту тему..)

Expand  

Сегодня это не более чем стандартная фича, как правило по умолчанию включена на хостинге. В твоём случае контент уже  отдаётся сжатым:

  Reveal hidden contents


 

  • Like 1
Link to comment
Share on other sites
  • 0
Yamaradg Explorer

Yamaradg

Posted
  • Author
Posted
  On 5/3/2016 at 10:07 AM, klierik said:

Рекомендации:

  1. Установить и настроить на сервере PageSpeed Module (если есть такая возможность)
  2. Перенести загрузку стилей перед закрывающимся </body>
  3. Перенести Я.Метрику перед закрывающимся </body>
  Reveal hidden contents

Зделал, как вы описали - но все равно остались те же предупреждеия..
(не вынес подключение скрипта правда(но вы и не писали об этом) т.к. там прописаны сво-ва для тегов HTMl5(для  IE-7,8,) - если выношу подключение под тег боди то в IE-7,8 все валится..)

Expand  

 

Link to comment
Share on other sites
  • 0
Yamaradg Explorer

Yamaradg

Posted
  • Author
Posted
  On 5/3/2016 at 11:44 AM, klierik said:

Окей, едем дальше. Пожми стили через "minify CSS".

Expand  

А ссылку не подскажите?
(че то слишком много всяких минификаторов в гугле со сходными названиеми.)

P.S. В гугл пейдж спиде мне кстати предлагались сжатые файлы и они уже реализованы по ссылке на страницу.
https://yadi.sk/i/FL1ITqwBrTTMt
Такой вариант не подходит?

Link to comment
Share on other sites
  • 0
klierik Middle Developer

klierik

Posted
Posted
  On 5/3/2016 at 5:08 PM, Yamaradg said:

А ссылку не подскажите?
(че то слишком много всяких минификаторов в гугле со сходными названиеми.)

Expand  

так любой "online minify css" подойдет, первый попавшийся бери, на пример: https://cssminifier.com/

  On 5/3/2016 at 5:08 PM, Yamaradg said:

https://yadi.sk/i/FL1ITqwBrTTMt
Такой вариант не подходит?

Expand  

что-то я не уверен что он пожат

Link to comment
Share on other sites
  • 0
Yamaradg Explorer

Yamaradg

Posted
  • Author
Posted
  On 5/3/2016 at 5:12 PM, klierik said:

что-то я не уверен что он пожат

Expand  

старая версия весила 7,62 КБ
а возможно сжатая 6,54 кб
Это можно считать сжатием или нет? )
Если нет то скиньте сссылку(если можно) - где именно лучше всего сжимать CSS..

Link to comment
Share on other sites
  • 0
klierik Middle Developer

klierik

Posted
Posted
  On 5/3/2016 at 5:15 PM, Yamaradg said:

Это можно считать сжатием или нет? )

Expand  

Можно

  On 5/3/2016 at 5:15 PM, Yamaradg said:

Если нет то скиньте сссылку(если можно) - где именно лучше всего сжимать CSS..

Expand  

 

  On 5/3/2016 at 5:12 PM, klierik said:

так любой "online minify css" подойдет, первый попавшийся бери, на пример: https://cssminifier.com/

Expand  

 

Link to comment
Share on other sites
  • 0
Yamaradg Explorer

Yamaradg

Posted
  • Author
Posted (edited)
  On 5/3/2016 at 5:17 PM, klierik said:

Можно

Expand  

Тогда если у меня файлы сss сжаты - то чего еще не хватает для оптимизации?
(помимо яндекс метрики - с ней чуть позже разберусь..(как время появиться. Сходу не понял че там делать надо.))

Edited by Yamaradg
Link to comment
Share on other sites
  • 0
Yamaradg Explorer

Yamaradg

Posted
  • Author
Posted (edited)
  On 5/3/2016 at 5:17 PM, klierik said:

так любой "online minify css" подойдет, первый попавшийся бери, на пример: https://cssminifier.com/

Expand  

Такой вопрос еще - а наоборот потом можно как то расжать(распаковать) все это дело если что?
(правки вносить и прочее..)

Edited by Yamaradg
Link to comment
Share on other sites
  • 0
klierik Middle Developer

klierik

Posted
Posted

Это не целесообразно.

Смотри, у тебя есть исходный CSS файл, который для разработчика. Minifi CSS, в свою очередь, для создания styles.min.css - он сжат. Он не предназначен для редактирования (хотя это возможно с помощью http://tools.maxcdn.com/procssor/). Предназначение этого файла иметь минимальный размер.

В случае когда требуется внести изменения то они вносятся в исходный, а не сжатый, файл.

  • Like 1
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to question listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept