Cara Mengatasi Prioritize Visible Content di PageSpeed Insights

Cara Mengatasi Prioritize Visible Content di PageSpeed Insights

Prioritize Visible Content, atau dalam bahasa Indonesianya Prioritaskan Konten yang Terlihat...

...adalah suatu masalah yang terdapat di Google PageSpeed Insights dikarenakan blog memerlukan perjalanan jaringan tambahan untuk merender bagian atau paro atas suatu laman.

Dengan kata lain, artikel di dalam suatu blog membutuhkan waktu load yang lama dikarenakan ada sesuatu yang harus di load sebelumnya.

Masalah ini sangat penting, karena seperti yang kita tahu, bahwa yang pengunjung inginkan dari blog anda adalah artikelnya. Bila ada sesuatu yang di load dahulu sebelum artikelnya, sudah pasti waktu load artikel menjadi lambat dan bisa saja pengunjung kabur dari blog anda.

Sangat berbahaya! Hal ini dapat menambah bounce rate di blog anda.

Jadi, sebenarnya sampai sini kita sudah mengetahui apa arti dari masalah "Prioritaskan Konten yang Terlihat" ini...

...yaitu kita harus mengatur agar blog kita meload bagian konten terlebih dahulu, baru bagian-bagian lainnya.

Nah, yang jadi pertanyaannya adalah bagaimana caranya? Sebelum ke caranya, masalah ini saya bagi menjadi 2, yaitu:
  1. Jika sidebar diload terlebih dahulu
  2. Jika widget pihak ketiga diload terlebih dahulu

Langsung saja, berikut ketiga solusi dari masalah diatas.

1. Sidebar yang diload terlebih dahulu


Seperti yang kita ketahui, bahwa sidebar pasti letaknya disamping isi konten alias artikel. Selain itu, kegunaan sidebar ini hanyalah sebagai pendukung, berbeda dengan artikel yang memang menjadi suatu kewajiban dari sebuah blog.

Biasanya, sidebar ini waktu loadnya cukup lama, bisa mencapai 2x lipat lebih lama dibandingkan dengan waktu load artikel.

Mengapa?

Karena sidebarnya memiliki banyak widget, seperti widget brlangganan via E-Mail, widget sosial media, sticky widget, dan masih banyak lagi. Sedangkan seperti yang kita ketahui bahwa widget-widget ini memerlukan banyak sumber daya (seperti HTML, CSS, bahkan Javascript).

Apa jadinya bila kita meload sidebar lebih dahulu ketimbang isi artikel?

Sudah pasti pengunjung dengan koneksi internet yang lambat akan kabur dari blog anda...

Jadi, solusi yang tepat untuk masalah ini adalah dengan cara menempatkan script HTML sidebar di blog anda dibawah script HTML untuk postingan. Untuk lebih jelasnya silahkan anda simak contoh susunan HTML blog dibawah ini.

<html>

  <head> ... </head>

  <body>

     <header> ... </header>   <!-- Ini script HTML untuk header dan menu navigasi -->

       <div class='sidebar'> ... </div>   <!-- Bisa kita lihat, ini script sidebar -->
       <div class='main'> ... </div>      <!-- dan ini script postingan... -->

  </body>

</html>

Seperti itulah contoh HTML blog dengan sidebar yang di load terlebih dahulu. Bila ternyata susunan HTML di blog anda seperti itu juga, ada baiknya anda mengubah susunan HTML tersebut menjadi seperti ini:

<html>

  <head> ... </head>

  <body>

     <header> ... </header>   <!-- Ini script HTML untuk header dan menu navigasi -->

       <div class='main'> ... </div>   <!-- Sekarang postingan di-load terlebih dahulu -->
       <div class='sidebar'> ... </div>      <!-- lalu sidebar yang di load... -->

  </body>

</html>

Selesai, sekarang coba anda cek blog anda di Google PageSpeed Insights. Bila masalah masih tetap muncul, silahkan anda lanjutkan ke poin nomor 2 berikut ini.

2. Widget lain yang diload terlebih dahulu (sebelum postingan)


Nah, kasus kedua ini berbeda dengan kasus yang pertama. Jika biasanya widget diload dan dipasang bersamaan dengan sidebar, widget yang kali ini dipasang secara manual didalam HTML. Contohnya seperti ini:

<html>

  <head> ... </head>

  <body>

     <header> ... </header>

       <div class='ini widgetnya'> ... </div>   <!-- Ini widgetnya -->

       <div class='main'> ... </div>
       <div class='sidebar'> ... </div>

  </body>

</html>

Widget seperti diatas tidak bisa anda pindahkan, karena bila anda pindahkan, widget tersebut nantinya juga akan berpindah tempat pada saat anda lihat di blog anda.

Jadi, solusi untuk masalah ini hanyalah meminimalisir penggunaan widget yang menurut anda tidak terlalu penting.

Bagaimana? Apakah masalah sudah terselesaikan? Semoga cara diatas dapat menyelesaikan masalah ini dan blog anda sudah lebih ringan. Juga, jangan segan-segan untuk berkomentar bila masalah belum terselesaikan!

Jumat, Juni 30, 2017 - 6 komentar

6 komentar untuk Cara Mengatasi Prioritize Visible Content di PageSpeed Insights.

Silakan masukkan komentar anda. Jangan habiskan waktu hanya untuk melakukan SPAM disini.


Perlihatkan Semua Komentar Tutup Semua Komentar
.
Raja khayal
Jumat, 27 Oktober 2017 01.27.00 WITA

Oke, makasih infonya.

Balas Hapus
.
Topik Ramdani
Senin, 25 Desember 2017 09.32.00 WITA

tengkyu bang, kebetulan blog ane lelet banget nih, pas di cek di PageSpeed Tools-nya Google salah satu penyebabnya karena Prioritize Visible Content ini :(

Balas Hapus