Manakah format gambar terbaik untuk situs WordPress Anda?

Diterbitkan: 2022-04-21

Memiliki gambar yang menarik, jelas, dan memuat dengan cepat di situs WordPress Anda adalah salah satu cara paling efektif untuk menarik pengguna/pelanggan. Ada alasan mengapa dealer mobil menghabiskan begitu banyak waktu untuk memastikan bahwa model baru itu bersih dan berkilau. Dampak visual dari suatu produk seringkali dapat menjadi keputusan membuat atau menghancurkan antara sukses dan gagal. Ruang pamer online tidak berbeda, ditambah ada komplikasi tambahan tentang bagaimana gambar dapat memengaruhi kecepatan pemuatan Anda. Ini adalah metrik yang digunakan dengan baik dan terkenal, bahwa pengguna akan meninggalkan situs web jika memuat lebih dari 3 detik. Jika situs web membutuhkan waktu lebih dari 3 detik untuk dimuat, maka ada kemungkinan besar bahwa gambar yang Anda miliki di situs Anda adalah bagian dari alasan itu.

Jadi sebagai pemilik situs WordPress, apa yang dapat Anda lakukan untuk memastikan bahwa gambar yang Anda miliki di situs Anda menarik bagi pengguna dan memungkinkan situs Anda memuat dengan cepat. Naluri awal Anda mungkin hanya mengecilkan gambar dari gambar ukuran 1800x1400 menjadi gambar ukuran 300x200. Ini akan menjadi tindakan yang salah untuk diambil, karena sementara ukuran file gambar Anda sekarang mungkin jauh lebih kecil, kualitas gambar dan pengalaman pengguna telah menurun sebagai akibatnya. Jika Anda memiliki situs web penjualan showroom mobil misalnya, pelanggan akan ingin melihat mobil dengan sangat baik dan dapat melihat semua fitur dan detailnya. Dengan membuat gambar menjadi jauh lebih kecil, pemeriksaan detail mobil sekarang tidak mungkin – membuat calon pelanggan frustrasi dan mencari di tempat lain.

Jadi apa pilihan Anda? Untungnya, ada lusinan opsi file gambar berbeda yang dapat Anda pilih, mulai dari kualitas tinggi, tetapi ukuran file besar BMP, JPEG yang telah dicoba dan diuji, hingga format WebP yang baru dan tidak dikenal secara luas. Selain memilih format yang tepat, penting untuk diingat bahwa apa pun format yang Anda pilih, Anda juga dapat mengurangi ukuran file gambar dengan menggunakan proses melalui WP-Optimize yang dikenal sebagai "kompresi".

Kecepatan situs adalah salah satu dari 10 faktor terpenting yang diamati oleh bot Google yang merayapi situs web Anda saat mereka memeringkat situs Anda dalam hasil pencarian. Memiliki kecepatan pemuatan yang buruk dapat berdampak buruk pada peringkat situs Anda dan dapat dengan mudah membawa situs Anda dari halaman pertama, hingga gagal diindeks oleh Google. Google sangat ketat dalam menentukan peringkat situs dalam algoritme pencarian mereka dan jika mereka menemukan bahwa situs tersebut menawarkan pengalaman pengguna yang buruk karena waktu pemuatan yang lambat, mereka bahkan mungkin tidak mengalami kesulitan untuk merayapinya dan membuatnya dapat ditemukan melalui pencarian Google .

Format gambar mana yang harus Anda pilih?

Karena gambar berkualitas tinggi sangat penting untuk situs web WordPress modern mana pun, Anda perlu mengetahui format mana yang akan digunakan, bagaimana gambar tersebut memengaruhi kinerja situs Anda, dan cara mendapatkan yang terbaik dari pilihan file Anda.

Dua format file gambar paling populer untuk situs web adalah PNG dan JPEG/JPG. Menurut w3techs , lebih dari 70% dari semua situs web menggunakan jenis file ini. Sekitar 30% situs menggunakan SVG dan 22% menggunakan GIF.

Di sinilah jenis file gambar akan berperan karena jenis file yang Anda gunakan untuk mengunggah gambar memainkan peran penting. Karena ada begitu banyak jenis file yang berbeda, kami akan membahas yang paling populer dan pro dan kontranya di bawah ini:

Sebelum kita masuk ke dalam jenis file kita perlu memahami beberapa konsep sebelumnya, seperti apa gambar raster dan bitmap itu? Apa itu kompresi? Apa perbedaan antara kompresi lossy dan lossless?

Kompresi – Lossy Vs Lossless

Kedua jenis kompresi ditujukan untuk mengurangi ukuran file, tetapi apa yang mereka hapus yang benar-benar penting. Dalam kompresi Lossy; data penting yang relevan dengan kualitas gambar dihapus. Ini dapat tercermin dalam gambar yang menjadi piksel dalam beberapa kasus karena komputer Anda dapat mengalami masalah saat merekonstruksi gambar.

Dalam kompresi lossless, data tidak relevan yang ada dalam gambar (seperti metadata) dikurangi, yang membantu mengurangi ukuran file. Kualitas gambar tidak terpengaruh sama sekali dalam proses ini.

Raster Vs Vektor

Jenis file gambar yang paling umum digunakan biasanya berbasis raster. Ini berarti bahwa mereka memiliki nilai warna RGB tetap yang terkait dengan setiap piksel dan semua piksel tersebut digabungkan dan digunakan untuk membuat keseluruhan gambar.

Contoh format file tersebut termasuk jpg, png, dan gif.

Sebagai alternatif, gambar vektor dibuat menggunakan bentuk dan garis yang dapat diskalakan tanpa batas tanpa piksel. Vektor dibuat menggunakan rumus matematika yang memungkinkan pengguna untuk mengubah nilai, tanpa mempengaruhi kualitas gambar.

Sekarang kita telah membahas dasar-dasar gambar, sekarang kita dapat melihat detail dari berbagai jenis file.

JPEG:

Ini adalah format gambar digital yang berisi data gambar terkompresi. Dengan rasio kompresi 10:1, gambar JPEG digunakan karena sangat ringkas. Format JPEG berisi detail gambar penting dan merupakan format gambar paling populer untuk berbagi foto dan gambar lainnya di internet. Ukuran file gambar JPEG yang kecil juga memungkinkan pengguna menyimpan ribuan gambar (misalnya di situs seni) tanpa memerlukan ruang penyimpanan tambahan di situs Anda.

JPEG adalah jenis file kompresi lossy yang berfungsi dengan baik untuk foto, tetapi disarankan agar Anda menggunakan format lain saat mengerjakan grafik, seperti PNG.

Contoh file gambar JPEG. Anda dapat melihat bahwa detail dan kualitas telah dipertahankan saat mengunggah.

PNG:

PNG adalah format gambar bitmap yang populer dan merupakan kependekan dari "Portable Graphics Format". Format ini dibuat sebagai alternatif dari Graphics Interchange Format (GIF). PNG memiliki beberapa fitur hebat seperti berisi palet warna RGB 24-bit, gambar skala abu-abu, dan menampilkan latar belakang transparan. Metode kompresi data lossless juga digunakan dalam gambar PNG saat mengerjakan gambar atau grafik berkualitas tinggi. Gambar PNG juga sering digunakan dalam Pengeditan gambar karena dapat memberi pengguna lebih banyak kontrol dan opsi pada gambar dibandingkan format JPEG tradisional.

PNG juga menggunakan algoritma kompresi lossless, yang berarti format ini dapat menyimpan lebih banyak data daripada JPG. Saat menggunakan file gambar PNG, pengguna juga dapat menyimpan gambar tersebut dengan latar belakang transparan. Dengan menggunakan format ini, pengguna memiliki pilihan untuk bekerja dengan gambar berlapis yang dapat menunjukkan latar belakang yang jelas (misalnya – hanya bunga pada gambar di bawah dan bukan dinding latar belakang), memungkinkan pengguna untuk menambahkan gambar ke gambar lain tanpa perlu untuk memotongnya dan menghapus latar belakang yang ada – seperti yang harus Anda lakukan dengan gambar JPEG. Ini adalah salah satu alasan utama mengapa ini adalah pilihan yang lebih disukai untuk grafik seperti diagram dan ilustrasi. PNG dikenal lebih populer bagi pengguna yang bekerja dengan grafik, daripada mengunggah foto standar.

Gambar PNG mempertahankan kualitas tinggi, sekaligus memungkinkan Anda untuk memiliki kontrol lebih besar atas gambar

GIF:

Anda mungkin paling tahu istilah "GIF" dari klip pendek yang tak terhitung jumlahnya yang Anda kirim di aplikasi perpesanan. GIF adalah singkatan dari "Graphics Interchange Format" dan sebagian besar digunakan untuk mendukung animasi tanpa audio

Tidak seperti JPEG dan PNG, GIF digunakan dalam kasus yang lebih khusus dan biasanya tidak digunakan untuk gambar statis (walaupun ini mungkin). Jika Anda menggunakan GIF di situs WordPress Anda, kemungkinan besar untuk menunjukkan kepada Anda animasi atau proses sederhana kepada pengunjung. GIF memiliki rentang warna yang terbatas dan paling baik digunakan untuk grafik sederhana. Mereka menggunakan kompresi lossless dan cenderung lebih kecil dari JPG. Umumnya disarankan agar Anda hanya menggunakan GIF dengan hemat di situs Anda, karena dapat meningkatkan waktu pemuatan (mengingat ukuran file) dan dibatasi hingga 256 warna.

Contoh gambar GIF. Kualitas gambar asli telah sangat dikurangi untuk menghasilkan animasi.

SVG:

Scalable Vector Graphics (SVG) adalah format file vektor ramah web. Berbeda dengan file gambar raster berbasis piksel seperti JPEG, file vektor menyimpan gambar melalui rumus matematika berdasarkan titik dan garis pada kotak. Ini berarti bahwa file vektor seperti SVG dapat diubah ukurannya secara signifikan tanpa kehilangan kualitasnya, yang membuatnya ideal untuk logo dan grafik online yang kompleks.

Vektor paling baik hanya untuk grafik, bentuk, dan ilustrasi sederhana. SVG adalah pilihan yang baik untuk logo, terutama jika Anda ingin logo Anda responsif dan didukung oleh sebagian besar browser termasuk Chrome, Firefox, Edge, dan Opera.

Contoh bunga matahari dalam format SVG yang akan Anda gunakan untuk logo.

BMP:

BITMAP sekarang dianggap sebagai format gambar yang ketinggalan zaman. BMP memuat gambar dalam format gambar lossless yang dapat menghasilkan ukuran file yang sangat besar karena kurangnya kompresi. Mempertimbangkan pentingnya kecepatan memuat dan bagaimana pembuat situs ingin menjaga ukuran gambar seminimal mungkin (belum lagi popularitas format SVG dan JPEG), format ini sebagian besar tidak digunakan untuk gambar online.

Kualitas asli gambar dipertahankan saat mengunggah dalam format BMP, tetapi ukuran file akan sangat memperlambat situs Anda dan tidak disarankan.

WebP:

Format gambar ini dibuat oleh Google pada tahun 2010 dan mulai populer di kalangan orang-orang yang mengunggah banyak gambar ke situs mereka karena memiliki beberapa keunggulan dibandingkan JPEG dan PNG, seperti memiliki kinerja kompresi lossy dan lossless yang lebih baik.

WebP juga biasanya mengunggah dalam ukuran file yang lebih kecil daripada format JPEG atau PNG karena kinerja kompresinya yang ditingkatkan dan akan memakan lebih sedikit ruang di situs Anda – memungkinkannya memuat lebih cepat. Meskipun tidak didukung oleh semua browser, ini didukung oleh semua browser paling populer – termasuk Chrome, Firefox, Edge, dan Opera.

Meskipun tidak begitu dikenal seperti JPEG dan PNG, WebP dapat menjadi format gambar pilihan di masa depan.

Kesimpulan:

Ada banyak jenis format gambar yang dapat digunakan di situs WordPress Anda, tetapi penting untuk mengevaluasi tujuan gambar. Jika situs Anda untuk fotografer pernikahan misalnya, Anda ingin mempertahankan gambar berkualitas tinggi yang masih dimuat dengan cepat dan ramah pengguna ( JPEG ). Namun, jika Anda menjual gambar di toko poster online, maka Anda harus menjaga detail dan informasi gambar sebanyak mungkin ( PNG ).

Sebagai aturan umum, jika Anda hanya mengunggah gambar standar untuk toko online, blog, portofolio, media sosial, atau situs media sosial Anda – maka Anda disarankan untuk mengunggah gambar dalam format JPEG standar dan kemudian menggunakan WP-Optimize untuk lebih mengompresi gambar Anda

Namun, jika Anda ingin membuktikan gambar Anda di masa depan dan meningkatkan kecepatan pemuatan Anda sebanyak mungkin, maka WebP dapat menawarkan kompresi lossy dan lossless yang superior, sambil tetap mempertahankan tingkat detail yang tinggi. Apa pun yang Anda putuskan, ingatlah untuk selalu mengompres gambar Anda menggunakan WP-Optimize untuk kompresi terdepan di pasar.