Metatags To Help With Social Sharing and Search Engines

One good way to look up SEO and search tags, is to go to the HTML of a page you're fond of (or a nice preview you have seen on Twitter), and take a look at the metatags.

My Current Tags

They are not perfect, and I will probably revisit this article to update them. But here's some of the usual content of my <head> tag:

        <title>"TITLE_HERE"</title>
        <link rel="icon" href="FAVICON_URL_HERE" />

        <meta name="language" content="en" />

        <meta name="description" content="DESCRIPTION_HERE" />
        <meta property="og:title" content="TITLE_HERE" />
        <meta property="og:description" content="DESCRIPTION_HERE" />
        <meta property="og:url" content="URL_HERE" />
        <meta property="og:site_name" content="SITE_NAME_HERE"/>
        <meta property="og:type" content="article" />

        <meta name="description" content="DESCRIPTION_HERE" />

        <meta name="url" content="URL_HERE" />
        <link rel="canonical" href="URL_HERE" />

        <link rel="image_src" href=IMAGE_URL_HERE />
        <meta name="twitter:card" content="summary_large_image" />
        <meta name="twitter:image" content="IMAGE_URL_HERE" />
        <meta property="og:image" content="IMAGE_URL_HERE" />
        
        <meta name="twitter:site" content="TODO" />
        <meta name="twitter:creator" content="@vsupalov" />
        <meta name="twitter:title" content="CONTENT_HERE"} />
        <meta name="twitter:url" content="URL_HERE" />
        <meta name="twitter:description" content="DESCRIPTION_HERE" />    

Useful Tooling

I had a good experience with socialsharepreview.com - you enter your site of choice, and can check out a preview (which is not tainted by something like social media site caches) and get suggestions about what can be improved. Basic stuff, as well as non-obvious details.

If you haven't used such a tool to double-check how your site's metadata holds up, give it a try!