You can easily view meta tags on Metatags.io

What are Meta Tags?

Meta tags are tags that contain information about a web page. More specifically, developers can write information such as the title of the page, thumbnail, etc. in the header, which search engines and external services can refer to. For example, when sharing an image on Slack, the site's name, title, content, thumbnail, etc. are all retrieved from the content stored in the meta tags.

The content of meta tags is included in the header of a web page. For example, og:title, og:description, og:image, etc. constitute the content in the Slack message above. I also didn't pay attention to this part, so when I shared a blog post, the image that appeared was labeled as TailwindBlog.

Common Difficulties When Viewing Meta Tags

A simple way to check if meta tags are well-structured is to send them to Telegram, Slack, KakaoTalk, etc. However, this method has a drawback. Many services cache these meta tags for a considerable period of time for efficiency. If you try to check if they are applied correctly while making modifications during development, the old values will continue to appear for a while. I also struggled with this issue and discovered a site called metatags.io through a recommendation from a colleague at work. I found it useful and recommend it.

Introduction to the Site metatags.io

The usage of the site is simple. When you access it, there is a search bar where you can enter the URL of the site you want to check the meta tags for, and simply press a button. After a while, you can see how the meta tags appear on popular services. You can easily see how they are displayed on Google, Twitter, Facebook, LinkedIn, Pinterest, and Slack.

Conclusion

If you already know about this, it may not be anything special, but it is a very useful feature for those who are unfamiliar with it. Above all, it can be easily used by non-developers, so I hope many people will find it helpful.