Kelebihan Menggunakan SVG bagi Blog

Keuntungan Menggunakan SVG - Penggunaan gambar dalam sebuah artikel sudah menjadi hal yang sangat normal dilakukan. Kita bisa dengan mudah memasukkan gambar sesuka hati baik sebagai thumbnail maupun sebagai gambar pelengkap.

Ada banyak sekali jenis ekstensi gambar yang ada saat ini, mulai dari JPG, PNG, webP, GIF, hingga SVG. Khusus untuk nama terakhir, SVG banyak direkomendasikan akhir-akhir ini sebagai format gambar yang paling terbaik untuk digunakan.

Anggapan tersebut bukan tanpa alasan, banyak yang berpendapat bahwa SVG memiliki ukuran yang jauh lebih kecil dibandingkan dengan jenis format lainnya. Tapi untuk lebih lengkapnya, silahkan menyimak pembahasan berikut.

Rekomendasi: Cara Memasang Lazy Load Google Analytics di Blog

Apa itu SVG?

SVG atau Scalable Vector Graphics adalah salah satu jenis format gambar yang menggunakan kode XML dalam menampilkan vektor dua dimensi. Dari pengertiannya saja, kita bisa mengetahui bahwa SVG akan selalu responsif di berbagai ukuran perangkat tanpa mengurangi kualitas visualnya.

Untuk proses pembuatan, setidaknya dibutuhkan keahlian khusus dalam bidang pemrograman. Atau, Anda juga bisa menggunakan generator-generator yg banyak tersedia di internet.

Oh iya, format ini juga telah didukung di berbagai jenis browser populer seperti Chrome, Firefox, hingga Internet Explorer. Browser tersebut dapat dengan mudah membaca SVG dalam waktu sepersekian detik saja.

Bagaimana SVG Bekerja?

Seperti yang telah dijelaskan di atas, SVG bekerja dengan cara menampilkan visual berdasarkan kode XML. Anda bisa dengan mudah mengatur tampilan seperti tinggi, lebar, warna, corak, lengkungan, dan masih banyak yang lainnya.

Berikut adalah contoh kode SVG:

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g transform="translate(3.000000, 3.000000)"><path d="M9,0 C6.96384545,0 6.77134103,3.54652262 5.55911318,4.79957421 C4.34688533,6.05262581 0.578198764,4.61991709 0.0545867365,6.84402682 C-0.467925266,9.06927362 2.92235261,9.82428837 3.34036221,11.7334296 C3.76057187,13.6425708 1.68922429,16.3249199 3.45916494,17.6598406 C5.2291056,18.9936242 7.13434937,15.9747022 9,15.9747022 C10.8656351,15.9747022 12.7708788,18.9936242 14.5408195,17.6598406 C16.3107602,16.3249199 14.2405126,13.6425708 14.6596222,11.7334296 C15.0787319,9.82428837 18.4679097,9.06927362 17.9453977,6.84402682 C17.4228857,4.61991709 13.6530991,6.05262581 12.4419713,4.79957421 C11.2297434,3.54652262 11.036139,0 9,0 Z"></path></g></svg>

Rekomendasi: Pentingnya Meta Tag dalam Optimasi SEO

Kelebihan Menggunakan SVG bagi Blog

1. Responsif

Salah satu keunggulan SVG yang paling banyak dingaungkan oleh penggunanya adalah ukuran yang bersifat responsif (tidak tetap). Gambar akan selalu mengikuti ukuran layar perangkat bahkan saat diperbesar sekalipun tanpa kehilangan kualitasnya.

Berbeda dengan format JPG, PNG, atau webP, gambar terkesan buram saat dibuka di perangkat yang lebih lebar.

2. Ukuran Lebih Kecil

Saat menggunakan gambar, kita kadang dibuat bingung dengan besarnya ukuran file yang akan digunakan. Gambar sudah sesuai dan menarik, eh ukurannya buset.

Penggunaan elemen tertentu yang berlebihan dalam HTML tentu tidak dianjurkan untuk dilakukan. Bagaimana tidak, semakin besar ukuran file yang ada, semakin lama pula halaman akan dimuat.

Hal tersebut tentu akan membuat pembaca merasa bosan atau bahkan diberikan peringkat yang rendah oleh mesin pencari.

3. Keren dan Menarik

Selain bisa digunakan sebagai gambar postingan, SVG juga banyak digunakan sebagai penghias dari suatu elemen. Utamanya pada bagian menu atau header seperti yang Anda lihat sekarang.

Selain karena fungsinya, tampilan yang disediakan juga dapat membuat blog semakin keren dan menarik.

4. SEO Friendly

Tahukah kamu, SVG ternyata tidak memberikan efek merugikan bagi blog. Dengan ukurannya yang sangat kecil dan hanya berbentuk XML dapat membuat mesin pencari lebih mudah dalam membacanya.

Selain itu, SVG juga dapat mempertegas komponen apa yang ada di diluarnya. Contoh, saat Anda memasang ikon rumah pada menu navigasi, maka pembaca dan mesin pencari juga akan tahu bahwa elemen terkait merupakan tautan beranda.

Dengan begitu, tingkat pengalaman pembaca saat berkunjung juga akan lebih baik.

Rekomendasi: Cara Defer JS Iklan Mgid di Blog

Penutup

Dengan semua keuntungan yang bisa didapatkan di atas, Anda kini bisa lebih tahu kapan harus menggunakan format ini. Ada banyak penyedia jasa yang bisa direkomendasikan, salah satunya adalah Flaticon.

Cukup sekian artikel tentang Kelebihan Menggunakan SVG bagi Blog ini, Terima kasih.