diff --git a/__tests__/cookie-functions.test.mjs b/__tests__/cookie-functions.test.mjs
index 88dcecbbdd..01f2a46658 100644
--- a/__tests__/cookie-functions.test.mjs
+++ b/__tests__/cookie-functions.test.mjs
@@ -17,8 +17,8 @@ describe('Cookie settings', () => {
     const cookies = document.cookie.split(';')
     cookies.forEach(function (cookie) {
       const name = cookie.split('=')[0]
-      document.cookie = name + '=;expires=Thu, 01 Jan 1970 00:00:00 GMT;path=/'
-      document.cookie = name + '=;expires=Thu, 01 Jan 1970 00:00:00 GMT;domain=' + window.location.hostname + ';path=/'
+      document.cookie = `${name}=;expires=Thu, 01 Jan 1970 00:00:00 GMT;path=/`
+      document.cookie = `${name}=;expires=Thu, 01 Jan 1970 00:00:00 GMT;domain=${window.location.hostname};path=/`
     })
   })
 
diff --git a/lib/file-helper.js b/lib/file-helper.js
index 1667da5520..186cff4888 100644
--- a/lib/file-helper.js
+++ b/lib/file-helper.js
@@ -57,7 +57,7 @@ exports.getFingerprint = function (file) {
 
   // Skip fingerprints in development for Browsersync inject (without reload)
   if (process.env.NODE_ENV === 'development') {
-    return '/' + slash(file)
+    return `/${slash(file)}`
   }
 
   // Grab fingerprint array from the template context
@@ -82,7 +82,7 @@ exports.getFingerprint = function (file) {
   }
 
   // Look for a fingerprinted asset at this path relative to the site root
-  return '/' + slash(fingerprints[file].path)
+  return `/${slash(fingerprints[file].path)}`
 }
 
 // This helper function takes a path of a *.md.njk file and
@@ -98,7 +98,7 @@ exports.getHTMLCode = path => {
     html = nunjucks.renderString(content).trim()
   } catch (err) {
     if (err) {
-      console.log('Could not get HTML code from ' + path)
+      console.log(`Could not get HTML code from ${path}`)
     }
   }
 
diff --git a/lib/get-macro-options/index.js b/lib/get-macro-options/index.js
index d875aea305..573c44db93 100644
--- a/lib/get-macro-options/index.js
+++ b/lib/get-macro-options/index.js
@@ -164,7 +164,7 @@ function getMacroOptions (componentName) {
   ].concat(
     nestedOptions.map(option => {
       return {
-        name: 'Options for ' + option.name,
+        name: `Options for ${option.name}`,
         id: option.name,
         options: option.params
       }
@@ -173,7 +173,7 @@ function getMacroOptions (componentName) {
     additionalComponents.map(name => {
       const additionalComponentOptions = getMacroOptionsJson(name).map(renderDescriptionsAsMarkdown)
       return {
-        name: 'Options for ' + name,
+        name: `Options for ${name}`,
         id: name,
         options: additionalComponentOptions
       }
diff --git a/lib/metalsmith-title-checker.js b/lib/metalsmith-title-checker.js
index 41893e804a..606fa080ea 100644
--- a/lib/metalsmith-title-checker.js
+++ b/lib/metalsmith-title-checker.js
@@ -76,9 +76,9 @@ module.exports = function titleChecker () {
 
     if (filesWithoutTitles.length) {
       throw Error(
-        'The following file(s) do not have titles:\n\n' +
-        filesWithoutTitles.map(file => `- ${file}`).join('\n') +
-        '\n'
+        `The following file(s) do not have titles:\n\n${
+        filesWithoutTitles.map(file => `- ${file}`).join('\n')
+        }\n`
       )
     }
     done()
diff --git a/src/javascripts/components/analytics.mjs b/src/javascripts/components/analytics.mjs
index ec2316b79b..a4bc9a184b 100644
--- a/src/javascripts/components/analytics.mjs
+++ b/src/javascripts/components/analytics.mjs
@@ -10,10 +10,10 @@ export default function loadAnalytics () {
       })
 
       const j = d.createElement(s)
-      const dl = l !== 'dataLayer' ? '&l=' + l : ''
+      const dl = l !== 'dataLayer' ? `&l=${l}` : ''
 
       j.async = true
-      j.src = 'https://www.googletagmanager.com/gtm.js?id=' + i + dl
+      j.src = `https://www.googletagmanager.com/gtm.js?id=${i}${dl}`
       document.head.appendChild(j)
     })(window, document, 'script', 'dataLayer', 'GTM-53XG2JT')
   }
diff --git a/src/javascripts/components/cookie-functions.mjs b/src/javascripts/components/cookie-functions.mjs
index 49fd5c86e8..1fc3978da3 100644
--- a/src/javascripts/components/cookie-functions.mjs
+++ b/src/javascripts/components/cookie-functions.mjs
@@ -23,7 +23,7 @@ const TRACKING_LIVE_ID = '116229859-1'
 
 /* Users can (dis)allow different groups of cookies. */
 const COOKIE_CATEGORIES = {
-  analytics: ['_ga', '_gid', '_gat_UA-' + TRACKING_PREVIEW_ID, '_gat_UA-' + TRACKING_LIVE_ID],
+  analytics: ['_ga', '_gid', `_gat_UA-${TRACKING_PREVIEW_ID}`, `_gat_UA-${TRACKING_LIVE_ID}`],
   /* Essential cookies
    *
    * Essential cookies cannot be deselected, but we want our cookie code to
@@ -157,13 +157,13 @@ export function resetCookies () {
     // Initialise analytics if allowed
     if (cookieType === 'analytics' && options[cookieType]) {
       // Enable GA if allowed
-      window['ga-disable-UA-' + TRACKING_PREVIEW_ID] = false
-      window['ga-disable-UA-' + TRACKING_LIVE_ID] = false
+      window[`ga-disable-UA-${TRACKING_PREVIEW_ID}`] = false
+      window[`ga-disable-UA-${TRACKING_LIVE_ID}`] = false
       Analytics()
     } else {
       // Disable GA if not allowed
-      window['ga-disable-UA-' + TRACKING_PREVIEW_ID] = true
-      window['ga-disable-UA-' + TRACKING_LIVE_ID] = true
+      window[`ga-disable-UA-${TRACKING_PREVIEW_ID}`] = true
+      window[`ga-disable-UA-${TRACKING_LIVE_ID}`] = true
     }
 
     if (!options[cookieType]) {
@@ -220,7 +220,7 @@ function userAllowsCookie (cookieName) {
 }
 
 function getCookie (name) {
-  const nameEQ = name + '='
+  const nameEQ = `${name}=`
   const cookies = document.cookie.split(';')
   for (let i = 0, len = cookies.length; i < len; i++) {
     let cookie = cookies[i]
@@ -239,14 +239,14 @@ function setCookie (name, value, options) {
     if (typeof options === 'undefined') {
       options = {}
     }
-    let cookieString = name + '=' + value + '; path=/'
+    let cookieString = `${name}=${value}; path=/`
     if (options.days) {
       const date = new Date()
       date.setTime(date.getTime() + (options.days * 24 * 60 * 60 * 1000))
-      cookieString = cookieString + '; expires=' + date.toGMTString()
+      cookieString = `${cookieString}; expires=${date.toGMTString()}`
     }
     if (document.location.protocol === 'https:') {
-      cookieString = cookieString + '; Secure'
+      cookieString = `${cookieString}; Secure`
     }
     document.cookie = cookieString
   }
@@ -258,8 +258,8 @@ function deleteCookie (name) {
     // If a cookie was set with a specified domain, it needs to be specified when deleted
     // If a cookie wasn't set with the domain attribute, it shouldn't be there when deleted
     // You can't tell if a cookie was set with a domain attribute or not, so try both options
-    document.cookie = name + '=;expires=Thu, 01 Jan 1970 00:00:00 GMT;path=/'
-    document.cookie = name + '=;expires=Thu, 01 Jan 1970 00:00:00 GMT;domain=' + window.location.hostname + ';path=/'
-    document.cookie = name + '=;expires=Thu, 01 Jan 1970 00:00:00 GMT;domain=.' + window.location.hostname + ';path=/'
+    document.cookie = `${name}=;expires=Thu, 01 Jan 1970 00:00:00 GMT;path=/`
+    document.cookie = `${name}=;expires=Thu, 01 Jan 1970 00:00:00 GMT;domain=${window.location.hostname};path=/`
+    document.cookie = `${name}=;expires=Thu, 01 Jan 1970 00:00:00 GMT;domain=.${window.location.hostname};path=/`
   }
 }
diff --git a/src/javascripts/components/cookies-page.mjs b/src/javascripts/components/cookies-page.mjs
index f64e156038..913fd0a3df 100644
--- a/src/javascripts/components/cookies-page.mjs
+++ b/src/javascripts/components/cookies-page.mjs
@@ -34,7 +34,7 @@ CookiesPage.prototype.savePreferences = function (event) {
 
   this.$cookieFormFieldsets.forEach(function ($cookieFormFieldset) {
     const cookieType = this.getCookieType($cookieFormFieldset)
-    const selectedItem = $cookieFormFieldset.querySelector('input[name=' + cookieType + ']:checked').value
+    const selectedItem = $cookieFormFieldset.querySelector(`input[name=${cookieType}]:checked`).value
 
     preferences[cookieType] = selectedItem === 'yes'
   }.bind(this))
@@ -53,7 +53,7 @@ CookiesPage.prototype.showUserPreference = function ($cookieFormFieldset, prefer
   }
 
   const radioValue = preference ? 'yes' : 'no'
-  const radio = $cookieFormFieldset.querySelector('input[name=' + cookieType + '][value=' + radioValue + ']')
+  const radio = $cookieFormFieldset.querySelector(`input[name=${cookieType}][value=${radioValue}]`)
   radio.checked = true
 }
 
diff --git a/src/javascripts/components/navigation.mjs b/src/javascripts/components/navigation.mjs
index b568f8da45..ecf126f61b 100644
--- a/src/javascripts/components/navigation.mjs
+++ b/src/javascripts/components/navigation.mjs
@@ -61,8 +61,8 @@ Navigation.prototype.setInitialAriaStates = function () {
     const $nextSubNav = $button.parentNode.querySelector(subNavJSClass)
 
     if ($nextSubNav) {
-      const subNavTogglerId = 'js-mobile-nav-subnav-toggler-' + index
-      const nextSubNavId = 'js-mobile-nav__subnav-' + index
+      const subNavTogglerId = `js-mobile-nav-subnav-toggler-${index}`
+      const nextSubNavId = `js-mobile-nav__subnav-${index}`
 
       $nextSubNav.setAttribute('id', nextSubNavId)
       $button.setAttribute('id', subNavTogglerId)
diff --git a/src/javascripts/components/options-table.mjs b/src/javascripts/components/options-table.mjs
index f4352b3eef..6f7758898e 100644
--- a/src/javascripts/components/options-table.mjs
+++ b/src/javascripts/components/options-table.mjs
@@ -16,9 +16,9 @@ const OptionsTable = {
       }
 
       if (exampleName) {
-        const tabLink = document.querySelector('a[href="#' + exampleName + '-nunjucks"]')
+        const tabLink = document.querySelector(`a[href="#${exampleName}-nunjucks"]`)
         const tabHeading = tabLink ? tabLink.parentNode : null
-        const optionsDetailsElement = document.getElementById('options-' + exampleName + '-details')
+        const optionsDetailsElement = document.getElementById(`options-${exampleName}-details`)
 
         if (tabHeading && optionsDetailsElement) {
           const tabsElement = optionsDetailsElement.parentNode
diff --git a/src/javascripts/components/search.mjs b/src/javascripts/components/search.mjs
index 68fc259622..21f5ac4c8b 100644
--- a/src/javascripts/components/search.mjs
+++ b/src/javascripts/components/search.mjs
@@ -89,7 +89,7 @@ Search.prototype.handleOnConfirm = function (result) {
     return
   }
   trackConfirm(searchQuery, searchResults, result)
-  window.location.href = '/' + permalink
+  window.location.href = `/${permalink}`
 }
 
 Search.prototype.inputValueTemplate = function (result) {
diff --git a/src/javascripts/components/search.tracking.mjs b/src/javascripts/components/search.tracking.mjs
index 214addbfe4..ebca23c391 100644
--- a/src/javascripts/components/search.tracking.mjs
+++ b/src/javascripts/components/search.tracking.mjs
@@ -40,7 +40,7 @@ export function trackConfirm (searchQuery, searchResults, result) {
     eventDetails: {
       category: 'site search',
       action: 'click',
-      label: searchTerm + ' | ' + result.title
+      label: `${searchTerm} | ${result.title}`
     },
     ecommerce: {
       click: {
diff --git a/src/javascripts/components/tabs.mjs b/src/javascripts/components/tabs.mjs
index 639a49dae3..f2cf4f3f72 100644
--- a/src/javascripts/components/tabs.mjs
+++ b/src/javascripts/components/tabs.mjs
@@ -51,7 +51,7 @@ AppTabs.prototype.onClick = function (event) {
   const isTabAlreadyOpen = $currentTab.getAttribute('aria-expanded') === 'true'
 
   if (!$panel) {
-    throw new Error('Invalid example ID given: ' + panelId)
+    throw new Error(`Invalid example ID given: ${panelId}`)
   }
 
   // If the panel that's been called is already open, close it.
@@ -154,7 +154,7 @@ AppTabs.prototype.getMobileTab = function (panelId) {
 AppTabs.prototype.getDesktopTab = function (panelId) {
   const $desktopTabContainer = this.$module.querySelector('.app-tabs')
   if ($desktopTabContainer) {
-    return $desktopTabContainer.querySelector('[aria-controls="' + panelId + '"]')
+    return $desktopTabContainer.querySelector(`[aria-controls="${panelId}"]`)
   }
   return null
 }