fbpx

Apa Itu Alt Text? Bagaimana Ia Berfungsi?

Alt Text atau Teks Alternatif, juga dikenal dengan sebutan Alt Attributes dan Alt Descriptions, adalah penjelasan memadai yang digunakan dalam kode HTML untuk mendeskripsikan tampilan dan fungsi gambar atau halaman.

Menambahkan Alt Text pada gambar adalah prinsip utama dalam aksesibilitas website atau blog. Alt Text sering diabaikan dalam pencantumannya. Website biasanya dipenuhi dengan gambar yang hilang, keliru, gagal diproses ketika loading, dan lainnya. Seperti prinsip aksesibilitas website pada umumnya, menentukan kelayakan Alt Text sebenarnya sangat subjektif. Melalui penjelasan ini, saya hendak menjelaskan pengalaman saya mencantumkan Alt Text.

Dasar-Dasar Alt Text
Alt Text menyajikan alternatif tekstual pada konten yang bukan teks di laman website. Konten yang bukan teks tersebut bisa berupa gambar dengan segala jenis dan ekstensinya. Selain di website, Alt Text juga dapat dicantumkan di PowerPoint, pdf, dan dokumen digital lainnya yang dapat diakses melalui pembaca layar oleh penyandang disabilitas visual atau penyandang disabilitas kognitif.

Alt Text dapat berfungsi sebagai berikut:

  1. Dapat dibaca oleh pembaca layar semisal JAWs Screen Reader. Alt Text tersebut bisa berupa Alt Text sebagai konten atau sebagai fungsi;
  2. Dapat menampilkan teks pada lokasi gambar yang gagal loading atau ketika pengguna atau pengakses memilih untuk tidak menampilkan gambar;
  3. Alt Text menyajikan makna semantik dan deskripsi gambar yang dapat dibaca oleh mesin pencari atau sekedar menjelaskan isi dari gambar.

Prinsip dari penggunaan Alt Text adalah karena komputer, ponsel pintar, dan pembaca layar tidak dapat menganalisis atau menjelaskan gambar. Pengembang atau admin website dan media sosial harus mencantumkan Alt Text yang menjelaskan fungsi atau konten, tergantung tujuan dari gambar tersebut.

Alt Text dapat disertakan pada gambar dengan dua cara:
1. Di dalam elemen gambar yang disertai kolom Alt Text;
2. Di dekat sekitar gambar tersebut jika website tidak menyediakan kolom Alt Text.

Menuliskan Alt Text

Menambahkan Alt Text pada icon atau gambar sebagai fungsi berbeda dengan gambar sebagai konten. Alt Text gambar atau icon sebagai fungsi tidak diisi dengan penjelasan mengenai tampilan gambar atau icon tersebut, namun diisi dengan fungsi keduanya, seperti “klik icon ini untuk menuju Home” pada icon home.

Sedangkan pada gambar sebagai konten di website berasis WordPress sangat mudah. Ketika kita menguggah gambar, kolom Alt Text sudah disediakan di sisi kanan gambar di barisan yang sama dengan judul dan penjelasan gambar. Kita tidak perlu mencari kode HTML yang biasanya tertulis alt=””. Meski demikian, kita juga perlu mengeceknya kembali apakah Alt Text yang kita cantumkan berfungsi dengan baik atau tidak. Contoh berikut adalah tempat Alt Text pada gambar di WordPress.

Gambar contoh untuk menambahkan Alt Text di WordPress.

Sedangkan pada media sosial seperti Facebook dan Instagram, kita juga sudah disediakan kolom yang dapat kita isi dengan Alt Text. Begitu juga dengan Microsoft Power Point dan di Microsoft Word.

Alt text di Microsoft Word dan PowerPoint dapat dicantumkan dengan menambahkannya pada Format > Picture dari menu dropdown. Untuk menampilkan pilihan ini, kita dapat mengklik kanan gambar di Word atau PowerPoint lalu mengklik “Format Picture”. Kemudian klik “Alt Text”, salah satu dari pilihan di tampilan tersebut. Di Microsoft Word atau Power Point versi tahun 2007 agar sedikit berbeda, kolom Alt Text tersedia dengan cara klik kanan gambar, lalu “Size”, lalu “Alt Text”.

Contoh gambar untuk menambahkan Alt Text di Microsoft Word atau Power Point.

Dari sini kita dapat memastikan bahwa website, blog, dokumen yang kita buat di Word, PowerPoint, atau PDF, dan di media sosial seperti Facebook dan Instagram aksesibel bagi penyandang disabilitas visual atau penyandang disabilitas kognisi.

Open chat
1
Need help?
PLD UB
Hello, can we help you?