What do percents regarding above-the-fold content mean?
32 views
Skip to first unread message
Yuri Kanivetsky
Sep 13, 2017, 7:30:57 PM9/13/17
to pagespeed-insights-discuss
Hi,
Consider a page with all css inlined in the head (not much yet probably, 12K) and only one dummy external stylesheet at the end of the body tag:
<!doctype html>
<html><head>
...<style>...</style>...
</head><body>
...
<link rel="stylesheet" href="1.css">
<script src="..."></script>
<script src="..."></script>
<script src="..."></script>
</body></html>
1.css:
.not-used-selector {color: red;}
PageSpeed tells me:
> Approximately 55% of the above-the-fold content on your page could be rendered without waiting for the following resources to load. Try to defer or asynchronously load blocking resources, or inline the critical portions of those resources directly in the HTML.
> Optimize CSS Delivery of the following:
> https://.../1.css
What do they mean by 55%? When I remove the external stylesheet from the page, the complaint is apparently gone, but what exactly does this number mean? *All* above-the-fold content can be rendered without waiting for 1.css to load. Is 55% very rough estimate?
Regards,
Yuri
Carlos Lizaga Anadon
Sep 14, 2017, 4:12:51 AM9/14/17
to pagespeed-insights-discuss
Hi Yuri,
It does mean that the part of your website that is immediately displayed on a resolution of 1024x768 could not be rendered without downloading your extra CSS.
That proportion of your website shall be rendered with your <style> node at your <head>.
Best,
Carlos.
It does mean that the part of your website that is immediately displayed on a resolution of 1024x768 could not be rendered without downloading your extra CSS.
That proportion of your website shall be rendered with your <style> node at your <head>.
Best,
Carlos.
Yuri Kanivetsky
Sep 14, 2017, 11:42:40 AM9/14/17
to pagespeed-ins...@googlegroups.com
Hi,
I just added empty stylesheet to the page. And PageSpeed says:
> Approximately 56% of the above-the-fold content on your page could be rendered without waiting for the following resources to load. Try to defer or asynchronously load blocking resources, or inline the critical portions of those resources directly in the HTML.
https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2F082.vps.ho.ua%2F&tab=desktop
Whole page can be rendered without this stylesheet. Not just 56% of
above-the-fold content. Do you understand what this number means?
Regards,
Yuri
I just added empty stylesheet to the page. And PageSpeed says:
> Approximately 56% of the above-the-fold content on your page could be rendered without waiting for the following resources to load. Try to defer or asynchronously load blocking resources, or inline the critical portions of those resources directly in the HTML.
> Optimize CSS Delivery of the following:
> https://082.vps.ho.ua/static/1.css
https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2F082.vps.ho.ua%2F&tab=desktop
Whole page can be rendered without this stylesheet. Not just 56% of
above-the-fold content. Do you understand what this number means?
Regards,
Yuri
Carlos Lizaga Anadon
Sep 15, 2017, 4:33:47 AM9/15/17
to pagespeed-insights-discuss
Hi,
Of course that the whole page can be rendered without that CSS since that CSS is empty.
But you need to make sure that you can load en 100% of your above-the-fold content with inlined CSS (<style>...</style>).
An then load asynchronously the rest of the CSS needed to render all your page.
Take a look into this article: https://www.sitelocity.com/critical-path-css-generator
Best,
Carlos.
Of course that the whole page can be rendered without that CSS since that CSS is empty.
But you need to make sure that you can load en 100% of your above-the-fold content with inlined CSS (<style>...</style>).
An then load asynchronously the rest of the CSS needed to render all your page.
Take a look into this article: https://www.sitelocity.com/critical-path-css-generator
Best,
Carlos.
Yuri Kanivetsky
Sep 16, 2017, 5:22:01 AM9/16/17
to pagespeed-ins...@googlegroups.com
Hi,
I'm concerned solely with the number. I can't help but think that it
can be grossly inaccurate. Am I wrong?
Regards,
Yuri
I'm concerned solely with the number. I can't help but think that it
can be grossly inaccurate. Am I wrong?
Regards,
Yuri
Reply all
Reply to author
Forward
0 new messages