Why Link Preview Images Need Alt Text: og:image:alt and twitter:image:alt in Next.js
Many teams design share images carrying important text, yet leave them without any text equivalent, so screen reader users hear only "image" or nothing at all. Two meta tags, og:image:alt and twitter:image:alt, let sites describe these images, and most sites do not set either one. The article explains where these tags are used, notes that platform support varies and changes over time, and stresses that the tags are part of the spec and cost little to add. It offers guidance on writing good alt text for cards, such as stating any text on the image and keeping it to one sentence under about 120 characters. It also shows how to emit the tags from the Next.js App Router using the Metadata API.
This is an AI-generated summary. ShortSingh links to the original source for the complete article.
Discussion (0)
Log in to join the discussion and vote.
Log in