Cara Menambahkan Tag ALT dan Title untuk Image Pada Postingan blogger

· 2 min read

www.inchimediatama.org adalah Platform Blogger yang berisi Blog Edukasi yang mengulas seputar Web HTTP HTTPS, seperti Blogger, Hugo, Drupal dll

Atribut alt adalah alternatif teks untuk gambar. Ada kasus ketika hanya teks deskripsi yang dimuat alih-alih gambar. Tag alt teks untuk gambar bukanlah deskripsi gambar, bukan keterangannya, tetapi teks yang dapat ditampilkan di browser. Namun keterangan foto itu sendiri terletak di atribut judul. Anda dapat melihat keterangan gambar, ketika kursor anda diarahkan ke gambar.

Topik artikel hari ini adalah optimasi SEO gambar menggunakan atribut ALT. Banyak orang tidak tahu bahwa ketika Anda mengoptimalkan atribut ini, Anda meningkatkan kemungkinan pengunjung ke situs Anda. Jadi, saya akan memberi tahu Anda lebih detail nanti di artikel.


A. Apa itu tag ALT?

ALT adalah atribut yang berisi teks alternatif gambar. Atribut ini ditampilkan saat tampilan gambar dinonaktifkan di browser, tetapi Anda tidak akan melihatnya di pengaturan standar. Sama seperti Judul dan Deskripsi, itu diperhitungkan oleh mesin pencari.

Teks alternatif pada gambar membantu mereka yang tidak dapat melihat gambar. Pembaca layar menyuarakan teks ini, meningkatkan aksesibilitas. Fitur ini sangat penting untuk perusahaan perancang situs web yang bertujuan untuk membuat situs web mereka dapat diakses secara universal.

Tag alt juga penting dalam SEO. Mereka dapat meningkatkan visibilitas situs web Anda di mesin pencari. Mesin pencari tidak dapat melihat gambar, sehingga mereka membaca teks alt.

Teks alt pada gambar akan muncul saat gambar gagal dimuat. Ini membantu pengguna memahami apa yang seharusnya ada di sana. Ini penting untuk pengalaman pengguna yang baik.

Tidak adanya atribut tag alt pada gambar, tentu saja, tidak ada hubungannya dengan kesehatan situs blog anda. Tetapi mereka sangat penting dalam hal SEO, serta pengalaman pengguna. Ada banyak keuntungan menerapkan tag ALT, diantaranya adalah:
  • Jika Internet lambat, foto mungkin tidak dimuat, jadi hanya deskripsi (tombol alt) yang ditampilkan sebagai gantinya.
  • Ada kasus ketika orang mengubah pengaturan browser atau ponsel mereka sendiri, menonaktifkan unggahan foto apa pun. Alasannya mungkin berbeda, menghemat bandwith, keinginan untuk mempercepat pemuatan halaman, atau model ponsel lama.


B. Cara Membuat tag Title dan alt pada gambar

Baik tag Alt maupun Title keduanya saling terkait, yaitu keduanya digunakan untuk menjelaskan gambar postingan. Pada bagian ini kami akan menjelaskan cara menambahkan Title atau deskripsi pada gambar yang anda letakkan di halaman postingan blog anda.

Caranya sangat mudah. Ikuti langkah-langkah di bawah ini:

1. Masukkan gambar ke halaman postingan blog.
2. Setelah anda memasukkan gambar, cari alamat url gambar, yaitu dengan mengklik menu HTML view yang ada di bagian kiri atas. biar lebih jelasnya perhatikan gambar di bawah ini.


Cara Menambahkan Tag ALT dan Title untuk Image Pada Postingan blogger


Script warna merah adalah alamat url dari gambar yang anda masukkan ke halaman postingan blog anda. Script inilah nantinya yang akan kita modifikasi.

3. Perhatikan script asli dari alamat url gambar tersebut. Di bawah ini adalah script asli dari alamat url gambar yang anda taruh di halaman postingan.

<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXZTXBrpU2MYinDU37PuqMDsiDnBjzj5Awgc37OYehm-Zuc9Vpeh7mOqdymRmhK7WJ9n2lXWh9HlR7A4S-vn0snCAq3jOCZWN9HhJg67_5vUig6UzM2Y1nyTyVICop0daUw2P0SAjWhD_j8pQm3-IF5lgSsXAqY0-zyprz7zHuvNQCv54uEV-nM1McnLUc/s1016/Menu%20HTML%20view%20untuk%20melihat%20script%20gambar%20di%20blogger.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="766" data-original-width="1016" height="241" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXZTXBrpU2MYinDU37PuqMDsiDnBjzj5Awgc37OYehm-Zuc9Vpeh7mOqdymRmhK7WJ9n2lXWh9HlR7A4S-vn0snCAq3jOCZWN9HhJg67_5vUig6UzM2Y1nyTyVICop0daUw2P0SAjWhD_j8pQm3-IF5lgSsXAqY0-zyprz7zHuvNQCv54uEV-nM1McnLUc/s320/Menu%20HTML%20view%20untuk%20melihat%20script%20gambar%20di%20blogger.jpg" width="320" /></a>


4. Klik gambar dan klik menu "Edit iamge"


Cara Menambahkan Tag ALT dan Title untuk Image Pada Postingan blogger


Pada menu Edit image, anda isikan tek untuk tag alt dan Title. Perhatikan contoh gambar berikut.


Cara Menambahkan Tag ALT dan Title untuk Image Pada Postingan blogger


Pada sini, anda telah berhasil membuat tag alt dan title untuk postingan. Sekarang coba kita lihat perubahan script aslinya.

Setelah anda mengetikkan teks untuk tag alt dan title, maka script asli untuk gambar tersebut akan berubah juga, seperti berikut.

<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXZTXBrpU2MYinDU37PuqMDsiDnBjzj5Awgc37OYehm-Zuc9Vpeh7mOqdymRmhK7WJ9n2lXWh9HlR7A4S-vn0snCAq3jOCZWN9HhJg67_5vUig6UzM2Y1nyTyVICop0daUw2P0SAjWhD_j8pQm3-IF5lgSsXAqY0-zyprz7zHuvNQCv54uEV-nM1McnLUc/s1016/Menu%20HTML%20view%20untuk%20melihat%20script%20gambar%20di%20blogger.jpg" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara Menambahkan Tag ALT dan Title untuk Image Pada Postingan blogger" border="0" data-original-height="766" data-original-width="1016" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXZTXBrpU2MYinDU37PuqMDsiDnBjzj5Awgc37OYehm-Zuc9Vpeh7mOqdymRmhK7WJ9n2lXWh9HlR7A4S-vn0snCAq3jOCZWN9HhJg67_5vUig6UzM2Y1nyTyVICop0daUw2P0SAjWhD_j8pQm3-IF5lgSsXAqY0-zyprz7zHuvNQCv54uEV-nM1McnLUc/s16000/Menu%20HTML%20view%20untuk%20melihat%20script%20gambar%20di%20blogger.jpg" title="Menu HTML view untuk melihat script gambar di blogger" /></a>


Perhatikan script warna merah, teks untuk alt dan title gambar telah muncul di script tersebut.

Sanat mudah bukan?. Memang terlihat mudah tapi jarang sekali blogger menerapkan tag alt dan title untuk gambar. Kami sarankan setelah anda membaca artikel ini, anda menerapkan tag alt dan gambar pada tiap gambar postingan blog anda. Karena dengan adanya tag alt dan title pada image blogger anda dari segi SEO akan meningkat, karena dibantu dengan keterangan yang ada di tiap gambar postingan.
Subscribe on LinkedIn

Silahkan Berkomentar, Kakak...! Bunda...!

Posting Komentar