Skip to content

Give shared links an og:image #5

Description

@t3chn

What is missing

The page now carries a title, a description, and Open Graph tags, so a shared link renders a card instead of a bare URL. It has no og:image, so that card has no picture.

Why it was left out rather than filled in

The only images in this repository are public/favicon.svg and src/assets/hero.png, which is 343×361. Open Graph wants roughly 1200×630, and a small asset stretched to that size looks worse than no image at all — a card with a title and a description reads fine without one.

So this needs a real image made for the purpose, which is design work rather than a markup change. That is the whole reason it is an issue and not a line in the head.

What done looks like

  • A 1200×630 asset in public/, in the site's own visual language — the Dracula/Alucard theme in src/theme/, the typefaces already loaded.
  • og:image, og:image:width, og:image:height, and og:image:alt in index.html, next to the tags already there.
  • twitter:card raised from summary to summary_large_image.
  • The CI step that asserts the served head carries the card tags extended to cover og:image, so it cannot be dropped silently later. That step is in .github/workflows/ci.yml, in the job that serves the built image and checks routes.
  • Checked against a real renderer, not by eye: the card as Telegram, Slack, and X actually draw it.

Priority

Low. Adoption is currently two stars and single-digit downloads, so a shared link is not where this project is losing people. Worth doing when there is something to share it to.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions