Accessibility Errors in Google Lighthouse

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

<html> element does not have a [lang] attribute

Understanding the language of the website

79% of my survey of 100 Webflow Websites had this error.

If you are a Canadian screen reader user, this issue might cause you problems. If you have the screen reader set to French, and you visit a site written in English, you will hear the text read in a French accent. It’s important to set the two-letter code for the main language of the website. It’s not just Canadians who have this problem. Many Americans will access the web in English or Spanish. There are many countries which have more than one official language.

1. Go to Webflow Designer

2. Click on Navigator menu button

Click on Navigator menu button

3. Click on Project Settings

Click on Project Settings

4. Scroll down General Settings to Language Code

5. Add a language code.

EN for English, FR for French, ES for Spanish

Add a language code.

6. Click on Save Changes

Click on Save Changes

7. Click on List of language codes

to see other correct language codes

Click on List of language codes

8. Go to List of ISO 639-1 codes - Wikipedia

Google Lighthouse says

To ensure correct pronunciation, screen readers use a different sound library for each language they support. Screen readers can switch between these language libraries easily, but only if a web page specifies which language to read for a given piece of content.If a page doesn't specify a language for the element, a screen reader assumes the page is in the default language that the user chose when setting up the screen reader, often making it impossible to understand the content.