Optimizing meta tags is the best way to provide information about a site to search engines such as google, bing and so on. Not only that, meta tags are one of the most important components that must be applied in a site or blog as the most basic onpage SEO optimization step.
If simplified, meta tags are a set of HTML code installed on a site or blog written on the <head> that serves to help search engines or social media to find out a summary of the entire content of a site.
How Important Are Meta Tags?
In order to have a place in search results, a site or blog must include meta tags in its blog's code structure, unless the blog is set up for a specific person or readership. It can be said that the data that will appear in the search results is mostly sourced from meta tags.
A good meta tag neatly arranged and complete will make your site indexed faster by search engines and is likely to get a high position in search results.
What Should Be In A Meta Tag?
The most standard meta tags are meta tags that provide some important information such as Site Title, Description, Keyword, and Thumbnail Image.
If the four data above are already in your meta tag before then it is enough to compete in the search results. But not only your site applies the above method, there are thousands of other sites with similar niches that apply the same thing even with better quality content than your site. Are you able to compete with them?
Your only chance is to maximize your meta tags by adding some other code no less important to improve the quality of your site. So what are the things you need to add to your site? Check out the explanation below :
Meta Open Graph
The source of traffic/visitors to a site is not only from search engines, most of it is also sourced from social media. For that it is also important to provide a summary of your site's information to social media such as facebook, twitter and so on. The trick is to add an open graph meta tag to your site.
Site Authority
Contains ownership information of a site, such as the name of the site creator link to the site owner's information, webmaster verification code and so on.
Meta Tags Robot
This meta tag serves to provide more complex information on search engine robots, the important things that are usually added in this meta tag are the language information of your site, the location of your site and several other things.
If you have applied all the information above to your meta tag, you can be sure that your site will occupy a high position in the search results. At least your site indexes faster than usual.
What Does Good Meta Tag Writing Look Like?
Not only does it provide complete information, a good meta tag is one that is neatly arranged and easy to understand by the site owner himself, by tidying up the arrangement of your site's meta tags, you will have no problem editing or changing them when needed in the future.
Below we will share the latest and best meta tags in our opinion that this site already uses, these meta tags are arranged more neatly to make them easier to modify and we will provide a guide for you to edit some parts of this meta tag.
Based on the experience of using this meta tag, the position of this site www.subarna.in not affected even after several times changing templates thanks to the meta tags below. We are not saying this meta tag is the most perfect, but at least it's worth checking out because if we just succeeded then you would have succeeded too.
Paste the meta tag code below on the <head> ... </head> on your site or blog, or replace the meta tag you previously used with the following meta tags :
<b:if cond='data:view.isMultipleItems'> <b:if cond='data:view.isHomepage'> <!--[ Homepage title ]--> <title><data:blog.title.escaped/></title> <b:elseif cond='data:view.search.query'/> <!--[ Search title ]--> <title><data:messages.search/> : <data:view.search.query/></title> <b:elseif cond='data:view.search.label'/> <!--[ Label title ]--> <title><data:blog.pageName.escaped/> - <data:blog.title.escaped/></title> <b:elseif cond='data:view.isArchive'/> <!--[ Archive title ]--> <title>Blog archive in : <data:blog.pageName.escaped/></title> <b:else/> <title>Blog : <data:blog.title.escaped/></title> </b:if> <b:elseif cond='data:view.isError'/> <!--[ Error title ]--> <title>Error 404: Not found</title> <b:else/> <!--[ SingleItem title ]--> <title><data:blog.pageName.escaped/> - <data:blog.title.escaped/></title> </b:if> <!--[ meta for browser ]--> <meta charset='UTF-8'/> <meta content='width=device-width, initial-scale=1, user-scalable=1, minimum-scale=1, maximum-scale=5' name='viewport'/> <meta content='IE=edge' http-equiv='X-UA-Compatible'/> <b:if cond='!data:view.isError'> <!--[ Browser data, description and keyword ]--> <link expr:href='data:blog.url.canonical' rel='canonical'/> <b:if cond='data:blog.metaDescription'> <meta expr:content='data:blog.metaDescription.escaped' name='description'/> <b:elseif cond='data:view.isSingleItem'/> <meta expr:content='data:post.snippet.escaped snippet { length: 147, links: false, linebreaks: false, ellipsis: false }' name='description'/> <b:else/> <meta expr:content='data:blog.pageName.escaped ? data:blog.pageName.escaped : data:blog.title' name='description'/> </b:if> <meta expr:content='data:blog.title.escaped + ", " + data:blog.pageName.escaped + ", Add_your_addtional_keyword_here "' name='keywords'/> <b:tag cond='data:view.isPost' expr:href='resizeImage(data:blog.postImageUrl, 0)' name='link' rel='image_src'/> <!--[ Generator and RRS ]--> <meta content='blogger' name='generator'/> <link expr:href='data:blog.homepageUrl.canonical path "feeds/posts/default"' expr:title='data:blog.title + " » Atom"' rel='alternate' type='application/atom+xml'/> <link expr:href='data:blog.homepageUrl.canonical path "feeds/posts/default?alt=rss"' expr:title='data:blog.title + " » Feed"' rel='alternate' type='application/rss+xml'/> <link expr:href='data:blog.homepageUrl.canonical path "feeds/comments/default?alt=rss"' expr:title='data:blog.title + " » Comments Feed"' rel='alternate' type='application/rss+xml'/> <!--[ Theme color ]--> <meta content='#ffffff' name='theme-color'/> <meta content='#ffffff' name='msapplication-navbutton-color'/> <meta content='#ffffff' name='apple-mobile-web-app-status-bar-style'/> <meta content='yes' name='apple-mobile-web-app-capable'/> <!--[ Favicon ]--> <link expr:href='data:blog.blogspotFaviconUrl' rel='apple-touch-icon' sizes='120x120'/> <link expr:href='data:blog.blogspotFaviconUrl' rel='apple-touch-icon' sizes='152x152'/> <link expr:href='data:blog.blogspotFaviconUrl' rel='icon' type='image/x-icon'/> <link expr:href='data:blog.blogspotFaviconUrl' rel='shortcut icon' type='image/x-icon'/> <!--[ Open graph ]--> <meta expr:content='data:blog.pageName.escaped ? data:blog.pageName.escaped : data:blog.title.escaped' property='og:title'/> <meta expr:content='data:blog.canonicalUrl' property='og:url'/> <meta expr:content='data:blog.title.escaped' property='og:site_name'/> <b:if cond='data:view.isMultipleItems'> <meta content='website' property='og:type'/> <b:if cond='data:blog.metaDescription'> <meta expr:content='data:blog.metaDescription.escaped' property='og:description'/> <b:else/> <meta expr:content='data:blog.pageName.escaped ? data:blog.pageName.escaped : data:blog.title' property='og:description'/> </b:if> <b:else/> <meta content='article' property='og:type'/> <b:if cond='data:blog.metaDescription'> <meta expr:content='data:blog.metaDescription.escaped' property='og:description'/> <b:else/> <meta expr:content='data:post.snippet.escaped snippet { length: 147, links: false, linebreaks: false, ellipsis: false }' property='og:description'/> </b:if> </b:if> <meta expr:content='data:blog.pageName.escaped ? data:blog.pageName.escaped : data:blog.title.escaped' property='og:image:alt'/> <b:if cond='data:blog.postImageUrl'> <meta expr:content='resizeImage(data:blog.postImageUrl, 0)' property='og:image'/> <b:else/> <meta content='Add_your_image_url_here' property='og:image'/> </b:if> <!--[ Twitter card ]--> <meta expr:content='data:blog.pageName.escaped ? data:blog.pageName.escaped : data:blog.title.escaped' name='twitter:title'/> <meta expr:content='data:blog.canonicalUrl' name='twitter:url'/> <b:if cond='data:view.isMultipleItems'> <b:if cond='data:blog.metaDescription'> <meta expr:content='data:blog.metaDescription.escaped' name='twitter:description'/> <b:else/> <meta expr:content='data:blog.pageName.escaped ? data:blog.pageName.escaped : data:blog.title' name='twitter:description'/> </b:if> <b:else/> <b:if cond='data:blog.metaDescription'> <meta expr:content='data:blog.metaDescription.escaped' name='twitter:description'/> <b:else/> <meta expr:content='data:post.snippet.escaped snippet { length: 147, links: false, linebreaks: false, ellipsis: false }' name='twitter:description'/> </b:if> </b:if> <meta content='summary_large_image' name='twitter:card'/> <meta expr:content='data:blog.pageName.escaped ? data:blog.pageName.escaped : data:blog.title.escaped' name='twitter:image:alt'/> <b:if cond='data:blog.postImageUrl'> <meta expr:content='resizeImage(data:blog.postImageUrl, 0)' name='twitter:image:src'/> <b:else/> <meta content='Add_your_image_url_here' name='twitter:image:src'/> </b:if> <!--[ Sife verification ]--> <meta content='xxxxxxxxxxxxxxxxx_g' name='google-site-verification'/> <meta content='xxxxxxxxxxxxxxxxx' name='msvalidate.01'/> <meta content='xxxxxxxxxxxxxxxxx' name='p:domain_verify'/> <meta content='xxxx_xxxxx-xxxxxxx' name='majestic-site-verification'/> <meta expr:content='data:blog.title.escaped' name='copyright'/> </b:if>
Description and Instruction for Use
Before copying and pasting the meta tags above on your site, CHANGE IT! Some section tagged with information from your site or on the meta tags you used before.
Blog Title
The first group of tags serves to display the title of a particular site or page on the blog in search results. For example, a new article has been published, the title of the article will be automatically written in this code, the results on search engines can be seen in the title of the article page.
Error 404 Page Title
By default the result displayed is Error 404: Page Not Found, you can replace it with another title as you wish. For example, Sorry! Page Not Found or so on.
<!--[ Error title ]--> <title>Error 404: Not found</title>
Title on The Home Page
Displays the title of your site's Homepage, you can add another sentence to the search results. For example, Blog Name : Latest Mobile Information Center or the like by changing this line of code to become :
<!--[ Homepage title ]--> <title><data:blog.title.escaped/> : Latest Mobile Information Center</title>
Title on The Post Page and Static Page
Displays the title of the post page and static page, the default that will be displayed is only the title of your blog post, but there are several blogs that also add their blog title to this section as a reinforcement for their blog keywords. For example, as below :
We've changed the title of the blog to the one above in the latest meta tag update. Now the code for the title of the post is like this :
<!--[ SingleItem title ]--> <title><data:blog.pageName.escaped/> - <data:blog.title.escaped/></title>
You can change the dashes above with other signs that you think are suitable.
Title on The Index Page
Displays the title on the blogger index page (other than the homep[age, posts and static pages) which on blogger is marked with Search in the url, there are 4 conditions written to display a different title on your blog's index page including :
Title on The Search Query Page
<!--[ Search title ]--> <title><data:messages.search/> : <data:view.search.query/></title>
Title on The Label Page
Displays the title of the label page on your blog, if the user clicks on the label link on your blog then this section will be displayed as the title.
<!--[ Label title ]--> <title><data:blog.pageName.escaped/> - <data:blog.title.escaped/></title>
Title on The Blog Archive Page
Blog Archive in : January 2023, This section is optional, which means you can apply it or not. But if you active the archive feature or add the Archive Widget to your blog, then this title will appear when a user clicks on your blog archive page.
<!--[ Archive title ]--> <title>Blog archive in : <data:blog.pageName.escaped/></title>
Title on The Home Alternate Page
If all of the above conditions are not met then this title will be displayed, usually this title will appear when the user clicks on the Older Post navigation button, Newer Post or numbering navigation on your blog.
<title>Blog : <data:blog.title.escaped/></title>
Most bloggers choose to block this page from appearing in search results, but this setting is still worth trying to further enhance the appearance of your blog's page title.
Thumbnail Image
This meta tag serves to display a thumbnail/snippet of your blog image, on the post page the image snippet shown in this section is the first image of your article.
If the article you write does not have an image, then what willl be displayed is the image link you inserted in this tag. Change the part marked on this line with your blog logo link. (prepare your blog logo image with a minimum size of 300px.)
<meta content='Add_your_image_url_here' property='og:image'/> <!-- change it with your blog link, for example the result is as below --> <meta content='image_link' property='og:image'/>
Blog Description
One way to optimize Onpage SEO is to add a blog description on each page, this description will be displayed in the search results at the bottom of the blog title.
One of the advantages of the meta tag that is shared this time is that an alternative description is provided when you do not write a description on the blog. When there is no description on a post, automatically the first paragraph of the post will be displayed.
Favicon
Serves to display icons on IOS and Android platforms, this section is automatically filled with the favicon that you uploaded on the Blogger settings. But you can also change it with a more HD image. The method is shown below :
<!--[ Favicon ]--> <link expr:href='data:blog.blogspotFaviconUrl' rel='apple-touch-icon' sizes='120x120'/> <link expr:href='data:blog.blogspotFaviconUrl' rel='apple-touch-icon' sizes='152x152'/> <link expr:href='data:blog.blogspotFaviconUrl' rel='icon' type='image/x-icon'/> <link expr:href='data:blog.blogspotFaviconUrl' rel='shortcut icon' type='image/x-icon'/> <--[ Implementation Example ]--> <!--[ Favicon ]--> <link href='120px_image_url' rel='apple-touch-icon' sizes='120x120'/> <link href='152px_image_url' rel='apple-touch-icon' sizes='152x152'/> <link href='16px_image_url' rel='icon' type='image/x-icon'/> <link href='16px_image_url' rel='shortcut icon' type='image/x-icon'/>
Theme Color
Change the color code marked on this line of code with the dominant color of your blog, this section serves to change the color of the address bar on the Google Chrome browser on Android or the Safari browser on IOS.
Site Verification
This last section serves to verify the ownership of a site or blog on some specific site. In this code there are 4 verification codes including verification for Google Webmaster/Search Console, Bing Webmaster, Pinterest and Majestic SEO Tools Verification.
While this does not provide a tutorial on how to get the verification code above, please search for yourself on google how to get it.
Please leave your comments after using this meta tag and please ask
questions if there are any problems in implementing the meta tag above.
0 Comments