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

Updated on Jun 28, 2021by App 22

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.

Now go to Bing Webmaster tool and click on Analyze button.
You shouldn’t see any error message now.

If you liked this article, then please share it on social media. Have a question or suggestion? Please leave a comment to start the discussion.

About App

I'm an Engineer by profession, Blogger by passion & Founder of Crunchify, LLC, the largest free blogging & technical resource site for beginners. Love SEO, SaaS, #webperf, WordPress, Java. With over 16 millions+ pageviews/month, Crunchify has changed the life of over thousands of individual around the globe teaching Java & Web Tech for FREE.

22 Comments...

Trish says

Aug 16, 2022 at 4:06 pm

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

Pieter says

Feb 14, 2022 at 2:44 pm

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;
}

Igor Jerosimić says

Jan 16, 2020 at 10:52 pm

Instead of doing string replace you can just use `pre_get_avatar_data` filter and pass alt there.

Reply
- App Shah says
  
  Feb 10, 2020 at 11:12 pm
  
  Hi Igor. Thanks for your suggestion.
  
  I’ll take a look and verify your change in few days and update. Appreciate your feedback.
  
  Reply
- App Shah says
  
  Apr 25, 2020 at 2:39 pm
  
  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
  - Igor Jerosimić says
    
    Apr 25, 2020 at 2:42 pm
    Yes, here you go:
    
    // Add alt tags to gravatar function child_pre_get_avatar_data( $args, $id_or_email ) { $args['alt'] = 'Avatar for ' . get_comment_author(); return $args; } add_filter( 'pre_get_avatar_data', 'child_pre_get_avatar_data', 10, 2 );
    Reply
    - App Shah says
      
      May 15, 2020 at 10:43 am
      
      Thanks Igor.
      
      Reply
      - Sravan Kumar says
        
        Sep 21, 2020 at 9:15 am
        
        Hello Shah, can you check my above comments on Anonymous thing?
      - App Shah says
        
        Oct 2, 2020 at 10:38 pm
        
        Hi Sravan. I’ve just checked and above step-6 code is perfectly working without any issue.
        
        Could you give it a try and let me know?
        
        Also, make sure you have added your pic on gravatar site.
    - Sravan Kumar says
      
      Sep 21, 2020 at 9:15 am
      
      This changes the Author Bio Alt tag and shows “Avatar for Anonymous”. Any solution you have for this? I appreciate your response.
      
      Reply
Elvis says

Sep 27, 2019 at 5:30 pm

Good article. I couldn’t get my gravatar to work. Thanks

Reply
- App Shah says
  
  Dec 4, 2019 at 10:36 pm
  
  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
Rajan Sharma says

Jul 24, 2019 at 7:41 pm

Thank you very much. This code worked like a charm.

I got to know about this issue when I put my website on ryte.
Thank again.

Reply
- App Shah says
  
  Dec 4, 2019 at 10:36 pm
  
  You are welcome Rajan. Happy to help!!
  
  Reply
Will Mitchell says

May 31, 2019 at 1:43 pm

Dumb question but we can use the code as is? No need to change “crunchify”?

Reply
- App Shah says
  
  Jul 1, 2019 at 9:15 pm
  
  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
Ugochi says

Mar 30, 2017 at 3:05 pm
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
- App Shah says
  
  Apr 2, 2017 at 10:56 am
  
  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
Luke Ward says

Mar 6, 2017 at 5:35 pm

Worked like a charm! This is the fourth update I’ve made today from your blog – really love your tips! Thanks 🙂

Reply
- App Shah says
  
  Mar 7, 2017 at 1:35 pm
  
  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
  - Luke Ward says
    
    Mar 9, 2017 at 10:24 am
    
    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
    - App Shah says
      
      Mar 17, 2017 at 6:24 pm
      
      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