5

I manage several websites, one of which is an e-commerce site with a lot of images. At the top of some product category pages, there are image links to specific products (think image banners).

I am curious how others handle images as links and what SEO considerations you make when doing so? Specifically, there are 2 ways one can code an image link:

  • #1 The image can be the background of the actual anchor tag, like so:

    <a href="thelinkaddress.com" title="Visit My Link" style="background-image:url('link-image.png');background-size:100%;display:block;">My Image Link</a>
    
  • #2 The image can be contained within the anchor tag as another HTML element:

    <a href="thelinkaddress.com" title="Visit My Link"><img src="link-image.png" alt="My Link Image"/></a>
    

My understanding is that method #1 will not index the image with a search crawler because it is considered a style, but I suspect that text content is more important to a search crawler than an image with alt text.

Does anyone have insight into how either way impacts the SEO of a web site?

  • 1
    I like this question! It brings up a good point that should help others in the future. – closetnoc Jul 30 '15 at 15:52
  • Is there something that needs to be cleared up, explained better, needs more detail, or any additional question that I can take a stab at?? I know SEO fairly well. – closetnoc Aug 5 '15 at 21:30
  • @closetnoc your answer was excellent and very insightful -- I put a bounty on this to encourage a cross-section of answers. Others must have a perspective on how they architect links and images in regard to SEO. – CreMedian Aug 6 '15 at 0:44
  • Just making sure. I am here for you anytime you need me. Cheers!! – closetnoc Aug 6 '15 at 0:47
5
+50

From the very beginning, Google primarily utilized three perspectives when using semantics and ranking: one, link text and value to the target page; two, the title tag of the target page; and three, the content itself. One of the interesting research results the project found was that performing a search against the title tag was about 2% more effective than performing a search against the content itself. The notion of blended results was implemented where two searches were made using the search query against the title tag and the content separately along with ranking scores applied and the results of both queries blended into a single result. This is a fundamental tactic that I am sure still applies. This is one of the reasons why the title tag is so important.

Why did I tell you that?

The third most valuable semantic signal is link text. In effect, the same process for link text just like title tags could be applied with highly accurate results setting aside low quality links such as read more. This means that the title tag and the link text (targeting the page) are of significant importance.

The image alt text primarily benefits the image which it is designed to do. Many SEOs over emphasize the semantic effects of image alt text giving the impression that it carries a more significant weight where this is simply not true. Any semantic benefit that an image alt text gives is significantly less than the content. Remember the three most significant semantic signals are the title tag, link text, and the content itself. Image alt text, while a clue and can help broaden the semantic profile for any page, is significantly less important than other signals such as header tags which carry significant weight following the content block theory that has also existed since the beginning.

Setting aside the importance if the alt text, the link text is a far stronger signal for the target page.

Today, there are a ton of semantic signals used and each have it's value in evaluating the topic of a page. Still, the most important two signals are the title tag and the link text to the target page.

Based upon this, your first example...

<a href="thelinkaddress.com" style="background-image:url('link-image.png');background-size:100%;display:block;">My Image Link</a>

...sends a much stronger signal for search assuming that the link text properly matches the page topic and reflects the most important keyword elements of the target page and are not over optimized or too optimistic. Any title tag should do the same.

  • Great answer! What you're saying really forces me to think about the semantics of the link and its context -- is the page that the link goes to more valuable to a user (like to a specific product) or is the page containing the link more valuable (like a topical page about the general product category). You have provided good food for thought – CreMedian Jul 30 '15 at 16:19
  • 2
    @CreMedian Ironic you should ask. I just answered that question the other day. Here it is: webmasters.stackexchange.com/questions/83238/… – closetnoc Jul 30 '15 at 16:22
1

Run an A/B test, it's the only way to really know--regardless of what has worked for others or what has worked in the past--nothing beats testing.

If you don't want to test and just want an answer you might be in the wrong line of work but let me share my totally untested opinions anyway:

Considerations

Panda punished sites with too many ads "above the fold," as long as these images are on the same domain they probably won't be considered ads.

Actual <img /> images are considered content (unless quite small) and therefore should have alt text, they are also given higher priority in loading and rendering than CSS background images so there are accessibility and (contradictory) performance considerations. It's easier to scale HTML images but to control the cropping/positioning of background images.

Plain Ol' Semantic HTML

If these images are repeated frequently and mostly identical throughout the site then they are probably better suited to background images as they aren't really content, they are really navigation.

If these images are more targeted--offers that are highly relevant to the places where they are located--then they are part of the "content" of those pages and should be <img /> images with alt text (for accessibility and usability).

Title attribute?

I think @closetnoc is referring to title attributes (which are valid on any HTML element and generally display as tootltips on hover) but it's plausible he means the <title> element of the page that the link points to.

I'm going to assume that he means title attribute and the jury is out on how much, if any, significance Google gives the title attribute (google it).

Google encourages using the title attribute on images, but nothing on using it on links (if you go the CSS background image method).

And there's plenty of claims that the title attribute is ineffective at influencing ranking and indexing, see here and here.

I don't know if I believe it has any SEO value at all (might have value to users) or not, which is why I encourage you to test and see.

Pattern Detection

Google is great at detecting and discounting patterns: think "duplicate content."

The more "unique" content you have the better so I suspect a mixture of the 2 techniques, with as much variation as possible in images, alt text and anchor text as possible will be the most effective.

A/B Testing to the Rescue!

Why guess when you can test?

  • I am talking about a time frame of 1997 where Google was a research project and the clues given in the original research paper that still permeate Google's primary methods today. I am talking about the title tag and not about the title attribute which did not exist at the time. Of paramount importance is the title tag, link text, content block surrounding the link on both pages (source and target), and the content itself seen as text. These make-up the trifecta in SEO performance that must exist before anything else. SEO is really a simple process following search history. – closetnoc Aug 7 '15 at 15:32
  • Indeed. Amazing how often SEO's overthink things without reviewing fundamentals--you can learn a lot by looking over Google's Patent applications. – adam-asdf Aug 8 '15 at 21:52
  • That is exactly what I do. I also look at research papers, books written by the engineers, and so on. I combine that with my experience in large-scale development, database, AI, semantics, and so on. I am semi-retired and had to dust of a few things... ;-) ...including my books. – closetnoc Aug 8 '15 at 23:22

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.