SEO template changes for Hugo Static Web Site Generator

I was working on my main consultancy site and amending it for SEO and this required making some changes to HUGO templates.

Gone are my keywords

My keyword code has now been removed:

{{if isset .Params "keywords"}}
<meta name="keywords" 
content="{{ delimit .Keywords ", " }},
digital marketing, content marketing, online tactics, seo tips" />
{{else}}
    {{if isset .Params "tags"}}
        <meta name="keywords" content="{{ delimit .Params.Tags ", " }}, 
        digital marketing, content marketing, online tactics, seo tips" />
    {{else}}
         <meta name="keywords" content="digital marketing, 
         content marketing, online tactics, seo tips" />
     {{end}}
{{end}}

SEO Basics

My initial SEO focus was on getting the ‘basics’ right.

title
description
h1

The keywords meta tag no longer really counts.

Title

My Basic Title Code in my ‘head’ template was initially:

<title>{{ .Title | default .Site.Title }}</title>

This allows me to set a title variable in each page meta data, and if not present defaults to the title variable in the main site config.toml

The title of most pages and posts is often used as the h1 by default for most web systems and templates.

Google recommends that the title of a page is also branded i.e. has your site name in it somewhere.

But if we are using the title as an h1 then that works for Google, but not the user.

I amended it to be:

<title>{{ .Title | default .Site.Title }}
{{ if not .IsHome }} - {{ .Site.Params.Shorttitle }}{{ end }}
</title>

The above means:

use the page title
if no page title is set then use the Site .title variable set in config.toml
if this page is not the home page then also append the param called shorttitle in the config.toml

This provides me with a default if I forget to create a title for the page, and brands the title without having to have the branding in my h1

Description

My Basic description code in my ‘head’ template was:

<meta name="description" 
content="{{.Description | default .Site.Params.Description}}"/>

If no description is provided in the page meta data then the description set in the config.toml file is used.

I moved it over to:

<meta name="description" content="{{ with .Description }}
{{ . }}
{{ else }}
{{if .IsPage}}{{ .Summary }}
{{ else }}{{ with .Site.Params.description }}
{{ . }}
{{ end }}{{ end }}{{ end }}">

This:

uses the local page description
if there is not one then use the summary for the page (auto generated from the text)
otherwise use the site global description

The above code creates a unique description which may not be SEO optimised but is better than a standard default throughout the entire site.

H1

I then wanted to have the option of creating a separate H1 from the title meta tag.

It is arguable if this helps SEO or not, but the title tag is the ‘sales copy` heading that we want people to click through on the search engine.

The h1 tag is the ‘title’ of the article people see when they visit the page.

I view this more as book title and chapter title. They might well be the same, but I want the option of making them different.

I have seen people argue over this online - should they be different, should they not? But the SEO guidance on Google leads me to believe that they can be different and it will not impact the rankings.

Clearly the title can’t be click bait and must accurately reflect the content, but I don’t think they need to be the same.

If I discover that they do need to be the same, then a quick template change will bring this back in line.

<h1 id="title" class="text-center">
{{if isset .Params "h1"}}{{ .Params.H1 }}{{else}}{{ .Title }}{{end}}
</h1>

if there is an h1 param in page meta data then use that
if not then use the title param from the meta data

Robots meta tag

I also wanted to exclude taxonomy index pages from the site indexing, so I added a robots meta tag

{{ if and (eq .Kind "taxonomy") (eq .Type "categories")}}
<meta name="robots" content="noindex, follow"/>
{{ else }}
<meta name="robots" content="index, follow"/>
{{ end }}

This says that if the page is a Taxonomy Index page then tell the robot not to index it, but do follow the links there to make sure that the pages are indexed.

And if it is not an index page then so “index, follow” (index the page, and follow the links)

Canonical

I also wanted to take control of the canonical tags, but only for pages that are actually content - not indexes:

{{ if or (eq .Kind "home") (eq .Kind "page")}}
{{ if isset .Params "canonical" }}
<link rel="canonical" href="{{ .Params.Canonical}}" />
{{ else }}
<link rel="canonical" href="{{ .Permalink}}" />
{{ end }}
{{ end }}

This basically says:

if this is not an index page then
- if there is a canonical meta data defined then use that
- otherwise use the permalink for the page

The page by default is the canonical version of the content, but I have the ability to redirect the search engine to another place on the internet if this is duplicate content, e.g. an archive of some other post.

Hugo