#Update Optimasi Kode SEO Meta Tag Lengkap Khusus Blogger



Meta Tag Blogspot SEO Friendly Valid HTML5 Lengkap yang saya dapatkan dari hasil berburu SEO di google. meta tag yang saya dapatkan sudah di formulasikan untuk penggunaan blogspot dan yang pastinya super SEO friendly dan ter-update yang sudah dilengkapi dengan social meta tag untuk penggunaan snipet card Facebook, Twitter, Pinteres, Tumblr dan Linkdn, pantengin terus di blog codeflare biar selalu update untuk dunia blogger.

Elemen HTML <meta> mewakili metadata yang tidak dapat diwakili oleh elemen terkait meta HTML lainnya, seperti <base>, <link>, <script>, <style> atau <title>

Elemen meta adalah tag yang digunakan dalam dokumen HTML dan XHTML untuk memberikan metadata terstruktur tentang halaman Web. Mereka adalah bagian dari bagian kepala halaman web. Beberapa elemen Meta dengan atribut berbeda dapat digunakan pada halaman yang sama. Elemen meta dapat digunakan untuk menentukan deskripsi halaman, kata kunci, dan metadata lainnya yang tidak disediakan melalui elemen dan atribut head lainnya.

Pengindeksan web metadata melibatkan pemberian kata kunci atau frasa ke halaman web atau situs web dalam bidang metadata tag (atau "meta-tag"), sehingga halaman web atau situs web dapat diambil dengan mesin pencari yang dikustomisasi untuk mencari kata kunci bidang. Ini mungkin melibatkan atau tidak menggunakan kata kunci yang terbatas pada daftar kosa kata yang dikendalikan. Metode ini biasa digunakan oleh pengindeksan mesin pencari.

Meta tag deskripsi memang sangat dianjurkan oleh Google Search Engine untuk dipasang di blog atau website pribadi dengan tujuan agar google lebih mudah menelusuri dan meng-indeks halaman blog dan juga untuk kemajuan pagerank blog. Selain untuk hal tersebut sekarang penggunaan meta tag menjadi semakin fungsional terlebih dengan adanya fitur card redirect interaction yang semakin banyak digunakan di situs-situs besar sosial media.

Apa sih card redirect interaction ??? Fitur card redirect interaction ini berguna pada saat kita mengetikan alamat suatu website dalam hal ini blog (karena topik pembicaraan adalah blog yang berbasis blogspot) maka akan muncul keterangan dari alamat website yang merujuk kepada isi artikel dari alamat website yang ditulis pada postingan status di media sosial.

Berikut contoh gambar dari penggunaan card redirect interaction :


Gambar Share Postingan Status Facebook Card


Gambar Share Postingan Status Twitter Card


Gimana keren kan..? oke lah buat yang tertarik langsung aja menuju TKP biar segera di perkarakan hehehe :), sebelumnya jangan lupa untuk Like, Share dan Subscribe yaaa... kalo masih kurang banyak infonya nanti saya update lagi so stay tuned terus yaa di codeflare.

Informasi Singkat
Meta adalah elemen atau tag dalam bahasa pemrograman HTML atau XHTML yang berfungsi sebagai pemberi informasi metadata dari sebuah halaman web. Elemen meta ini harus diletakkan pada bagian “head” dalam HTML tersebut. Tag meta ini dapat dipakai juga untuk menyatakan deskripsi/keterangan dari suatu halaman web dan untuk menjelaskan mengenai kata kunci (keyword) yang terkait serta untuk metadata lain tanpa “head”. Secara umum, terdapat beberapa macam meta tag dengan fungsi yang berbeda. Beberapa fungsi tersebut misalnya meta keywords, robots, dan description.

Jenis-jenis elemen Meta

  • keywords
    keywords (bahasa Indonesia : kata kunci) adalah salah satu jenis meta yang memiliki fungsi menjelaskan isi dari halaman web melalui beberapa kata atau frasa. Seiring perkembangan zaman, jumlah penggunaan keywords telah dibatasi. Seperti Google yang menganggap "spam" penggunaan keywords dengan jumlah di atas 7 kata.

    Sebagai contoh yang sederhana, di bawah ini ditampilkan perintah meta:

    untuk menjelaskan bahwa halaman yang bersangkutan berkaitan dengan kata kunci “wikipedia” dan “encyclopedia".

  • robots
    robots adalah salah satu jenis meta yang memiliki fungsi mengontrol perilaku perayapan dan pengindeksan mesin telusur. Tag meta robots berlaku untuk semua mesin telusur (search engine), untuk tag meta "googlebot" di khususkan hanya untuk google. Nilai standar bagi tag meta robots adalah "index,follow" (sama dengan "all") dan tidak perlu ditetapkan. Ada beberapa nilai untuk meta tag robots yaitu :

    Dikutip dari tag meta yang dipahami oleh google

    Contoh penulisan tag meta robots :

  • description
    description dalam (bahasa Indonesia: penjelasan/deskripsi) adalah salah satu jenis meta yang memiliki fungsi memberikan garis besar isi halaman web. Cara menggunakan ini berbeda dengan keywords yaitu menggunakan kalimat bukan kata.

    Contoh penulisan meta tag description :

    Contoh tersebut untuk menjelaskan garis besar konten yang ada dalam suatu halaman HTML.

Sumber : Wikipedia



Cara Pemasangan SEO Meta TAG Pada Template Blogger


PENTING
Perhatian ! Tips dan trik SEO Meta TAG ini sudah di optimasikan hanya untuk template berbasis blogspot. Sebelum melakukan perubahan pada kode HTML template blog, sebaiknya Anda melakukan backup kode HTML template blog terlebih dahulu, dikarenakan untuk menghindari hal-hal yang tidak diinginkan. Apabila terjadi kesalahan prosedur dalam melakukan perubahan kode HTML template blog, maka Anda dapat melakukan proses perbaikan dengan cepat dan mudah.

Pada artikel ini saya berikan komplit kode meta tag yang sudah diformulasikan untuk penggunaan sehari-hari di blogspot, adapun modifikasi meta tag antara lain :
  1. formulasi meta tag social media.
  2. modifikasi tag judul blog supaya SEO friendly. Jangan lupa untuk menghapus tag judul default bawaan dari template blog yang anda gunakan.
  3. optimasi meta tag untuk penggunaan browser Internet Explorer versi 9 ke bawah
  4. optimasi meta tag untuk beberapa search engine agar mantab SEO.
  5. modifikasi meta tag untuk penggunaan mobile device.
  6. penggunaan meta tag canonical.
  7. modifikasi meta tag deskripsi dan meta keywords.
  8. modifikasi meta tag untuk menghindari duplikasi karena halaman Archive.
  9. modifikasi meta tag untuk menghindari duplikasi karena halaman Label.
  10. modifikasi meta tag untuk menghindari duplikasi konten karena tampilan dinamis dan tampilan versi seluler / versi mobile.

Berikut cara menerapkan SEO Meta TAG ke dalam kode HTML template blog anda :

  • Silakan login dahulu ke blog Anda.

  • Klik tombol Tema untuk masuk ke tema editor.


  • Klik tombol Edit Tema untuk menampilkan kode HTML Template Blog.




    Hapus semua meta tag yang ada pada kode HTML template blog, Ingat hanya kode meta tag saja yaa jangan kode yang lain. Silakan anda ganti kode meta tag yang lama tersebut dengan kode meta tag baru di bawah ini dengan beberapa penyesuaian. Copy-paste kode di bawah ini dan taruh setelah kode <head> pada kode template blog anda.

    <meta content='width=device-width, initial-scale=1, maximum-scale=1' name='viewport'/>

    <!-- Favicon Browser Optimize Start -->
    <link href='URL gambar logo icon blog anda' rel='icon' type='image/x-icon'/>
    <link href='URL gambar logo icon blog anda' rel='shortcut icon' type='image/x-icon'/>
    <link href='URL gambar logo icon blog anda' rel='icon' sizes='16x16' type='image/png'/>
    <link href='URL gambar logo icon blog anda' rel='icon' sizes='32x32' type='image/png'/>
    <link href='URL gambar logo icon blog anda' rel='icon' sizes='96x96' type='image/png'/>
    <link href='URL gambar logo icon blog anda' rel='icon' sizes='192x192'/>
    <link href='URL gambar logo icon blog anda' rel='apple-touch-icon'/>
    <link href='URL gambar logo icon blog anda' rel='apple-touch-icon' sizes='57x57'/>
    <link href='URL gambar logo icon blog anda' rel='apple-touch-icon' sizes='152x152'/>
    <link href='URL gambar logo icon blog anda' rel='apple-touch-icon' sizes='167x167'/>
    <link href='URL gambar logo icon blog anda' rel='apple-touch-icon' sizes='180x180'/>
    <!-- End Favicon Browser Optimize -->

    <!-- Headers Theme Color Start -->
    <!-- Chrome, Firefox OS and Opera -->
    <meta content='#0083da' name='theme-color'/>
    <!-- Windows Phone -->
    <meta content='#0083da' name='msapplication-navbutton-color'/>
    <!-- iOS Safari -->
    <meta content='#0083da' name='apple-mobile-web-app-status-bar-style'/>
    <!-- End Headers Theme Color-->

    <!-- SEO Meta Tag Title Start-->
    <b:include data='blog' name='all-head-content'/>
    <title>
    <b:if cond='data:blog.pageType == &quot;index&quot;'>
    <data:blog.pageTitle/>
    <b:else/>
    <b:if cond='data:blog.pageType != &quot;error_page&quot;'>
    <data:blog.pageName/> - <data:blog.title/>
    <b:else/>
    ERROR 404 - <data:blog.title/>
    </b:if>
    </b:if>
    </title>
    <!-- End SEO Meta Tag Title -->

    <!-- SEO Meta Tag Start-->
    <meta content='blogger' name='generator'/>
    <link expr:href='data:blog.url' rel='canonical'/>
    <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;https://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'/>
    <link href='https://www.blogger.com/openid-server.g' rel='openid.server'/>
    <link expr:href='data:blog.homepageUrl' rel='openid.delegate'/>
    <b:if cond='data:blog.homepageUrl == data:blog.url'>
    <meta expr:content='data:blog.pageTitle' name='keywords'/>
    <b:if cond='data:blog.metaDescription'>
    <meta expr:content='data:blog.metaDescription' name='description'/>
    </b:if>
    </b:if> 
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <meta expr:content='data:blog.pageName' name='keywords'/>
    <b:if cond='data:blog.metaDescription'>
    <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.pageType == &quot;index&quot;'>
    <b:if cond='data:blog.searchLabel'>
    <meta content='noindex,nofollow' name='robots'/>
    </b:if>
    </b:if>
    <b:if cond='data:blog.pageType == &quot;archive&quot;'>
    <meta content='noindex,nofollow' name='robots'/>
    </b:if>
    <b:if cond='data:blog.isMobile'>
    <meta content='noindex,nofollow' name='robots'/>
    </b:if>
    <meta content='global' name='distribution'/>
    <meta content='follow, all' name='msnbot'/>
    <meta content='follow, all' name='alexabot'/>
    <meta content='follow, all' name='slurp'/>
    <meta content='follow, all' name='zyborg'/>
    <meta content='follow, all' name='scooter'/>
    <meta content='all' name='spiders'/>
    <meta content='all' name='webcrawlers'/>

    <meta content='Nama Akun Blog Anda' name='Author'/>

    <meta content='Public' name='rating'/>
    <meta content='ID' name='geo.country'/>
    <meta content='Indonesia' name='geo.placename'/>
    <meta content='general' name='rating'/>
    <meta content='English' name='language'/>
    <!-- SEO Meta Tag End -->

    <!-- Social Media meta tag need customer customization -->
    <meta content='Kode App Facebook Number' property='fb:app_id'/>
    <meta content='Kode Admin Number' property='fb:admins'/>

    <meta content='Nama Akun Twitter' name='twitter:site'/>
    <meta content='Nama Akun Twitter' name='twitter:creator'/>
    <!-- Social Media meta tag need customer customization -->

    <!-- Facebook Open Graph Start-->
    <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.pageName' 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.metaDescription'>
    <meta expr:content='data:blog.metaDescription' name='og:description'/>
    <b:else/>
    <meta expr:content='&quot;Silahkan baca artikel &quot; + data:blog.pageName + &quot; ini selengkapnya di &quot; + data:blog.title + &quot;&quot;' name='og:description'/>
    </b:if>
    <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 content='URL gambar logo blog anda size 192px' property='og:image'/>
    <meta expr:content='data:blog.blogspotFaviconUrl' property='og:image'/>
    </b:if></b:if>
    <meta expr:content='data:blog.title' property='og:site_name'/>

    <meta content='URL Akun Facebook Anda' property='article:author'/>
    <meta content='URL Akun Facebook Anda' property='article:publisher'/>

    <meta content='en_US' property='og:locale'/>
    <meta content='en_GB' property='og:locale:alternate'/>
    <meta content='hi_IN' property='og:locale:alternate'/>
    <!-- Facebook Open Graph End-->
    <!-- Pinteres Rich Pins Start-->
    <meta expr:content='data:post.timestampISO8601' property='article:published_time'/>
    <meta expr:content='data:blog.pageName' property='article:author'/>
    <!-- Pinteres Rich Pins End-->
    <!-- Twitter Snipet Card Start-->
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <meta content='summary_large_image' name='twitter:card'/>
    <meta expr:content='data:blog.pageTitle' name='twitter:title'/>
    <meta content='435' name='twitter:image:width'/>
    <meta content='375' name='twitter:image:height'/>
    <b:else/>
    <meta content='summary' name='twitter:card'/>
    <meta expr:content='data:blog.title' name='twitter:title'/>
    </b:if>
    <meta expr:content='data:blog.canonicalUrl' name='twitter:url'/>
    <meta expr:content='data:blog.homepageUrl' name='twitter:domain'/>
    <b:if cond='data:blog.metaDescription'>
    <meta expr:content='data:blog.metaDescription' name='twitter:description'/>
    <b:else/>
    <meta expr:content='&quot;Silahkan baca artikel &quot; + data:blog.pageName + &quot; ini selengkapnya di &quot; + data:blog.title + &quot;&quot;' name='twitter:description'/>
    </b:if>
    <b:if cond='data:blog.postImageUrl'>
    <meta expr:content='data:blog.postImageUrl' name='twitter:image:src'/>
    <b:else/>
    <b:if cond='data:blog.postImageThumbnailUrl'>
    <meta expr:content='data:blog.postThumbnailUrl' name='twitter:image:src'/>
    <b:else/>
    <meta content='URL gambar logo blog anda size 192px' name='twitter:image:src'/>
    </b:if>
    </b:if>
    <!-- Twitter Snipet Card End-->

    <!-- SEO IE Browser Start-->
    <!--[if lt IE 9]> <script src="https://raw.githubusercontent.com/aFarkas/html5shiv/master/dist/html5shiv.min.js" type="text/javascript"></script> <![endif]-->
    <!--[if IE]> <script> (function() { var html5 = ("abbr,article,aside,audio,canvas,datalist,details," + "figure,footer,header,hgroup,mark,menu,meter,nav,output," + "progress,section,time,video").split(','); for (var i = 0; i < html5.length; i++) { document.createElement(html5[i]); } try { document.execCommand('BackgroundImageCache', false, true); } catch(e) {} })(); </script> <![endif]-->
    <!--[if lt IE 9]>
    <script src="https://raw.githubusercontent.com/heathcliff/css3-mediaqueries-js/master/css3-mediaqueries.js" type="text/javascript"></script>
    <![endif]-->
    <!-- SEO IE Browser End-->

    KETERANGAN
    • Pada kode <link href='URL gambar logo icon blog anda' rel='icon' type='image/x-icon'/> merupakan kode URL gambar favicon kecil blog silakan masukan dengan URL gambar favicon blog anda sesuai dengan ukuran (dalam pixel) yang sudah di beri keterangan pada atrribut sizes. Apa sih favicon ? itu lho gambar kecil di atas addressbar browser, masih belum tau juga silakan googling dengan keyword "favicon".

    • Pada kode <meta content='#0083da' name='theme-color'/> merupakan kode warna header yang berfungsi pada browser mobile. Silakan anda rubah kode warnanya sesuai dengan warna template blog yang anda gunakan.

    • Pada kode <meta content='Nama Akun Blog Anda' name='Author'/> merupakan meta tag untuk informasi author atau developer blog. Silakan anda ganti tulisan Nama Akun Blog Anda dengan nama akun blog yang anda gunakan.

      Pada kode <meta content='Kode App Facebook Number' property='fb:app_id'/> merupakan kode khusus aplikasi facebook yang terhubung dengan blog anda silakan anda ganti tulisan Kode App Facebook Number dengan kode nomor ID Apps Facebook anda.

      Apabila belum pernah membuat aplikasi berbasis facebook silakan dihapus saja meta tag tersebut.

    • Pada kode <meta content='Nama Akun Twitter' name='twitter:site'/> merupakan kode untuk nama akun twitter pastikan anda menggunakan tanda "@" misalkan @akun-twiter.

      Pada kode <meta content='Nama Akun Twitter' name='twitter:creator'/> sama seperti nama akun twitter diatas.

    • Pada kode <meta content='URL gambar logo blog anda size 192px' property='og:image'/> merupakan URL untuk gambar ikon logo anda dengan ukuran 192px.

    • Pada kode <meta content='URL Akun Facebook Anda' property='article:author'/>

      <meta content='URL Akun Facebook Anda' property='article:publisher'/>

      merupakan URL alamat akun facebook. Contoh : https://www.facebook.com/codeflarepage

    • Pada kode <meta content='URL gambar logo blog anda size 192px' name='twitter:image:src'/> merupakan URL gambar yang akan digunakan pada card interaction pada halaman selain halaman postingan artikel silakan anda ganti dengan URL gambar logo ikon blog anda.

    • Apabila sudah di sesuaikan dan dicoba maka tinggal melihat hasilnya fitur card interaction sosial media. Silakan klik link di bawah ini untuk melihat tampilan card di media sosial :

  • Klik "Save" dan lihat hasilnya...

Demikian artikel blog tentang #Update Optimasi Kode Meta Tag Lengkap Khusus Blogger terima kasih sudah berkunjung, jangan lupa Like, Share dan Subscribe, untuk pertanyaan, kritik ataupun saran silakan ditulis pada kotak komentar di bawah. Apabila ada kata-kata yang kurang berkenan atau informasi yang kurang akurat, harap dimaklumi. Akhir kata Semoga Bermanfaat.


Keyword


blog, blogger, blogspot, Meta, TAG, SEO, optimal, Optimasi, Optimize, lengkap, cara, memasang, mengganti, merubah, pasang, ganti, rubah, kode, code, script, HTML, CSS, Javascript, komplit, terbaru, terbaik, download, copy, paste, seting, kustom, body, head, terlengkap, uptodate, SEO, search, engine, google, adsense, top, pencari, template

Incoming Search Term


Cara mengganti meta tag pada blog, cara memasang SEO meta tag untuk blogger, kode meta tag terbaru SEO friendly pada blogspot, meta tag HTML khusus blogger, meta tag terlengkap untuk SEO dan google adsense, Optimasi kode meta tag pada template blog, injeksi meta tag pada template blog, meta tag SEO terbaru, Kode meta tag search engine optimization, apa sih meta tag?, bagaimana fungsi kode meta tag?, definisi meta tag, cara pasang meta tag blogspot, cara mudah mengganti meta tag template blog, cara kerja meta tag, spesial meta tag SEO white hat, meta tag super premium untuk meningkatkan SEO, cara kerja SEO meta tag, kumpulan meta tag terbaru, Trik SEO menggunakan metatag, tips seo melalui metatag, how to increase SEO using meta tag code, metatag code for blogger SEO, sisipan metatag html5, metatag web 2.0, aturan penggunaan metatag sesuai google, metatag facebook card, metatag for social media twitter pinteres facebook linkedin, meta tag twitter card, meta tag schema.org, panduan memasang meta tag untuk blog

Komentar

Postingan populer dari blog ini

Cara Pasang Widget ASTROLOGI Online Lengkap Terbaru

Terjawab ! Ini yang Terjadi pada Manusia Jika Tewas di Luar Angkasa

#Keren ! Tombol Share Facebook Menggunakan Animasi Spiderman