By : Surabaya Web Design

Sebagai penyedia jasa design web, maka Anda harus dapat membuat website dengan waktu load yang cepat. Dalam tujuan untuk memahami mengapa begitu penting untuk memiliki sebuah situs web yang cepat, cobalah perhatikan statistik berikut ini: pengguna smartphone rata-rata akan meninggalkan situs web jika tidak memuat dalam waktu 3 detik, Google sekarang menganggap kecepatan memuat halaman adalah pertimbangan utama untuk peringkat mesin pencari, 75% dari pengguna internet setuju bahwa mereka tidak akan kembali ke situs web jika tidak memuat dalam waktu 4 detik. Oleh karena itu, penyedia jasa design web harus mempunyai kemampuan untuk membuat website dengan waktu load yang cepat. Berikut ini adalah beberapa langkah untuk mempercepat waktu load website :

Memahami Website Load Times

Waktu akses website secara langsung berkorelasi dengan permintaan yang dibuat pada server untuk memuat situs web. Semakin banyak HTTP request yang dibuat untuk server dan semakin lama elemen - elemen di-render, semakin akan semakin lambat website. Contoh - contoh dari HTTP requests adalah

• loading CSS style sheets;
• loading scripts;
• loading images;
• loading HTML.

Faktor lain yang menentukan dalam waktu load website adalah ukuran file individual dan gambar. Gambar dengan ukuran yang besar dan dengan resolusi tinggi dapat menghabiskan waktu 10x lebih lama hanya untuk memuat gambar normal. File yang tidak begitu penting dengan ukuran yang besar juga  secara drastis dapat memperlambat rendering halaman.

Pelacakan Kecepatan Halaman

Penyedia jasa design web dapat melacak skor kecepatan halaman melalui Google's Page Speed Insight untuk pencarian dan Yahoo YSlow. Google juga memiliki plugin untuk melacak kecepatan halaman yang bekerja dengan baik dengan Firefox ketika Firebug diinstal.

Langkah 1: kompres gambar

Langkah nomor satu adalah kompres semua gambar untuk kualitas berbasis web. Anda dapat melakukan ini dengan menggunakan kompresor gambar bawaan yang dibangun dalam Plugin Page Speed ​​Google. Simpan versi gambar yang sudag terkompres ke folder lokal pada komputer Anda dan meng-upload ulang gambar tersebut pada tempat semula.

Langkah 2: Ukuran gambar

Setelah melakukan kompres gambar , Anda kemudian perlu memodifikasi gambar sehingga mereka dapat disesuaikan dengan baik untuk website. Hal ini untuk menghindari server lag yang terjadi ketika mengubah ukuran. Anda dapat mengubah ukuran gambar di Photoshop dengan menyesuaikan ukuran mereka ke dimensi pixel yang sama yang digunakan dalam kode HTML Anda.

Langkah 3: memanfaatkan caching Browser

 Caching Browser menyimpan versi cache sumber daya statis. Ini mempercepat kecepatan halaman dengan pesat dan mengurangi server lag. Untuk mengaktifkan caching, Anda dapat menambahkan kode berikut ke .htaccess file:

# BEGIN Expire headers
ExpiresActive On
ExpiresDefault "access plus 1 seconds"
ExpiresByType image/jpeg "access plus 2592000 seconds"
ExpiresByType image/png "access plus 2592000 seconds"
ExpiresByType image/gif "access plus 2592000 seconds"
ExpiresByType text/css "access plus 604800 seconds"
ExpiresByType text/javascript "access plus 604800 seconds"
ExpiresByType application/javascript "access plus 604800 seconds"
ExpiresByType text/html "access plus 2592000 seconds"
# END Expire headers 

Langkah 4: menggabungkan gambar dalam CSS sprite

Gambar dapat dikombinasikan menjadi CSS sprite untuk mengurangi jumlah gambar dimuat pada halaman tertentu. CSS sprite pada dasarnya satu gambar besar yang terdiri dari sejumlah gambar yang lebih kecil. Menggabungkan 5 foto menjadi satu CSS sprite adalah cara cepat untuk mempercepat website dengan memungkinkan browser untuk memuat satu gambar bukan 5. Cara termudah untuk menciptakan CSS sprite adalah dengan menggunakan SpriteMe. Pastikan untuk membuat perubahan yang tepat untuk CSS Anda setelah menciptakan gambar sprite. Juga, perhatikan petunjuk instalasi di website. Program ini digunakan dengan mengakses bookmark melalui browser Anda.

Langkah 5: menunda parsing JavaScript

Javascript yang terletak di bagian atas dari dokumen HTML dapat memblokir rendering halaman yang memperlambat halaman sangat. Dalam rangka untuk menunda parsing Javascript, yang terbaik adalah memanggil skrip tersebut pada akhir dokumen HTML daripada di awal. Anda juga dapat menunda parsing Javascript dengan menggunakan menunda atribut. The menunda atribut digunakan dalam kode HTML untuk menunda parsing dari javascript sampai halaman dibuka. Sebagai contoh:

<script type="text/javascript" src="includes/general.js" defer="defer"></script>