4

I'm in the process of updating my website by replacing large PNG images with inline SVG images.

My current code looks something like this:

<h1>
    <img src="logo.png" alt="Company Name" />
</h1>

And I'd like to replace it with something like this:

<h1>
    <svg>
        <title>Company Name</title>
    </svg>
</h1>

As far as I'm concerned, this is correct HTML5 markup. But I'm a bit worried that this might affect page ranking negatively after all you can read about the importance of the H1 and TITLE tags for SEO.

Does anyone know more on this or have any tips on how to go about this?

(I'm aware that I could simply change the src-attribute of the tag to point to the SVG version of the logo, but I prefer to include it inline in order to reduce the number of HTTP requests.)

Improve this question
6
  • 3
    You are way over-thinking things. Things like this are so minor that you won't even see any difference between the two. Most rankings has nothing to do with mark-up, hence why WIKI, TXT and PDF can rank so easily. – Simon Hayter♦ Jun 28 '15 at 11:35
  • I'll have to disagree with @BYBE. Arguing that html mark-up barely has anything to do with seo is flat out not true. Content is definitely the most important thing which is why wiki, txt, and pdf rank so easily, but it is certainly not the only determining factor. Check out some of Matt Cutts videos from google. He talks about the importance of image seo a lot. Also, this is probably a duplicate of this: webmasters.stackexchange.com/questions/56669/… – Bryan Willis Jun 29 '15 at 12:58
  • 1
    @Candid Markup is not the same thing as content. Also, those file types do not rank better than other file types. A minor change like the one above will have virtual no effect on a page's ranking. It's over-optimizing at best. – John Conde♦ Jun 29 '15 at 13:36
  • Hehe think @Candid misunderstood... of course content is definitely the most important thing, but to claim markup has a huge influence would be a false statement, I wish it did... but it doesn't... Google is constantly behind the times, e.g Responsive Design was first demonstrated in 2004 using liquid adaptable containers, then in 2008 it was primed in a CSS3 release.... it then took Google 7 years to start rewarding for responsive design, and even then its very MINOR. – Simon Hayter♦ Jun 29 '15 at 16:02
  • 1
    John out of curiosity can you add microdata to svg file types? If not wouldn't that be true that images rank better in certain situations? Is it possible to use itemprop="logo" on an inline svg? If not you wouldn't be able to use it for knowledge graph logo right? – Bryan Willis Jun 29 '15 at 16:55
2

2 ways to add title: with css and positioning and z-index. But this would never scale well with svg. And SVG is perfect in scaling. You could use the foreignObject tag to add html items in your SVG. At least every tekstbrowser, like a bot, can read that. I do not know if Google-bot will do somethig with that, but at least it is readable. My experience is not to overestimate such details. text like svg loads much faster than an image,google rewards speed of your site:)

Improve this answer

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.