Cara Membuat File BIMI SVG Tiny P/S (Panduan 2026)

Brand Indicators for Message Identification (BIMI) menampilkan logo organisasi Anda di samping pesan yang telah diautentikasi pada klien email yang mendukung fitur ini. Untuk mempublikasikan rekaman BIMI, Anda harus menyediakan file logo yang sesuai dengan profil XML terbatas yang disebut SVG Tiny Portable/Secure (P/S).

Artikel ini menjelaskan persyaratan profil SVG Tiny P/S, elemen-elemen yang harus Anda hapus dari file sumber, dan metode yang dapat Anda gunakan untuk menghasilkan logo yang sesuai untuk aplikasi Verified Mark Certificate (VMC) Anda.

Alasan Keamanan di Balik SVG Tiny P/S

W3C mendefinisikan profil SVG Tiny P/S untuk menghilangkan risiko keamanan dari rendering grafik vektor di dalam klien email [1]. SVG standar mendukung scripting, pemuatan sumber daya eksternal, dan permintaan jaringan. Klien email yang merender SVG standar mengekspos penerima terhadap serangan cross-site scripting (XSS) dan piksel pelacakan yang tertanam dalam isi pesan.

SVG Tiny P/S menghapus semua kemampuan dinamis dan eksternal. Hasilnya adalah file statis dan mandiri yang hanya mendeskripsikan geometri.

Elemen yang Dilarang

Elemen-elemen berikut menyebabkan validasi W3C gagal. Certificate Authority akan menolak aplikasi VMC yang menyertakan elemen-elemen ini.

Jenis Elemen	Alasan Pelarangan
Tag <script>	Mencegah eksekusi JavaScript dan serangan XSS
Tag <image>	Mencegah penyematan grafik raster (PNG/JPG) yang dapat menyembunyikan kode berbahaya
URI data:image	Mencegah penyematan bitmap yang di-encode Base64
xlink:href	Mencegah permintaan jaringan eksternal (piksel pelacakan)
Dimensi relatif	Mencegah pergeseran tata letak; atribut width dan height harus dihapus
CSS eksternal	Mencegah injeksi stylesheet eksternal

Persyaratan Matematis

AuthIndicators Working Group mendefinisikan batasan geometris yang memastikan logo dirender dengan benar di berbagai klien email, termasuk klien yang menerapkan masking berbentuk lingkaran, persegi, atau persegi dengan sudut membulat [2].

1. Rasio Aspek 1:1

Logo harus berbentuk persegi. Atur atribut viewBox ke ruang koordinat 1:1, misalnya viewBox="0 0 100 100". Hapus atribut width dan height. Hanya viewBox yang mengontrol penskalaan.

2. Latar Belakang Solid

Latar belakang transparan tidak diizinkan. Klien email beralih antara tema terang dan gelap, dan logo transparan dapat menjadi tidak terlihat pada salah satu latar belakang. Sertakan elemen <rect> solid yang menutupi seluruh viewBox.

3. Metadata yang Diperlukan

Deklarasikan kepatuhan dalam elemen root <svg> dengan mengatur version="1.2" dan baseProfile="tiny-ps". Sertakan elemen <title> untuk memenuhi persyaratan aksesibilitas.

Cara Menghasilkan File yang Sesuai

Alat desain standar, termasuk Adobe Illustrator dan Figma, tidak mengekspor langsung ke SVG Tiny P/S. Anda memiliki dua pilihan: membersihkan file secara manual, atau menggunakan alat konversi.

Metode Manual

Untuk membersihkan ekspor SVG secara manual, buka file tersebut di editor teks dan selesaikan langkah-langkah berikut:

1. Hapus semua tag terlarang yang tercantum dalam tabel sebelumnya.
2. Konversi styling CSS ke atribut presentasi inline.
3. Hitung ulang viewBox ke rasio 1:1.
4. Tambahkan metadata version, baseProfile, dan <title> yang diperlukan.
5. Validasi output terhadap skema W3C SVG Tiny 1.2.

Perkirakan beberapa kali proses validasi. Kesalahan kecil pada nama atribut atau deklarasi namespace akan menyebabkan validasi gagal.

Metode Otomatis

Alat konversi seperti makeBIMI melakukan setiap langkah secara terprogram:

1. Vektorisasi: Jika Anda mengunggah gambar raster (PNG atau JPG), alat ini akan menelusuri piksel menjadi path vektor.
2. Sanitasi: Alat ini menghapus tag <script>, <image>, dan referensi eksternal.
3. Penerapan geometri: Alat ini menerapkan bounding box 1:1 dan latar belakang solid.
4. Validasi: Alat ini memvalidasi output terhadap skema W3C SVG Tiny P/S.

File SVG merupakan prasyarat untuk aplikasi VMC. Setelah Anda menghasilkan file yang sesuai, lanjutkan dengan audit penerapan DMARC dan kirimkan file tersebut ke Certificate Authority yang didukung.

Referensi

[1] W3C. “SVG Tiny 1.2 Portable/Secure.” World Wide Web Consortium, https://www.w3.org/TR/SVGTiny12/ [2] AuthIndicators Working Group. “BIMI SVG Logo Requirements.” BIMI Group, https://bimigroup.org/svg-logo-requirements/