search

google / eleventy-high-performance-blog

A high performance blog template for the 11ty static site generator.
https://www.industrialempathy.com/posts/eleventy-high-performance-blog/
MIT License
4.03k stars 283 forks source link

Missing meta tags for images in social media cards #14

Closed indcoder closed 4 years ago

indcoder commented 4 years ago

Social media cards for the blogs posts are a vital visual cue that invites reader to peruse the blog post. Also an image on the social media card makes it appear more "professional"

cramforce commented 4 years ago

I don't think these are missing, but please reopen with a specific example. See https://github.com/google/eleventy-high-performance-blog/blob/main/_includes/layouts/base.njk#L29

indcoder commented 4 years ago
  1. For accessibility:

<meta name="twitter:image:alt" content="Alt text for image">

  1. For those users who will create repos and may not have an image in the frontmatter of an individual blog post, I propose there should be a default image placeholder and the best current practice(BCP) is to have the Blog logo as that default.

Below is what I had customized in our repo, with logo location set as metadata. https://github.com/HackerspaceMumbai/goog11ty/blob/96480d3246d91d6d823c25e50edf86256725e44a/_includes/layouts/base.njk#L33

  1. Also for completeness of the social media card, I also propose adding OG:URL meta tag which is linked to the blog post canonical/permalink. eg: for the fourth post <meta property="og:url" content="https://eleventy-high-performance-blog-sample.industrialempathy.com/posts/fourthpost/"> And the blog name: <meta property="og:site_name" content="Industrial Empathy, Inc.">
cramforce commented 4 years ago

OG:URL is redundant.

indcoder commented 4 years ago

image

For most blogs, they have to keep two Gods happy, the PageRank[Search Results] and EdgeRank[SocialFeed].

If the template is looking to support folks to move their blogs to it, then og:url is an important parameter to ensure their blog posts don't suffer in their ranking.

Please open this issue; a PR is incoming 😁

cramforce commented 4 years ago

In practice they read the canonical URL instead. It would only make sense to specify og:url if the values would be different.