What Does "Hreflang and HTML lang mismatch" Mean?
URLs have different values for the self-refencing hreflang and HTML lang tags.
The HTML language declares the default language for all content on the page. To be implemented correctly, the lang attribute should be applied to the opening <html> tag at the top of every page (just under the doctype).
It will typically look like this:
The value should be the appropriate language tag that represents the content on this page. For the vast majority of pages on the web, this is simply the ISO-639 two-letter language code, or ISO-639 two-letter code with ISO-3166 two-letter country code.
Similar, but different is the hreflang tag. Hreflang is a way to tell search engines that there are multiple versions of a page in different languages. This will help search engines serve visitors the most appropriate version of each URL by language or region.
Here's an example of hreflang tags for https://example.com/en-us/products, which is an English page targeting visitors in the United States that also has an English version targeting United Kingdom, a French version, a German version, and a default version available:
<link rel="alternate" hreflang="en-us" href="https://example.com/en-us/products" />
<link rel="alternate" hreflang="en-gb" href="https://example.com/en-gb/products" />
<link rel="alternate" hreflang="fr" href="https://example.com/fr/products" />
<link rel="alternate" hreflang="de" href="https://example.com/de/products" />
<link rel="alternate" hreflang="x-default" href="https://example.com/products" />
There are two parts to an hreflang value: language in ISO 639-1 format (required) and region in ISO 3166-1 Alpha 2 format (optional), separated by a hyphen. When no language or region matches the user's browser setting, "x-default" is a valid hreflang value as well (even though it does not fit the language-region format).
There should always be an hreflang link back to the page itself, which is called the self-referencing hreflang tag.
Since the format of each is essentially the same, in most cases the self-referencing hreflang tag and HTML lang tag should match. The tags in the URLs in the table below do not match.
Why It's Important
If these two tags do not match, it's usually a symptom that one or both tags have incorrect values. Having incorrect language values in either tag can lead to the wrong content being served to the wrong audience, lower rankings, problems with indexation, or user experience issues.
How To Fix
Take a look at each URL in the table below and compare the self-referencing hreflang tag and the HTML lang tag. If they both seem okay, but just slightly different (e.g. if one is "en-us" and the other is "en" that may be okay), then there may not be anything to fix. But if one of them seems incorrect, you'll want to update the one that doesn't seem right.