When a hyperlink is shared on social media, users are usually directed to the destination site without any context or description. This can be confusing for users, which is why social media sites create link previews that show more understandable information such as the title, author, and thumbnail. This is known as “unfurling”. Developers can influence how link previews are displayed on social media by specifying metadata. Metadata can also be read by Google bots for search engine optimization.
This article explores the metadata that development teams can specify to create the best possible link preview for social media. It also describes how developers can read data from websites to create link previews for external links on their own website.
In addition to generic attributes like title and thumbnail, there is other information that can be included such as author, publication date, and category. There are two methods for collecting data for link previews: APIs and web scraping. APIs have a uniform syntax and interface documentation, while web scraping requires libraries to convert markup into a DOM.
Meta information is stored in HTML, mainly in meta elements within the head of an HTML document. The name attribute specifies values such as application-name, description, author, theme-color, and color-scheme. The title element also falls under metadata and plays an important role in queries.
Overall, developers can use metadata to create a more informative and visually appealing link preview on social media. By understanding how to collect and use this metadata, developers can provide a better user experience for their audience.
