Anda mungkin sudah pernah mendengar istilah alt tag ini sebelumnya. Karena istilah ini memang sudah sering di singgung dalam blog ini. Tentu, mendengar dan memahami itu adalah dua hal yang berbeda. Jadi, mari kita menggali sedikit lebih dalam mengenai informasi yang mungkin Anda perlukan mengenai alt tag ini.
Hal pertama yang harus Anda mengerti dari alt tag adalah bahwa, ini sebenarnya sama sekali bukan tag. Nama yang benar untuk item ini adalah alt attribut. Istilah attribut di gunakan karena item ini adalah berbagai attribut yang dapat meningkatkan tag-tag yang Anda gunakan pada website.
Alt, yang di ambil dari singkatan alternatif, adalah sejenis attribut khusus yang merujuk pada text alternatif yang mungkin Anda lihat pada graphic. Banyak orang yang bukan web designer profesional terbolak-balik dalam menggunakan istilah tag dan attribut. Itulah mengapa Anda sering melihat alt attributes merujuk pada alt tags.
Alt attribute bukanlah elemen utama SEO. Bahkan, attribut ini sebenarnya lebih di tujukan untuk layar pembaca. Attribut ini di gunakan untuk mengganti image, table, atau elemen-elemen lain dari sebuah halaman web yang tidak bisa di tampilkan dengan benar oleh layar pembaca.
Akan tetapi, jika di gunakan dengan benar, Anda dapat memanfaatkan alt attribute untuk menambahkan keyword pada halaman web. Tapi ingat bahwa elemen ini khusus di design untuk pengunjung, bukan search engine.
Untuk memanfaatkannya semaksimal mungkin, alt attribute seharusnya dapat menjelaskan secara singkat mengenai image atau elemen yang di gantikannya. Mengenai seberapa singkat seharusnya, masih jadi perdebatan. Beberapa pakar mengatakan hanya 5 sampai 10 kata. Sementara yang lain mengatakan sebanyak 125 karakter.
Idealnya, Anda harus mempertahankan alt attribute antara 50 sampai 125 karakter. Gunakan hanya kata-kata yang di perlukan untuk menjelaskan gambar apa yang tidak bisa di lihat oleh pengunjung. Alt attribute bukan tempat untuk bercerita, melainkan tempat untuk memberitahu pembaca apa yang ada di sana atau hubungannya dengan isi halaman.
Pilihlah kata-kata dengan bijak, dan buatlah agar dia powerful. Akan lebih baik jika Anda menyertakan keyword dalam prosesnya. Jika tidak bisa, itu bukanlah akhir dunia, dan mungkin tidak memberikan efek negatif terhadap rangking di search engine. Contoh, sebuah alt tag yang menjelaskan gambar Mona Lisa mungkin akan terlihat seperti ini :
Alt=”Mona Lisa”
Alt tag biasanya berada di bagian akhir dari image tag. Sebuah image tag mungkin akan tampak seperti contoh di bawah ini:
<img width=”100″ height=”100″ src=”monalisa.jpg” alt=”Mona Lisa”>
Jika kode tersebut di terjemahkan maka:
<img width=”100″: Lebar image (dalam satuan pixels)
Height=”100″: Tinggi image (dalam satuan pixels)
Src=”monalisa.jpg”: File sumber image.
Alt=”Mona Lisa”>: Text alternatif yang akan di tampilkan jika image tidak muncul.
Satu hal lagi yang harus di ingat, agar benar-benar efektif, tag ini seharusnya di gunakan pada setiap image yang ada di website. Ini bisa jadi tugas yang berat jika sejak awal website Anda tidak di kode dengan benar (tergantung jumlah image.)
Akan tetapi, dengan menambahkan tag ini seharusnya bisa memberi manfaat pada SEO selama Anda tidak melangkah terlalu jauh dari batasan yang tidak jelas mengenai alt tag ini.
Alt tags dalam link graphic
Sampai sejauh ini, Anda telah mendengar bahwa text alternatif untuk graphic (atau link graphic) seharusnya selalu di sertakan dalam halaman web. Tapi apakah Anda tahu bahwa ada pengecualian untuk aturan tersebut?
Text alternatif dalam bentuk alt tag sangat bermanfaat dalam beberapa situasi, misalnya saat pengunjung menggunakan browser yang text only, atau saat kemampuan graphic pada browser pengunjung dinonaktifkan, atau saat mereka menggunakan text to speech untuk membacakan halaman web. Itulah yang membuat alt tag menjadi sangat penting.
Akan tetapi, jika website Anda banyak berisi pengulangan image, itu mungkin akan menyebabkan tag yang sama di gunakan secara berulang-ulang. Selain itu, saat Anda menggunakan graphic (misalnya picture dan clip art) sebagai link, maka pengunjung akan merasa bosan karena terlalu sering melihat alt=”hyperlink”.
Biasanya, Anda bisa menggunakan salah satu contoh dari deskripsi alt tag, dan kemudian menggunakan sebuah alt tag kosong (alt=”") untuk setiap gambar yang di ulang. Kecuali jika graphic yang di gunakan pada halaman dan di dalam link tersebut mengandung informasi yang sangat penting bagi website Anda.
Jika Anda menggunakan tag-tag alternative untuk link berbentuk graphic, maka Anda bisa membedakan masing-masing link dengan cara menggunakan alamat web yang di link di dalam alt tag. Akan tetapi, jangan menggunakan alamat web yang panjangnya 3 sampai 4 baris. Lebih baik gunakan alamat web dasar.
Gambar di bawah menunjukkan link graphic tanpa text, dan link grahic dengan alt text.
Contoh penggunan alt attribut
Jika sebuah image adalah text, misalnya logo perusahaan, maka salah satu cara untuk mengatasinya adalah membuat text dengan style, yaitu menggunakan style sheet untuk mengatur beberapa properties dari jenis font, ukuran, dan warna.
Sebagai contoh, jika menggunakan aturan CSS untuk atrtibut strong maka kode untuk text Anda mungkin akan tampak seperti contoh di bawah ini:
{ background: #ffc none; color: #060; font-weight: normal;
font-family: “Comic Sans MS”, Western, fantasy; }
Masalahnya, cara ini terkadang tidak berkerja sesuai keinginan. Logo perusahaan yang di singgung sebelumnya mungkin bisa di terima dalam format text, hanya jika sejak awal logo tersebut di design dengan cara itu.
Tapi jika logo tersebut mengandung unsur graphic di dalamnya, meski itu adalah text, maka dengan mengubah tampilannya menjadi non-graphic style dapat menyebabkan logo Anda menjadi tidak di kenali.
Masalah lain yang mungkin akan timbul saat membuat alt tag adalah bulleted lists yang mengandung decorative (graphic) bullets. Salah satu cara untuk mengatasinya adalah dengan menggunakan asterik atau dash untuk mengindikasikan setiap point, misalnya seperti ini:
alt=”*” atau alt=”-”
Alternatif lain adalah menggunakan sebuah alt tag yang menjelaskan graphic yang di gunakan untuk bullet poin, misalnya:
Alt=”black musical note”
Alt tags, entah di gunakan dalam link graphic atau untuk mengantikan graphic, adalah salah satu cara agar orang yang tidak bisa melihat image tetap bisa memahami website Anda.
Seringkali, graphic memegang peranan penting dari cara websie Anda di tampilkan. Tapi jika Anda menggunakannya hanya untuk mengulangi keyword, tanpa memberikan informasi yang bisa menjelaskan graphic tersebut, maka menghindarinya adalah pilihan yang terbaik.
Selain alt attribute, beberapa tag dan attribut juga bisa di gunakan untuk menyisipkan keyword ke dalam kode. Tulisan ini mencakup satu di antaranya. Tapi sebenarnya masih ada banyak attribut lain. Misalnya bgcolor, yang sering di gunakan pada halaman web untuk menentukan background halaman.
Popularity: 59% [?]
{ 2 comments… read them below or add one }
thx info nya.. sangat bermanfaat utk saya.
thx info nya…