Mengatasi Link tidak dapat dicrawl

Audit Pagespeed Insight

Jika menggunakan CMS Blogger (Blogspot) dengan template responsive v3 dan menemukan satu error pada hasil audit Pagespeed Insight.

Penyebab error

Hal tersebut bisa terjadi dikarenakan terdapat elemen link (<a>) kosong seperti ini :

kode tersebut apabila dirender oleh browser akan menjadi seperti ini :

Kode ini merupakan elemen yang menjadi pokok masalah yang direkam pada screenshot diatas.

Alasan Error

Elemen a:link kosong dapat menyebabkan error dalam audit Pagespeed Insight dikarenakan :

^{Error 1.} Elemen tersebut tidak sesuai dengan format baku kode HTML.
Dalam hal ini elemen tersebut tidak memiliki atribut href.
Inilah yang mengakibatkan error Link tidak dapat di-crawl.

^{Error 2.} Karena elemen tersebut juga tidak terdapat anchor text sehingga tidak memenuhi ketentuan Aksesabilitas antar muka pengguna (UI) yang diberlakukan pada Pagespeed Insight yaitu :
Tidak memiliki nama yang dapat diakses.

Solusi mengatasi Error

Bagaimana cara mengatasi error link tidak dapat di-crawl pada audit Pagespeed Insight agar lolos seperti pada screenshot hasil audit dibawah ini?

Cara mengatasinya adalah cukup dengan melengkapi elemen link (tag : <a>) tersebut agar sesuai dengan format baku kode HTML.

Format baku kode HTML untuk elemen <a> standart adalah memiliki atribut wajibnya yaitu href.

Jadi format HTML baku untuk elemen tersebut adalah sebagai berikut:

<a href='url'/>Anchor Teks</a>

Solusi link tidak dapat di-crawl

Maka untuk mengatasi permasalahan error pertama yaitu Link tidak dapat dicrawl adalah dengan memperbaiki format kode HTML elemen tersebut sehingga menjadi baku seperti kode berikut ini :

<a expr:href='data.post.url' expr:id='data.post.id'/>

Cara tersebut diatas hanya mengatasi masalah link yang tidak dapat di-crawl saja, sedangkan solusi untuk error Link tidak memiliki nama yang dapat diakses memerlukan cara yang berbeda untuk mengatasinya.

Solusi Link tidak memiliki nama yang bisa diakses

Kasus ini sama dengan kondisi tombol yang tidak menggunakan nama teks atau hanya menggunakan ikon saja tanpa teks seperti screenshot dibawah ini.

Untuk mengatasi masalah ini lihat dihalaman postingan Tombol tanpa nama

Markup perbaikan elemen ini tidak akan memberikan pengaruh apapun pada tampilan halaman, Karena:

Atribut awal pada elemen link tersebut tidak berubah dan visibilitas elemen juga tetap tidak terlihat seperti sedia kala.
Sehingga tidak akan menyebabkan perubahan tata letak pada template blog.

⇐ Sebelumnya

Selanjutnya ⇒

Coding Blogger