Smart peeps - so, I have a question for you. Here's a hypothetical situation:
Situation
You have done it, you have built a website. Cleverly, you have a partials folder with a header and footer and you just include that on every page. But, now every single page has the same meta tags. This makes the search engine algorithms push your site into the land of boring repeat content - not good.
Solutions? <- this is where I want to put your thoughts!!!
NOTE: I will update this Solutions section with great answers from you guys!
Jekyll
I have addressed this in jekyll for static sites by including liquid tags in the header that draws directly from the YAML during the build process. It is smooth and easy.
In the /includes folder, I have a file called 'head.html' that is constructed like so:
<head>
<!-- other head meta stuffs like width and utf-->
<title>{{ site.name }}{% if page.title and page.url != "/" %} | {{ page.title }}{% endif %}</title>
<meta name="description" content="{% if page.description %} | {{ page.description }}{% else %}{{ site.description }}{% endif %}">
<!-- other head stuffs like twitter and css -->
</head>
This 'head.html' is included as part of most page layouts in the /layouts folder, like so (this is 'default.html':
<!DOCTYPE html>
<html>
{% include head.html %}
<body>
{% include header.html %}
<div class="page-content">
<div class="wrapper">
{{ content }}
</div>
</div>
{% include footer.html %}
</body>
</html>
And then, in the pages, I can use YAML, like so:
---
layout: default
title: space invaders in the wild
permalink: /spaceinvaders/
description: a gallery of space invaders that I have seen
img: somedir/genericspaceinvader.png
---
## My super duper header
My super duper content
Now, this page will show up (to search engines...and eventually other humans) with the meta like:
<title>ME: space invaders in the wild</title>
<meta name="description" content="a gallery of space invaders that I have seen">
Perhaps not the best for SEO, but not the same as all 20,000 other pages showing up as : 'Me' with a description of 'my description' or whatever.
Top comments (2)
Would this be Node-based? If the entire HTML is constructed by the JS on the client it won't be possible to create proper meta tags as far as I know. If they are to be built on the server there are a few options.
I'm actually curious how people approach this for different site designs. I have the jekyll example...maybe I'll add code.