Don't put custom styling at top of markdown file

CRP.

Depends on footprint and added HTTP requests. People will tell you multiplexing takes care of all of this, but compression algorithms (gzip) are more effective for larger files and http2 doesn’t take care of all latency issues for slower connections

It’s largely a UX decision related to your target audiences device, bandwidth, etc. Do you want that time to first render to be lightnight fast, or do you want your end user to have a big old CSS file that’s just cached and ready to go for repeat views? AMP…I digress.

Many things will change with HTTP2. Including loading of CSS resources (i.e. forget about sprites).

But mine was a bit of a rhetorical reply @rdwatters and I had to look up at what CRP stands for (never was a fan of Internet acronyms).

Back on topic. I have yet to see significant performance difference between loading a stylesheet in the <head> and inlining <style> in the body.

I’m aware of all the funky techniques out there. But I’ve also seen articles from big news organizations littered with stray CSS rules after a website redesign. Now that’s bad UX. It shows a lack of foresight but then again who am I to judge?

I don’t base it off my own experience. That’s pretty solipsistic. But hey, I guess Paul Irish and Google could be way off.

You’re in luck since it’s not an acronym but an initialism…like HTTP and CSS :smile:

And the Pedantic Award goes to @rdwatters!

Dammit, I’ll get it next month!

More like “Snarky Irony Award,” but you’re right in that I was being a bit douchey. Please don’t take it personally, @alexandros. My brand of sarcasm doesn’t always transmit well on forums, and I really do always appreciate the feedback from both you and @maiki :smiley:

OMG, can you get more pedantic?! :stuck_out_tongue_winking_eye:

In other news, and actually contributing to the discussion, would you like to explain what C-reactive protein has to do with your earlier point? Or did you mean a different CRP?

Not a fan.

He meant the Critical Rendering Path as per Google’s definition.

EDIT
How the CRP is relevant to <style> elements in the body of content is beyond me. Perhaps @rdwatters will enlighten us.

And BTW a while back I came up with the inline CSS trick in the head of a Hugo project to help with the Critical Rendering Path. That is a very different approach than littering content with <style> elements.

And TBH I don’t care what Google says. I would prefer not to do this under any circumstances. Hell! I would even educate my clients that a High PageSpeed score doesn’t matter in this case and if there is a performance gain it is definitely not worth it.

With that said frameworks like Tachyons, Atomic/Functional CSS and using inline styles (when needed) are very different than using <style> in the content. And -like I said- I do use inline styles -even though they’re frowned upon in some quarters of the net-.

This is getting a bit off track :smile: The original point of this post was CSS showing in an RSS feed because of .Summary. I’ve already had extensive conversations about this since it really has nothing to do with whether CSS is in body copy, so I think my participation in this thread is over, but I have a very good idea of @alexandros preferences now and will provide support accordingly in future threads.

https://github.com/gohugoio/hugo/pull/3219

How magnanimous of you. Thanks!

1 Like