Untuk menjadi blogger yang baik, keterampilan blogging saja tidak cukup. Anda perlu mengoptimasi SEO agar performa blog maksimal. Salah satu caranya adalah dengan memahami koding HTML dasar untuk blogger

Dengan mengetahui tag HTML untuk blog, Anda dapat dengan bebas mengatur informasi di dalam konten. Ini memudahkan pengunjung dan bot untuk menemukan informasi di konten Anda.  

Alhasil, konten blog Anda berpeluang besar masuk halaman #1 Google. Bahkan, bisa jadi cuplikan konten Anda tampil dengan tampilan yang lebih menarik. Hal ini tentunya dapat mengundang lebih banyak klik ke blog

Namun jangan khawatir karena menurut Anda coding itu sulit. Di sini, Anda akan belajar coding HTML dasar yang sederhana dan mudah digunakan. Apa itu?

Daftar Isi

Kode HTML untuk Blog

Berikut 9 kode HTML untuk blog dan arti dari coding tersebut

1. Label Judul

Tag HTML pertama adalah tag judul. adalah judul halaman atau situs web. Elemen ini mewakili isi dari konten tersebut, sehingga calon pengunjung dapat mengetahui informasi inti dari sebuah konten

Biasanya, Anda menemukan tag judul sebagai judul pada daftar hasil pencarian

Selain itu, tag judul dari halaman website juga muncul di tab yang dibuka pengunjung

Bagi seorang blogger, tag judul merupakan elemen penting. Mengapa? . Bahkan, title tag bisa meningkatkan Click-through Rate (CTR) hingga 20-100%. Siegemedia telah membuktikannya dengan salah satu kliennya, David's Bridal

Awalnya, David's Bridal memasang kata kunci "Reception Favours" pada tag judulnya. Sayangnya, kata kunci tersebut hanya mampu menghasilkan 500 volume per bulan. Siegemedia melihat celah ini dan mengganti kata kuncinya dengan "Sukacita Pernikahan. “Alasannya, kata kunci ini lebih potensial karena memiliki volume pencarian 50. 000. Hasilnya, RKT Pengantin David dapat melonjak hingga 20%. Cukup mengerikan, bukan?

Nah, sekarang kamu mulai penasaran. Bagaimana Anda membuat tag judul pada dokumen HTML? . Di editor teks, Anda cukup memberikan kode HTML berikut

<title> Masukkan judul </title>

2. Deskripsi meta

Selanjutnya, ada deskripsi meta. adalah tag HTML yang berisi rangkuman singkat tentang konten situs web

Dengan adanya meta description, calon pengunjung akan mengetahui gambaran umum dari konten tersebut. Jika mereka merasa konten tersebut dapat menjawab pertanyaan mereka, maka mereka akan mengkliknya

Mungkin Anda tidak menyangka bahwa meta description dapat meningkatkan tingkat konversi hingga 215%. Perusahaan benang SweetGeorgia telah membuktikannya. Mereka meningkatkan kinerja SEO dengan mengoptimalkan deskripsi meta.  

Akibatnya, halaman produk mereka dapat ditemukan dengan lebih mudah. Karena itu, SweetGeorgia pun mengalami peningkatan pendapatan hingga 24% per tahun

Nah, agar Anda bisa membuat meta description pada dokumen HTML, tulis saja tag-tag berikut ini

<meta name="description" content="Masukkan deskripsi">

3. Tag Tajuk

Tag judul adalah judul dan sub-judul yang ditemukan di halaman situs web. Tag ini berfungsi untuk menunjukkan struktur konten. Dengan struktur konten yang baik, informasi akan lebih mudah dibaca

Keterbacaan informasi tentu mempengaruhi kinerja SEO. Pertama, mesin pencari akan lebih mudah memahami konteks artikel sehingga website bisa mendapatkan peringkat teratas. Kedua, tajuk yang tepat juga memungkinkan konten yang dipilih menjadi cuplikan unggulan

Sebenarnya, ada enam tingkatan heading. Namun yang sering digunakan oleh para blogger adalah H1 hingga H3. Sekarang, kita akan membahasnya satu per satu

• berfungsi sebagai judul utama konten. Letaknya pada bagian teratas sebuah halaman blog

• merupakan sub-judul berisi penjabaran dari topik utama

• sampai
  adalah poin-poin yang memuat informasi pendukung untuk heading sebelumnya

Berikut adalah contoh penggunaan H1 hingga H4

Nah, sekarang Anda sudah lebih memahami penerapan tag heading. Namun, mungkin Anda masih bertanya-tanya. Lalu, apa bedanya H1 dengan tag judul?

Jika tag judul adalah judul halaman, maka H1 adalah judul konten. Tag judul dapat ditemukan pada judul tab dan daftar hasil halaman mesin pencari. Di sisi lain, Anda dapat menemukan H1 di judul halaman situs web.  

Anda dapat memiliki dua versi tag judul dalam satu konten. Caranya akan kita bahas di akhir artikel ini

4. Jangkar Teks dan Tautan

Anchor text adalah fragmen kata yang berisi tautan tertentu. Fungsi anchor text dan link, yaitu untuk mengarahkan pengunjung ke halaman yang dibutuhkan. Sebagai contoh. halaman referensi, halaman arahan, halaman blog, dll

Perlu diingat, anchor text dan link harus relevan dengan konteks konten. Itu karena mesin pencari menggunakannya untuk mengetahui seberapa penting dan dapat dipercaya konten tersebut.  

Lebih detailnya, mesin pencari akan mengukurnya dari kredibilitas sumber referensi, relevansi informasi, dan lain-lain. Semakin terjamin pentingnya konten, semakin besar peluang untuk mendapatkan peringkat teratas dalam hasil pencarian

Baca Juga. Apa itu Perayap Web?

Berikut adalah pengkodean dasar untuk membuat teks jangkar dan tautan

<a href="link website"> anchor text </a>

Walaupun hanya membutuhkan tag-tag HTML sederhana, kamu tetap harus tahu trik membuat anchor text lho. Tujuannya agar performa SEO blog menjadi lebih optimal dan membuka peluang bagi konten Anda yang lain untuk juga mendapatkan trafik

Tertarik mempelajari trik membuat anchor text yang tepat?

5. Jangan ikuti

Dari luar, nofollow mungkin terlihat mirip dengan anchor text dan link pada umumnya. Anda akan melihatnya sebagai teks bergaris bawah biru. Namun, keduanya sebenarnya sangat berbeda

Bisa dibilang, tag nofollow memiliki fungsi yang berlawanan dengan anchor text dan link biasa. Kode HTML nofollow justru membuat link pada website diabaikan oleh mesin pencari. Akibatnya, tautan tidak berpengaruh pada peringkat SEO

Nah, apa gunanya?

Jadi, tag HTML nofollow berfungsi untuk menjaga kinerja SEO. Dengan menggunakan tag ini, blog Anda akan terhindar dari efek negatif jika halaman yang Anda tautkan dianggap sebagai spam, penyebar virus, atau memiliki kinerja SEO yang buruk. Cukup berguna, bukan?

Untuk membuat tag HTML nofollow, cukup gunakan kode berikut

<a href="link website" rel="nofollow">anchor text</a>

6. Teks Alt Gambar

Tag HTML selanjutnya adalah Image Alt Text. Pengkodean dasar ini merupakan elemen untuk memberikan alternatif informasi pada citra.  

Image Alt Text akan membantu mesin pencari untuk memahami arti dari sebuah gambar. Ini karena bot tidak dapat benar-benar melihat gambar seperti manusia.  

Selain membantu proses crawling, teks ini juga yang dilihat pengunjung jika gambar gagal ditampilkan

Untuk membuat Teks Alt Gambar, Anda memerlukan tag HTML berikut

<img alt="text">

7. Tag kanonis

Kode HTML selanjutnya adalah tag canonical. Tag kanonis berfungsi untuk memprioritaskan halaman situs web di atas halaman lain yang memiliki konten serupa atau yang menggunakan URL identik. Akibatnya, laman dengan tag kanonis akan lebih mungkin muncul di hasil penelusuran Google

Mungkin Anda ragu, seberapa besar pengaruh duplikat konten dan konten dengan URL yang sama? . Sebab, Google akan kesulitan memilih versi mana yang akan muncul. Bisa jadi konten Anda yang akan tenggelam. Sayang sekali, bukan?

Oleh karena itu, sebaiknya setiap blogger menggunakan tag kanonis untuk konten serupa. Jadi, meskipun ada duplikasi konten atau halaman dengan URL yang identik, blog yang menggunakan canonical tag akan diprioritaskan untuk muncul atau diakses.

Berikut adalah kode HTML untuk tag kanonis

<link href=”link website” rel=”canonical”>

8. Tag paragraf

Tag paragraf merupakan elemen yang berisikan paragraf dalam blog. Setiap paragraf selalu diawali dengan tag

dan ditutup dengan tag

Berikut adalah koding dasar untuk membuat tag paragraf

<p>Paragraf pertama</p>

<p>Paragraf kedua</p>

9. Tag tebal

Selanjutnya, ada tag HTML tebal. Fungsinya untuk menandai teks dengan huruf tebal

Kode HTML untuk memberi efek huruf tebal cukup sederhana, yaitu

<b>bold text</b>

10. Tag miring

Tag miring berfungsi untuk membuat teks menjadi miring. Untuk membuatnya, Anda hanya memerlukan kode HTML berikut

<i>italic text</i>

Baca Juga. 25+ Contoh Coding HTML untuk Pemula

Saatnya Menjelajah Menggunakan HTML di Blog

Sekarang, Anda telah memahami penjelasan untuk setiap kode HTML. Nah, untuk memudahkan Anda, berikut ini kami berikan rangkuman kode HTML blog

Benefita Ikuti Benefita adalah seorang gadis Pisces. Dia bermimpi hidup di dunia Harvest Moon.

Berlangganan sekarang

Dapatkan berbagai artikel tutorial, insight dan tips menarik seputar dunia online langsung melalui email Anda. Berlangganan sekarang dan raih kesuksesan bersama kami

Bagaimana cara huruf tebal dalam HTML?

Apa nama elemen HTML untuk membuat teks miring?