Font di Tag Head mengakibatkan Error Validasi HTML5. Sepengetahuan saya hal ini sebelumnya tidak terjadi. Entah perbaikan, atau bug pada validator. Soalnya saya coba di Validator yang lain aman-aman saja.
Sebetulnya cara validasi HTML5 pada Link Font di Head sudah dijelaskan pada postingan Kompi Ajaib (baca : Link Font di Head Blog Error Validasi HTML5). Kalau saya simpulkan yaitu dengan dua alternatif yaitu :
1. Memisahkan masing-masing font.
2. Menggunakan @font-face pada CSS.
Rasa penasaran menyelimuti perasaan saya, kenapa bisa error validasi? Sebelum kepada penyebab error, saya contohkan link font yang error seperti ini :
<link href='http://fonts.googleapis.com/css?family=Roboto:400,300,400italic,500,700|Ropa+Sans|Oswald' rel='stylesheet' type='text/css'/>Pesan yang muncul pada validator seperti ini :
Bad value http://fonts.googleapis.com/css?family=Roboto:400,300,400italic,500,700|Ropa+Sans|Oswald for attribute href on element link: Illegal character in query: not a URL code point.
Selidik punya selidik ternyata permasalahannya ada pada tanda pembatas antar font (|) harus di escape menjadi %7C. Permasalahnnya sama dengan tanda & harus dirubah menjadi &. Jadi dari kode error di atas harus dirubah menjadi
<link href='http://fonts.googleapis.com/css?family=Roboto:400,300,400italic,500,700%7CRopa+Sans%7COswald' rel='stylesheet' type='text/css'/>
Itulah solusi yang saya tambahkan dari postingan Kang Adhy "Kompi Ajaib" Suryadi. Silahkan sobat memilih cara mana yang akan digunakan.
Semoga bermanfaat...
SUMBER
0 Komentar