Question 22299 in SEO Question posted in
Some basic information to get you started with this can be found here.

Negative SEO effect on creative h1 full of span classes: Yes or no?

I’ve had a look around and couldn’t find much on the topic of "creative" h1 tags and only a little on span classes within the h1 tag.

I’ve designed an h1 as an equation, see on CodePen
Any idea what the impact on SEO can be with something like this instead of a more conservative h1?

Thanks!

h1 { font-size: calc(1rem); }

.equation, .fraction {
  display: inline-block;
  vertical-align: middle;
  text-align: center;
}

.fraction span, .equation span { display: block; }
.equation > span { font-size: 70%; margin-top: -0.5ex; }
.fraction { margin-bottom: 0.3ex; }
.numerator { margin-top: 0.3ex; }
.fraction .divider { display: none; }
.denominator { border-top: 4px solid black; }
.fraction sup, .fraction sub { font-weight: 200; }
<h1>
  <span class="equation">
    <span class="lim">YOUR</span> <span class="lim">VISION</span>
  </span>

  ✕
  <!-- 'X' -->

  <span class="fraction">
    <span class="numerator">(WEB DESIGN + Development) <sup>A/B testing</sup></span>
  <span class="divider">/</span>
  <span class="denominator"><sub>Research based</sub> UI + UX Design</span>
  </span>

  &equals;

  <span class="equation">
    <span class="lim">AWARD</span>
  <span class="lim">WINNING</span>
  <span class="lim">AGENCY</span>
  </span>
</h1>
Tags:

2

Answers


  1. 0

    the better way is that:

    take a normale Headline => <h1
    then make a normale Description Text in <p
    And then make your code example in normal div/span etc…

    Login or Signup to reply.
  2. 0

    As long as Google can read the content cleanly, this should not be a problem. Take a look at the Google cache. But the question is, what are you hoping to get out of it? More SEO power? It’s already cool implemented. Try it out.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search