Recipes

Critical Tags

Add tags that are critical to your page load.

There are a few tags that are critical to your page load.

SSR

Using a useServerHead like this at a root level will ensure your site works as expected. You must be SSR your head tags for this to work, as if the tags are generated in JS after the load, your page may break.

useServerHead({
  htmlAttrs: {
    lang: 'en' // Change to your language
  },
  meta: [
    { charset: 'utf-8' },
    { name: 'viewport', content: 'width=device-width, initial-scale=1' }
  ]
})

SPA

If you are using an SPA and you aren't generating head tags using Unhead, you should instead ensure your app template looks like this.

<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
  </head>
  <body>
    <!-- Your app -->
  </body>
</html>