Mempercepat template blog menjadi secepat AMP

Selamat Datang di Blog Orang IT. Segala sesuatu didunia ini pasti ada harganya , jika para blogger menginginkan sebuah template dengan desain yang elegan, cantik dan ramai pernak-pernik hingga hiasan gadged maka mereka harus menambahkan script-script tertentu kedalam template blog dan hal itu membuat blog menjadi lebih lambat saat diakses

Sementara kita tau bahwa google think my site mematok batas kecepatan pemuatan website pada perangkat seluler selama 0,8 detik sebagai excellent! dan 3 detik sebagai sangat lambat/slowly

Ini bukanlah mitos atau opini para pakar SEO karena google sendiri telah mengonfirmasi akan hal itu

Cek google tes my site : https://www.thinkwithgoogle.com/feature/testmysite

Baca google confirm first index : https://webmasters.googleblog.com/2018/01/using-page-speed-in-mobile-search.html

Ini seperti ajang balapan moto GP di lintasan, dimana motor paling cepatlah yang meraih posisi tertinggi dan motor yang menempati posisi terakhir akan memperoleh peringkat yang rendah

Tidak peduli meskipun template anda telah mengadopsi AMP atau menggunakan template terbaru blogger pada akhirnya yang paling cepatlah yang akan menjadi prioritas dan memiliki peluang lebih besar untuk mendapatkan peringkat secara SEO

Semakin cepat halaman website dimuat maka google akan memberikan dorongan diperingkat seluler/dekstop , tetapi semakin lambat website dimuat maka google akan mengabaikan peringkatnya dihalaman pencarian karena dianggap dapat memberikan pengalaman buruk bagi pengguna

Blog yang lambat saat dimuat hanya memberikan kerugian seperti membuang waktu berharga , menghabiskan kuota dan meninggalkan kesan tidak nyaman

Kalaupun ada visitor organik yang nyasar keblog kita, itu tidak akan bertahan lama setelah mengetahui halaman anda lambat mereka akan langsung kembali kehasil pencarian , ini memberikan signal pada google bahwa konten anda tidak relevan

Efeknya peringkat situs akan diturunkan secara bertahap seiring pertumbuhan kompetitor dan semakin rendah peringkat anda maka kesempatan mendapatkan visitor organik bisa berarti mustahil

Para pengguna mungkin mampir ke blog milik kompetitor dan tinggal disana selama beberapa menit karena kompetitor lebih melayani pengguna dari pada anda

Ibaratnya seperti pengunjung restoran yang tertahan didepan pintu maka mereka merasa tidak dihargai dan pergi , tetapi kalau anda persilahkan duduk dan memberikan segelas air putih mereka akan menunggu

Artinya selambat-lambatnya template blog anda minimal halaman paruh atas untuk konten harus dimuat terlebih dahulu , baru sisanya seperti header dan iklan dimuat belakangan

Sebenarnya gadged jenis apapun pada dasarnya mengurangi performa blog , tetapi untuk gadged follower itu benar-benar harus disingkirkan. Coba anda pasang gadged follower blog atau disqus kemudian uji kecepatan web anda di GTmetrix

Periksa dibagian YSlow dan lihat prioritas link yang disarankan agar pengguna meremove gadged follower. Sama halnya ketika anda menguji pada alat google pagespeed insight

Mengapa gadged follower dianggap berat? karena saat ditampilkan mereka akan memuat seluruh link dari profile pengikut termasuk gambar avatar dari daftar pengikut , sementara beberapa blog lawas memiliki ratusan pengikut

Keberadaan gadged pengikut sebenarnya tidak terlalu penting dimasa sekarang ini seperti halnya ketika anda mengikuti blog saya maka anda bisa langsung menambahkan melalui dashboard blogger > daftar bacaan > add url blog saya www.helmykediri.com dan simpan

Begitu saja saya rasa cukup bagi pengikut yang ingin melihat daftar konten terbaru milik Blog Orang IT , selebihnya keberadaan gadged follower ini hanya dimanfaatkan segilintir orang untuk mendapatkan tautan link

Memasang gadged follower kedalam blog akan mengurangi kecepatan loading blog sebesar 10% sementara sampai saat ini belum ada langkah jitu untuk mengatasi hal ini dan beberapa creator bahkan melepasnya dan hanya menyediakan gadged ringan seperti “ikuti via email”

Faktor kecepatan menjadi hal yang vital bagi blog dimasa kini oleh sebab itu jika anda menginginkan kecepatan yang optimal dalam alat pengujian disarankan untuk menghapus gadged follower. Ini tidak berguna meski menunjukkan seberapa populernya blog anda nyatanya pengunjung tidak begitu peduli

Untuk memanjakan pengguna bukan dengan menyediakan gadged follower tetapi bisa diganti dengan gadged ikuti by email yang lebih ringan serta aktiflah dalam menjawab pertanyaan pengunjung situs

Pasang gadged umum seperti popular post , label dan arsip blog yang memang terkenal ringan juga membantu pengunjung dalam mengeksplore konten menarik lainnya

Saya juga mengusulkan agar mencopot banner atau logo yang mengarah ke blog orang lain , ini biasanya digunakan oleh beberapa blog yang saling berpartner meski skema two way link seperti ini cukup riskan

Lagi pula itu tidak berguna , sebuah link yang muncul disemua halaman dan tidak relevan hanya memicu pelanggaran google terkait sideway lebih lanjut

Ini juga bisa dianggap sebagai upaya jual beli tautan yang intinya harus saling menguntungkan, praktik semacam ini sudah lama mati tapi beberapa blogger modern masih mengulasnya dan menjadikan teknik SEO jadul ini populer kembali

Misalnya dalam footer saya memberikan link kedalam logo+link url keblog lain maka link sideway dapat memicu pelanggaran google karena muncul disemua halaman dan tidak relevan dengan isi. Apalagi sebagai si empunya backlink, para spammer menginginkan linknya disetel dalam attribut dofollow

Namun mengingat semakin majunya algoritma google termasuk update pinguin yang menangani masalah tautan , pembuatan partner berupa logo hanya menurunkan performa website dan merusak SEO OnPage

Seiring berkembangnya algoritma google membuat para pelaku spammer / saling bertukar link partner tidak di untungkan meski niatnya baik yakni saling merekomendasikan tetapi apagunanya kalau justru tautan link yang lebih rendah menjadi beban website anda untuk naik diserp

Keberadaan fitur sosial share sangat penting bagi sebuah blog karena memudahkan pembaca berbagi tautan ke akun sosial media mereka. Tetapi tahukah anda bahwa addthis merupakan layanan pihak ketiga penyedia fitur sosial share paling populer saat ini ?

Berbagai jenis button sosial share mulai dari melayang , horizontal , vertical , shadow mereka dukung dan juga sejak matinya google plus kemarin juga dibarengi dengan hilangnya button googleplus dari addthis

Keberadaan addthis sangat berguna untuk blog-blog bertemakan newsletter dan melengkapi fitur related post dan membantu meningkatkan traffic. Kenyataanya pemasangan addthis ini akan mengurangi kecepatan blog hingga 12% atau lebih berat 2% ketimbang gadged follower

Jangan memasang tombol berbagi kesosial media dari addthis jika anda sayang dengan performa blog abahkan template default bawaan blogger tidak menyediakan tombol berbagi

Meski demikian dalam setiap komentar kita selalu menambahkan sederet kalimat harapan yang berbunyi ” jika anda merasa terbantu dengan artikel ini mungkin keluarga serta teman anda juga demikian, oleh sebab itu bagikan pos ini ke akun sosial media …”

Ada alternatif addthis yakni addtoany , bedanya script dari addtoany sangat ringan berbeda dengan addthis dan mereka juga menyediakan daftar platform sosial media yang lengkap

Hingga saat ini addtoany belum menghapus button berbagi lewat googleplus padahal layanan itu sudah mati , mungkin sedang menunggu hari H nya sampai diperbaharui oleh pengembang hehe addtoany hanya mengurangi beban blog sebesar 4% lebih ringan ketimbang addthis

Cara kerja API dari ke dua layanan sosial share ini mungkin sedikit berbeda dan addthis memiliki banyak fitur menarik yang dibutuhkan tetapi apabila anda menyukai bentuk sosial share yang simpel, ringan dan memenuhi ekspetasi pengguna untuk memudahkan dalam berbagi artikel maka addtoany bisa menjadi alternatif yang saya rekomendasikan

Jika kebetulan anda menguasai sedikit pemrograman HTML maka membuat sendiri tombol berbagi dengan versi yang lebih sederhana bisa menjadi pilihan ketimbang memasukkan banyak script padahal fokus utamanya hanyalah fitur berbagi pos

Jika sebelumnya saya membahas tentang gadged yang bisa di otak-atik melalui menu tataletak , kali ini kita harus merombak template didalam menu edit HTML

Agar blog bisa menampilkan link awsome maka didalam template blog tepatnya didalam tag head harus dipasang link awsome

Anda bisa meletakkan link pemanggil ikon dan link font awsome tepat diatas tag </head nah begini linknya

<link rel=”stylesheet”

href=”http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css”>

Apakah anda pernah melihatnya ? coba lakukan pengujian di GTmetrix dibagian Yslow anda akan melihat kode ini membebani kecepatan blog hingga beberapa puluh Kb, sekalian proses dari seluruh halaman disederhanakan dalam sekali pemanggilan

Bagi anda yang tidak begitu menyukai pernak pernik mengapa harus menanamkan script pemanggil awsome didalam blog ? bukankah ini hanya memperlambat waktu pemuatan halaman ? lebih baik memasang template blogger sederhana dan menghias langsung melalui menu tataletak

Misalnya dalam template ini sang creator memasang link pemanggil untuk font awsome 5 yang katanya lebih kompatibel dengan HTML versi 5 , berikut linknya :

<link rel=”stylesheet” href=”https://use.fontawesome.com/releases/v5.8.1/css/all.css” integrity=”sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf” crossorigin=”anonymous”/>

Meski terbilang lebih ringan namun tetap saja mengurangi performa blog sehingga saya menghapusnya melalui halaman editor HML, semua dilakukan demi mencapai target penilaian excellent!

Sedikit trik CSS akan membantu membuat blog terlihat sedikit berwarna dan indah

Berikut ini beberapa contoh elemen-elemen yang dapat dimanipulasi dengan CSS , edit melalui jendela HTML editor :

> Border dash , saya menggunakan perintah CSS untuk membuat style , border kemudian mewarnainya juga membuat bentuk lengkung dengan bulatannya

> Mengurangi penggunaan javascipt kalau sekedar dipakai untuk hiasan kecuali dibagian navigasi untuk mendukung menu dropdown

> Mewarnai dengan CSS menggunakan kode HEX , RGB kemudian mengkombinasikan antara dua warna

Hapus seluruh javascript yang dinilai tidak berguna , sisakan satu saja untuk mengaktifkan fungsi menu dropdown jika anda memilikinya kalau tidak hapus sekalian

Ada juga alternatif webassembly yang katanya jauh lebih cepat ketimbang javasript tapi itu nanti dulu saya belum mencoba

Intinya jika ingin meningkatkan kecepatan blog kurangi penggunaan javascript sebanyak-banyaknya terkadang pemasangan javascript berlebihan memberatkan loading blog juga mempengaruhi perilaku penampilan halaman web yang buruk

Ini contoh penerapan javacript yang mendukung menu didalam tag <body

<script>

function myFunction() {

  var x = document.getElementById(&quot;Header1&quot;);

  if (x.className === &quot;topnav&quot;) {

    x.className += &quot; responsive&quot;;

  } else {

    x.className = &quot;topnav&quot;;

  }

}

</script>

Sebelum menerbitkan kiriman silahkan diconvert/dirubah format gambar menjadi webp. Format gambar webp dianggap lebih ringan ketimbang JPG atau PNG. 

Bahwa secara langsung dari pihak google dan para mastah menyarankan untuk menggunakan format gambar webp terbaru yang katanya lebih ringan dan kompatibel terhadap seluruh peramban web browser

Webp merupakan project gambar digital terbaru dari google meski project ini sudah dimulai sejak lama sekitar 2010-an dan baru digembor-gemborkan kepublik pada awal 2019

Webp memiliki kemampuan tingkat tinggi untuk mereduksi ukuran gambar hingga 25% tanpa nyaris kehilangan kualitasnya kalau dibandingkan format gambar JPG dan PNG

Jika anda adalah seorang pengembang web maka menggunakan format gambar webp akan mempercepat situs yang anda buat. webp juga mendukung gambar bergerak alias animasi seperti pada format gambar GIF (format animasi tertua dengan batasan warna 225) yang tidak bisa dilakukan oleh gambar JPG dan PNG

Kabar baiknya hampir seluruh browser versi terbaru telah mendukung format gambar webp mengingat format gambar ini cukup disarankan langsung oleh google kepada para pengembang.

Untuk mengconvert gambar ke webp silahkan download aplikasinya diplaystore atau cari saja layanan digoogle, saya yakin ada banyak orang membuat fitur semacam ini

Google sangat merekomendasikan model AMP dan pengunaan format gambar webp yang bertujuan untuk mengoptimalkan kecepatan blog saat dimuat , lagi pula tidak ada gunanyan debat kusir terkait pengaruh kecepatan terhadap peringkat mengingat google telah mengonnfirmasinya berulang kali

Template blog yang didesain cepat akan memenangkan persaingan , itu karena seberapapun bagus konten dan backlink yang anda miliki akan percuma saja kalau blog lambat saat diakses

Blog yang memiliki loading cepat memiliki banyak keuntungan selain dorongan peringkat juga cepat saat proses perayapan google bot karena struktur pembangun template yang sederhana

Seperti balapan motor GP dimana yang paling cepatlah menempati peringkat pertama dan yang paling lambat menempati peringkat terakhir bahkan sering diabaikan oleh para sponsor, begitu juga dalam blogging saat kompetitor anda mengerahkan segalanya, anda juga harus melakukan perubahan kearah yang lebih baik

Sekian dan terimakasih, https://helmykediri.com