Is this way of internal CSS valid?

user_1829920 0
Viewed 66

I am trying to optimize a small website, I am now looking into the CSS.

Let's take the example of index.php. I have first done it the standard way by adding <link rel="stylesheet" href="style.css"> in the <head> of my HTML output.

Google PageSpeeds then complains about the render-blocking files.

I then tried an alternative way and instead of the <link> tag above, I added this in the <head> :

<style>
    <?php include 'style.css';?>
</style>

This effectively gives me an internal CSS while still having the convenience of having one file for all my pages. I do not have render blocking files anymore and PageSpeed seems happier.

Is there any significant drawback here? Should I be as happier as Google PageSpeed is?

google-pagespeed css
1 Answers

Google's documentation for optimizing CSS delivery suggests only inlining small amounts of critical CSS. You'll find that caching techniques can reduce the parsing time required for including your CSS file. There will be a sweet spot where it's worth the maintenance cost.

You could look at installing the Page Speed module as well. Some more articles about PHP caching are below. You might also look at enabling compression for your static file transfers - that reduces the size for most text files significantly.

Will_Bickford_430120
Related