HTML language declaration in Hugo sites - a short guide
Defining the language of the html document is useful for i18n (obviously) - but also this will help with a11y for your site. Here is an example of a google lighthouse report for a site that does not have a html language declaration.
An example lighthouse report
Read about Google Lighthouse reports.
A HTML Language declaration looks like this:
<html lang="en">You simple add a lang attrbiute to the opening <html> tag in your templates.
Read about html language declarations.
You can keep it simple and add a static value to your tag: i.e. en or en-US. But whats the point in having front-matter and config files if you aren’t going to use them.
Hugo let’s us define a default language code for the site in the site config file.
languageCode = 'en'
Once they’re set; Hugo give us a few Site Param variables to access the current languages and language codes for the site. So here’s a simple example to reference the language code we defined above.
<html lang="{{ $.Site.Language.Lang | default "en-US" }}">