Membuat Image Logo Valid HTML5 - Pada 2 artikel sebelumnya saya membahas hal yang berkaitan dengan Validasi HTML5, ternyata terus berkelanjutan dengan munculnya pertanyaan sahabat. Karena kemungkinan diperlukan oleh yang lain, maka jawabannya saya alihkan pada postingan ini. Pertanyaan ini datang dari sobat Abdul Ajiz Ridwanzyang mempertanyakan bagaimana membuat header gambar valid HTML5.Yang dimaksudkan header gambar di sini bukan secara keseluruhan atau background image, melainkan logo pada header. Biasanya, penggunaan header image ini akan menyumbangkan 2 error pada validasi HTML. Hal ini dikarenakan adanya width
dan height
yang terpisah. Seperti kita ketahui, seharusnya tinggi dan lebar gambar harus ada pada CSS terpisah atau menggunakan inline CSS sepertistyle='width:212px;height:55px'
.Peringatan error pada Validator W3C kurang lebih seperti ini :
Untuk mengatasi header image yang tidak valid HTML, silahkan cari kode ini
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + "_headerimg"' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/>
Untuk mempermudah gunakan Ctrl+F dan cari potongan kode sepertiimg expr:alt='data:title'
. Kemudian hapus kodeexpr:height='data:height'
dan expr:width='data:width'
sepeti yang saya tandai pada kode di atas.Setelah disave, coba test lagi menggunakan HTML5 validator.