Memperbaiki Kesalahan CSS dan Javascript di Blog

Pernahkah anda memeriksa kecepatan blog atau website anda di Pagespeed ?
Jika belum segeralah periksa kecepatan blog atau website anda di situs tersebut.
Banyak sekali keuntungan yang akan anda dapat dari memeriksa kecepatan loading blog atau website anda di Pagespeed. Diantaranya anda akan ditunjukan beberapa kesalahan dari blog atau website anda dan cara memperbaikinya. Umumnya kesalahan yang sering terjadi adalah pada struktur CSS dan Javascript blog atay website. Struktur CSS dan Javascrip yang diletakkan eksternal di dalam elemen template blogger anda akan memperlambat loading blog atau website anda jika diakses oleh pengunjung baik lewat desktop ataupun lewat mobile device.
Di bawah ini merupakan nilai dari blog atau website yang coba ditest dengan Pagespeed.

mempercepat loading blog anda


Anda dapat mengetahui nilai dari blog atau website anda jika diakses menggunakan perangkat mobile maupun computer desktop disertai petunjuk memperbaikinya. Hebat bukan ?
Seperti yang saya bilang tadi kesalahan yang sering dilakukan oleh seorang blogger adalah meletakkan elemen CSS dan javascript eksternal di dalam template blogger anda.

1. Apa itu CSS dan Javascript Eksternal ?
2. Apakah juga ada CSS dan Javascript internal ?

Untuk dapat membedakan antara struktur javascript eksternal dan internal  di html template blog anda caranya cukup mudah. Javascript eksternal paling sering jumpai di blogger terletak di antara kode <head> dan </head>tapi tidak menutup kemungkinan javascript juga di letakkan di antara <body> dan </body>. Bentuk javascript eksternal nya adalah seperti di bawah ini (lihat kode script yang berwarna biru):

<?xml version="1.0" encoding="UTF-8" ?>

<!DOCTYPE html>
<html>
<head>
<script type='text/javascript' src='https://dl.dropboxusercontent.com/s/e5p8j4qnfvgda8p/3%20in%201
%20Widget.js'/> 
</head>
<body>

Kode body blogger di sini.
</body>
</html>

Perhatikan struktur kode di atas. Struktur javascript di atas berjenis eksternal. Karena kode yang berwarna biru merupakan tempat dimana kode javascript diletakkan. Pada kasus di atas file widget.js terletak di luar hosting blog yaitu di dropbox. Intinya javascrip ataupun css eksternal tempat penyimpanan kodenya terletak di luar hostingan blog.
Sedangkan javascript eksternal kodenya berada di dalam template blogger anda.

Sebelum melangkah lebih jauh untuk memperbaiki CSS dan Javascript di blog anda, anda harus melihat kesalahan blog anda terlebih dahulu di Pagespeed.

memperbaiki kesalahan css dan javascript di pagespeed

Gambar di atas tampak beberapa file javascript yang bermasalah di blog atau website. Kesalahan yang muncul karena file javascript tersebut berjenis eksternal. Cara untuk memperbaiki kesalahan di atas dengan mengubah javascrip tersebut menjadi bersifat internal.

Bagaimana cara merubah javascript eksternal menjadi internal ?

== Copy terlebih dahulu alamat file javascript yang bermasalah tadi lalu pastekan ke address bar di browser anda.
Kurang lebih hasilnya akan muncul kode javascript seperti ini :

merubah javascript eksternal ke internal

== Copy seluruh kode javascript tersebut.
== Cari kode file javascript yang bermasalah tersebut di editor template blog anda. Gunakan bantuan ctrl+F untuk menemukan file javascript tadi.
== Jika sudah ketemu ganti kode file javascript tersebut dengan kode javascript yang barusan anda copy. Namun sebelumnya tambahkan kode :
&lt;script type=&#039;text/javascript&#039;&gt;


&lt;/script&gt;

== Kurang lebih nanti hasilnya seperti di bawah ini :
&lt;script type=&#039;text/javascript&#039;&gt;
jQuery(document).ready(function () { jQuery("#facebook_right").hover(function () { jQuery(this).stop(true, false).animate({ right: 0 }, 500); }, function () { jQuery("#facebook_right").stop(true, false).animate({ right: -200 }, 500); });
dan seterusnya dan seterusnya.......... 
&lt;/script&gt;

Langkah terakhir adalah simpang template blog anda.
Semoga Berhasil.
Load disqus comments

0 komentar