Friday, March 31, 2017

SEO Friendly Meta Tag & Valid HTML 5 Untuk Blogger

Assalamu'alaikum warohmatullahi wabarokatuh. Dalam posting kali ini saya akan membahas tentang meta tag seperti apa yang sebaiknya digunakan agar blog menjadi lebih SEO friendly, tag meta yang sebaiknya digunakan agar blog dapat di indeks lebih cepat oleh mesin pencarian. Tetapi sebelum itu saya akan menjelaskan tentang apa itu meta tag.

Meta tag merupakan salah satu tag dalam HTML yang digunakan untuk mengontrol proses indeks dari mesin pencarian (search engines) seperti Google, Bing, Yahoo, dll. Tag meta dalam HTML akan menyediakan informasi bagi mesin pencarian tentang bagian mana yang akan ditampilkan pada hasil pencarian serta bagian mana yang tidak boleh ditampilkan.

Mudahnya, untuk menentukan bagian mana yang sebaiknya dijadikan informasi utama kepada mesin pencari adalah dengan menggunakan pengalaman tentang keyword apa yang biasanya digunakan oleh orang-orang untuk mencari suatu informasi terkait yang ingin kita tulis.

Banyak orang yang terus mencari-cari serta banyak pula situs yang menuliskan tentang tag meta seperti apa yang sebaiknya digunakan agar blog menjadi lebih SEO friendly serta valid dalam HTML 5, oleh karena itu saya akan memberikan sedikit rekomendasi tentang meta tag seperti apa yang sebaiknya sobat gunakan agar blog menjadi lebih SEO friendly dan valid HTML 5 terhadap mesin pencarian terpopuler, Google.

Pertama-tama buka blog sobat kemudian pada menu Tema pilih Edit HTML.


Meta Tag SEO Friendly & Valid HTML 5

Setelah itu selanjutnya sobat tinggal menambahkan meta tag berikut letakkan dibawah kode <head>.

<!-- [ Meta Tag SEO ] -->
<meta charset='utf-8'/>
<meta content='width=device-width, initial-scale=1' name='viewport'/>
<meta content='blogger' name='generator'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>
<link expr:href='data:blog.homepageUrl' rel='openid.delegate'/>
<link expr:href='data:blog.url' rel='canonical'/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.pageTitle/></title>
<b:else/>
<b:if cond='data:blog.pageType != &quot;error_page&quot;'>
<title><data:blog.pageName/> - <data:blog.title/></title>
</b:if></b:if>
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<title>Page Not Found - <data:blog.title/></title>
</b:if>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<meta content='noindex' name='robots'/>
</b:if>
<b:if cond='data:blog.searchLabel'>
<meta content='noindex,nofollow' name='robots'/>
</b:if>
<b:if cond='data:blog.isMobile'>
<meta content='noindex,nofollow' name='robots'/>
</b:if>
<b:if cond='data:blog.pageType != &quot;error_page&quot;'>
<meta expr:content='data:blog.metaDescription' name='description'/>
<script type='application/ld+json'>{ &quot;@context&quot;: &quot;http://schema.org&quot;, &quot;@type&quot;: &quot;WebSite&quot;, &quot;url&quot;: &quot;<data:blog.homepageUrl/>&quot;, &quot;potentialAction&quot;: { &quot;@type&quot;: &quot;SearchAction&quot;, &quot;target&quot;: &quot;<data:blog.homepageUrl/>?q={search_term}&quot;, &quot;query-input&quot;: &quot;required name=search_term&quot; } }</script>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<meta expr:content='data:blog.pageName + &quot;, &quot; + data:blog.pageTitle + &quot;, &quot; + data:blog.title' name='keywords'/>
</b:if></b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta content='xxxxx' name='keywords'/></b:if>
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/>
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default?alt=rss&quot;' expr:title='data:blog.title + &quot; - RSS&quot;' rel='alternate' type='application/rss+xml'/>
<link expr:href='&quot;http://www.blogger.com/feeds/&quot; + data:blog.blogId + &quot;/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:blog.postImageThumbnailUrl'>
<link expr:href='data:blog.postImageThumbnailUrl' rel='image_src'/>
</b:if></b:if>
<link expr:href='data:blog.url' hreflang='x-default' rel='alternate'/>
<link href='/favicon.ico' rel='icon' type='image/x-icon'/>
<link href='https://plus.google.com/xxxxx/posts' rel='publisher'/>
<link href='https://plus.google.com/xxxxx/about' rel='author'/>
<link href='https://plus.google.com/xxxxx' rel='me'/>
<meta content='xxxxx' name='google-site-verification'/>
<meta content='xxxxx' name='msvalidate.01'/>
<meta content='xxxxx' name='alexaVerifyID'/>
<meta content='Indonesia' name='geo.placename'/>
<meta content='xxxxx' name='Author'/>
<meta content='general' name='rating'/>
<meta content='id' name='geo.country'/>

Kemudian silakan ganti bagian yang ditandai diatas sesuai dengan definisinya, jika sobat belum terlalu mengetahui isi dari beberapa tag meta diatas silakan lihat pada tabel berikut.

NoName/RelContent
1KeywordsKata kunci untuk blog sobat
2PublisherIsi dengan username Google+ milik sobat
3AuthorIsi dengan username Google+ milik sobat
4MeIsi dengan username Google+ milik sobat
5google-site-verificationIsi dengan kode verifikasi kepemilikan pada Google Webmaster
6msvalidate.01Isi dengan kode verifikasi kepemilikan pada Bing!
7alexaVerifyIDIsi dengan kode verifikasi Alexa
8AuthorPada author kedua isi dengan nama sobat atau nama pemilik blog tersebut

Social Media Meta Tag SEO Friendly & Valid HTML 5

Tidak sampai disitu, kode diatas merupakan bagian meta tag untuk title dan beberapa inisialisasi serta kepemilikan, selanjutnya sobat perlu menambahkan meta tag untuk media sosial dan publikasi, meta tag yang tentunya juga SEO friendly serta valid HTML 5. Letakkan kode berikut ini setelah kode diatas tadi.

<!-- [ Social Media Meta Tag ] -->
<b:if cond='data:blog.url == data:blog.homepageUrl'> 
<b:if cond='data:blog.pageType == &quot;item&quot;'> 
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>  
<b:if cond='data:blog.url'>
<meta expr:content='data:blog.url' property='og:url'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.pageName'>
<meta expr:content='data:blog.pageName' property='og:title'/>
</b:if></b:if></b:if></b:if>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta content='article' property='og:type'/>
<b:else/>
<meta content='website' property='og:type'/>
</b:if>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
<b:else/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postThumbnailUrl' property='og:image'/>
<b:else/>
<meta expr:content='data:blog.blogspotFaviconUrl' property='og:image'/>
</b:if></b:if>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:else/>
<meta content='xxxxx' property='og:description'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta content='xxxxx' property='fb:app_id'/>
<meta content='xxxxx' property='fb:admins'/>
<meta content='en_US' property='og:locale'/>
<meta content='en_GB' property='og:locale:alternate'/>
<meta content='id_ID' property='og:locale:alternate'/>
<meta content='summary' name='twitter:card'/>
<meta expr:content='data:blog.pageTitle' name='twitter:title'/>
<meta content='xxxxx' name='twitter:site'/>
<meta content='xxxxx' name='twitter:creator'/>

Sama seperti sebelumnya, sobat tinggal mengganti bagian yang ditandai diatas, sobat bisa melihat penjelasannya pada tabel berikut.

NoName/Rel/PropertyContent
1og:descriptionIsi dengan deskripsi yang sobat gunakan untuk blog
2fb:app_idIsi dengan kode facebook app_id
3fb:adminsIsi dengan kode facebook admin_id
4twitter:siteIsi dengan id untuk akun twitter blog sobat (jika ada)
5twitter:creatorIsi dengan id untuk akun twitter pemilik blog (jika ada)


Mungkin cukup sekian dari saya, semoga bisa bermanfaat, kalau ada yang ingin sobat tanyakan silakan sampaikan pada kotak komentar yang ada dibawah atau bisa juga melalui halaman contact blog ini. Terima kasih, assalamu'alaikum warohmatullahi wabarokatuh.
Disqus Comments