Cara Memeriksa dan Menghasilkan Meta Tag untuk Website Anda
Ditulis pada: SIANG/HARI
Dalam tips singkat ini saya akan memperkenalkan kepada Anda fasilitas yang sederhana namun sangat berguna bernama Hey Meta. Jika Anda tertarik untuk melihat seperti apa tampilan profil website Anda, dan Anda ingin memastikan meta tag yang Anda gunakan benar, Hey Meta adalah yang Anda butuhkan. Mari Kita telusuri!
Dapatkan Meta Tag yang Tepat
Periksa Meta Tag Anda
Periksa efektivitas penyiapan tag meta website Anda saat ini dengan memasukkan URL pada input field yang tersedia. Anda akan ditampilkan preview sosial card (apa yang mungkin ditampilkan di jejaring sosial, shareing-apps, dll.) Dan judul, deskripsi, gambar featured image dari URL yang dimaksud.
Jika halaman website Anda tidak memiliki meta tag sama sekali untuk item ini, tidak ada yang akan ditampilkan.
Generate Meta Tag yang Benar
Jika halaman Anda tampak kurang detail, atau menunjukkan metadata yang salah (atau sub-optimal) Anda dapat menggunakan Hey Meta untuk menghasilkan tag yang benar untuk Anda. Masukkan informasi yang ingin Anda tampilkan di bidang yang ditampilkan:
Hal yang sama dapat dilakukan untuk deskripsi website, URL, dan featured image. Tag yang dihasilkan akan ditampilkan pada preview, dan markup akan terlihat seperti ini:
<!-- HTML Meta Tags -->
<title>Test website</title>
<meta name="description" content="This is the website description. Nice eh?">
<!-- Google / Search Engine Tags -->
<meta itemprop="name" content="Test website">
<meta itemprop="description" content="This is the website description. Nice eh?">
<meta itemprop="image" content="https://lorempixel.com/400/200/">
<!-- Facebook Meta Tags -->
<meta property="og:url" content="https://nothing.com">
<meta property="og:type" content="website">
<meta property="og:title" content="Test website">
<meta property="og:description" content="This is the website description. Nice eh?">
<meta property="og:image" content="https://lorempixel.com/400/200/">
<!-- Twitter Meta Tags -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Test website">
<meta name="twitter:description" content="This is the website description. Nice eh?">
<meta name="twitter:image" content="https://lorempixel.com/400/200/">
<!-- Meta Tags Generated via https://heymeta.com -->
Di sini Anda akan melihat tag meta HTML asli seperti <title>
, tag Twitter, dan tag Open Graph seperti <meta property="og:title">
yang memungkinkan penggunaan sosial sharing dengan tepat. Tag ini kemudian dapat ditempatkan pada <head>
dokumen HTML Anda.
Kesimpulan
Pastikan meta tag Anda menampilkan detail website Anda dengan benar!