Missing WordPress Gravatar ALT tag value? How to fix – IMG tag does not have an ALT attribute defined – SEO Error reported by Bing Webmaster Tool

Last updated
App Shah
Crunchify » SEO 101 Tutorials » Missing WordPress Gravatar ALT tag value? How to fix – IMG tag does not have an ALT attribute defined – SEO Error reported by Bing Webmaster Tool
The IMG tag does not have an ALT attribute defined - Bing Webmaster Result - How to fix

I have been doing quite a few changes to Crunchify site recently related to Search Engine Optimization (SEO) and better site loading prospective.

While working with my client last week, we discover that Bing SEO Report showed quite a few SEO suggestions.

If you are wondering what all types of suggestions Bing is giving then look at below:

  • The title is missing in the head section of the page.
  • The <img> tag does not have an ALT attribute defined.
  • The page contains multiple titles.
  • Evaluated size of HTML is estimated to be over 125 KB and risks not being fully cached.
  • The page is missing meta language information.
  • The title is too short or too long.
  • The <h1> tag is missing.
  • The description is missing in the head section of the page.
  • The description is too long or too short.

In this tutorial we are going to discuss how to fix <img> tag ALT attribute issue.  

ALT & TITLE tags for Gravatar Tips 🙂

Let’s get started:

Step-1.

  • Go to Bing Webmaster tool.
  • I assume that you have already added your site and verified it.
  • Click on Dashboard -> Reports & Data -> SEO Reports.
Bing Webmaster SEO Report Tab with SEO Suggestions

Step-2

  • Click on The <img> tag does not have an ALT attribute defined link.

Step-3

  • Click on any one of the NON-COMPLIANT PAGES.
  • Wait for your report to load.
  • Don’t click Analyze button now.
  • Click on Page Source Tab.

Step-4

  • You could see error in yellow color background as you see at the top of this page.

Step-5 Why this error?

In WordPress, by default, Gravatar doesn’t add ALT tag while grabbing image from gravatar server. Optimizing a site for SEO and overall html5 compliance requires that you have ALT and preferably TITLE tags for all images displayed on the site and hence Bing is showing that error.

If you have default WordPress comment, you would miss ALT tag for all your commenter’s image and that’s a big issue.

Step-6 How to fix this?

We could simply fix missing ALT and TITLE tag value by adding below code to your theme’s functions.php file.

function crunchify_gravatar_alt($crunchifyGravatar) {
	if (have_comments()) {
		$alt = get_comment_author();
	}
	else {
		$alt = get_the_author_meta('display_name');
	}
	$crunchifyGravatar = str_replace('alt=\'\'', 'alt=\'Avatar for ' . $alt . '\' title=\'Gravatar for ' . $alt . '\'', $crunchifyGravatar);
	return $crunchifyGravatar;
}
add_filter('get_avatar', 'crunchify_gravatar_alt');

Step-7 How to verify?

  • Now clear your site cache if you are using WP Super Cache or W3 Total Cache plugin.
  • Reload your page.
  • Right click on gravatar and Inspect HTML element.
  • You should see ALT and TITLE both tag values populated correctly.
Add ALT and TITLE both tag values for Gravatar - Crunchify Tips

22 thoughts on “Missing WordPress Gravatar ALT tag value? How to fix – IMG tag does not have an ALT attribute defined – SEO Error reported by Bing Webmaster Tool”

  1. Waaa, this didn’t work for my site either. I’m beginning to think that it is an issue that theme developers need to be made aware of.

    When adding directly to a PHP file, you’d need to create a child theme and copy the entire function.php file into the child theme folder so not to lose the code when the theme is updated in the future.

    Reply
  2. This code actually failed when people with a ‘ in their name left a comment on my posts. I added one additional line to fix this issue:

    function crunchify_gravatar_alt($crunchifyGravatar) {
    	if (have_comments()) {
    		$alt = get_comment_author();
    	}
    	else {
    		$alt = get_the_author_meta('display_name');
    	}
    	$alt = str_replace(''','',$alt);
    	$crunchifyGravatar = str_replace('alt=''', 'alt='Avatar for ' . $alt . '' title='Gravatar for ' . $alt . ''', $crunchifyGravatar);
    	return $crunchifyGravatar;
    }
    Reply
    • Hi Igor. Thanks for your suggestion.

      I’ll take a look and verify your change in few days and update. Appreciate your feedback.

      Reply
    • Hi Igor – by any chance do you have complete code which uses pre_get_avatar_data? I tried at my end but I was not able to modify alt value at my end.

      Reply
    • Hi @disqus_A5VmQr0Crt:disqus. Thanks. What error are you getting? Any log you could share? I’m more than happy to help check your issue.

      Reply
    • Yeah. That’s right Will. You could use above tutorial code as it is.

      Feel free to let me know if you face any issue.

      Reply
  3. I have read great feedbacks on this code. Unfortunately for me, when I put in the code, the editor puts a bad mark on the line;

    $text = str_replace('alt=''', 'alt='Avatar for '.$alt.'' title='Gravatar for '.$alt.''',$text);
        return $text;

    And says; ‘expected an identifier and instead saw ‘ ‘

    What can I do?

    Reply
    • How are you putting code Ugochi? Try copying code block to Text editor and from it to your WordPress functions.php file.

      Might be some laptop/desktop specific encoding issue.

      Reply
    • Hi Luke – good to hear tutorial tips are working on your site. Happy blogging and let us know any additional tutorial you want to see on Crunchify.

      Reply
      • Is it possible to change the Gravatar image without an alternate author plugin? I’d rather it load from my own site than Gravatar.

        I mainly ask this as I’m always seeing an issue for this in PageSpeed for ‘Leverage browser caching’ – so if we can just choose what image to have, that’d be cool…

        Reply
        • I personally don’t recommend using extra plugin as we always follow bare minimum plugin pattern 🙂 Single or few gravatar image loading shouldn’t be a problem.

          If you have ~50 comments on single post then it’s really bad loading and making ~50 Gravatar calls. Disqus is the best alternative in that case.

          Reply

Leave a Comment