Custom meta-images for social sharing of chapters

[rviscomi]

trafficstars

Sharing a chapter on social media will create a rich media card based on the hero image for the chapter. Here's how it'd look on Twitter:

I wonder if we could increase engagement by manually creating images specifically for social media that include more details about the chapter. I'm not a great designer so I use Google Slides to organize my mockups but here's a deck that so far has a custom meta-image for the CSS chapter:

Is this something worth exploring for all 25 chapters? If so does anyone have ideas to make these cards look nicer?

[tunetheweb]

I worry about the effort we’d burden ourselves with for the translations (not to mention the original English too!) as we have translated chapter names and logos for some of the languages.

[rviscomi]

That's a good point. Here's another concept that takes out the chapter info and focuses more on the author

(the "by" HTTP Archive bit is still in English but I think not worth translating)

[tunetheweb]

Seems a little pointless without the chapter name.

Also could be a bit of a squeeze for those chapters with multiple authors.

I think if we wanted to go this route then we need to auto-generate them on the fly to reduce effort but still allow internationalisation. Just need to try our best to avoid overflow issues with text.

[rviscomi]

The chapter name will still be visible and localized in the heading of the social card. Including author info in the card has a few points:

• gives credit to the authors upfront
• disambiguates it from previous years' editions of the same chapter
• thumbnails with faces supposedly get more clicks
• readers may be more inclined to read if they recognize the author

[shantsis]

Is it a burden to display the chapter title/other text content based on the language viewed on the page? E.g. English = English chapter title, French = French chapter title?

I think a great one for inspiration is Github's

Maybe we can leverage that focus on the chapter name, and include little stats like # of authors / reviewers / editors, # comments, other reaction stats.

[tunetheweb]

Is it a burden to display the chapter title/other text content based on the language viewed on the page? E.g. English = English chapter title, French = French chapter title?

The main burden is in moving this to a dynamic, server-generated, image rather than a static image as it is now. The social media widgets do require an image here rather than HTML/CSS/Images. But to be honest I think we need to do that anyway if we want to do this, as don't think it's feasible and scalable to create images each year (and definitely not with different languages).