0

Does putting inline CSS on a heading element such as <h1> and <h2> affect SEO? If so, how?

  • No, why would it?... however inline CSS is something you should avoid if possible, as its harder to manage and increases page size. – Simon Hayter Apr 4 '16 at 7:55
  • yes cause it will lower the value for text-to-html ratio. @SimonHayter – Alen Apr 4 '16 at 8:01
  • 1
    This isn't the 90's, Google and Bing wouldn't care less about your markup ratio. Ignore those outdated, non-sense, online SEO checkers. – Simon Hayter Apr 4 '16 at 8:18
  • so you are just referring to the Page Speed of the Site? @SimonHayter – Alen Apr 4 '16 at 8:22
  • 1
    text-to-html ratio was never a consideration. It was a typical ridiculous machination by yet another so-called SEO professional. At the time this theory appeared, Google for example, was well able to separate content from the rest of the page and evaluated content completely separate from the HTML. Ratio was never a metric or an indicator of value or quality. – closetnoc Apr 4 '16 at 14:51
3

What counts for a search engine is textual content, it will filter out everything else.

In-line CSS will contribute to the payload of the page and that affects the load speed.

  • 1
    Presumably, his inline styling of a h1 element will be insignificant. – Rob Apr 4 '16 at 10:47
2

Recent SEO tests show that Google doesn't pay much attention to tags anymore. Using <h1> tags is not really important at all anymore.

Google does give more weight to text that is large bold, above the fold, and centered. IE, text that looks like a heading. Styling your h1 tags such that they don't look like headings is going to be counterproductive. Google is going to treat the text inside an h1 that is styled to look less prominent as if it were not in a heading tag at all.

Conversely, styling a <span> or <div> to look like a heading (big, bold, and prominent) will give the text in it more SEO weight. It doesn't matter if that styling is inline, or done through a linked CSS file.

1

The main thing is that you should use separate css file for styles that improve your site's load time. On top of that, you can hide your .css from the SE bots whereas any evil inline css you use will be plainly visible to all the bots.

But if you're using nicely, there really is not a big effect on SEO or ranking.

1

Does putting inline CSS on a heading element such as and affect SEO?

No, but it might slow down the page a notch since you're expecting the web browser to apply a style on-the-fly.

If your clients support javascript, consider styling the tag with it so that most of the page loads very quickly and the style comes on after the bare bones of the page have loaded. For example:

<html>
<head>
</head>
<body>
Main content
<script>
document.getElementsByTagName('H1')[0].style.fontSize="200%";
</script>
</body>
</html>

It may add a few hundred more bytes to the HTML but at least all the text-based content will load before any styling is applied to it. This means users can see text sooner.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.