Should a separate link or a single link be given to the image and text?

Question

I have a local news site, on the homepage, I link to the thumbnail and the post title.

Is it better for SEO to have single links or separate links?

We can explain this with an example;

Single link =

<a href="/article.html">
   <img src="/article.jpg" alt="article" />
   <span>article title</span>
</a>

Separate link to image and title

<a href="/article.html">
   <img src="/article.jpg" alt="article" />
   </a>

<a href="/article.html">
 <span>article title</span>
</a>

Answer 1

With the single link option search engines will treat the image's ALT text as if it is the anchor text of a traditional link.

Ex: <a href="url">This is Anchor Text</a>

Possible implications:

• The ALT text of an image should be treated as a description of the image, not what a user should expect if they click on it.
• This rules out the strategic use keywords, because ALT tags are an accessibility option for visually impaired users.
• If the description of the image doesn't match with what the article is really about, that doesn't help you. Regardless of keywords it would be nice to have the anchor text be the story's headline.

---

With the separate link to image and title option you link to the article twice.

That is totally fine, except I believe Google still only counts the anchor text of the first link that appears in the html.

Here's an article on this from Rand Fishkin back in '08, I can't find any sources that say this has changed.

---

Make new cards?

I'd recommend re-doing your cards so there's no conundrum. This way you get to have your cake and eat it too!

Here's a pretty good example:

<div class="row">
    <div class="col s12 m7">
      <div class="card">
        <div class="card-image">
          <img src="images/sample-1.jpg" alt="Alt text here"> 
          <span class="card-title">Card Title</span>
        </div>
        <div class="card-content">
          <p>I am a very simple card. I am good at containing small bits of information.
          I am convenient because I require little markup to use effectively.</p>
        </div>
        <div class="card-action">
          <a href="[URL]">This is a link</a> <!-- Anchor text -->
        </div>
      </div>
    </div>
  </div>

That example is from a framework called materialize.css FYI.

---

Ultimately, I would say that it doesn't really matter that much in the grand scheme of things. Regardless of the route you take, this won't impact your rankings much. There are many more important things to worry about.