Digital Transformation
Mixed Content
TL;DR: Mixed content terjadi ketika sebuah halaman dimuat lewat HTTPS, tetapi sebagian resource (gambar, skrip, iframe) masih ditarik lewat HTTP biasa. Browser modern memblokir resource aktif (skrip, CSS) secara otomatis dan menampilkan peringatan untuk resource pasif (gambar, video). Bagi pengguna, situs terlihat "tidak aman" meski sertifikat SSL valid.
Apa itu Mixed Content?
Saat browser memuat https://vitoatmo.com, ia mengharapkan seluruh sub-resource juga datang lewat HTTPS. Jika tag <img src="http://example.com/foto.jpg"> muncul di halaman, browser mengklasifikasikan ini sebagai passive mixed content. Untuk <script src="http://...">, ini active mixed content yang langsung diblokir Chrome, Firefox, dan Safari karena dapat dipakai man-in-the-middle untuk menyisipkan kode.
Untuk konteks pemula, situasi ini seperti rumah dengan pintu utama berkunci kuat tetapi jendela samping dibiarkan terbuka. Penyusup tinggal mencari celah HTTP untuk mengubah konten yang dilihat pengguna.
Sumber Umum Mixed Content
| Sumber | Tipe | Risiko |
|---|---|---|
Gambar lawas yang di-hardcode http:// | Passive | Warning di address bar |
| Embed video pihak ketiga | Active | Diblokir, tidak tampil |
| Widget chat/analytics versi lama | Active | Diblokir, fitur mati |
| Tag iframe newsletter | Active | Diblokir total |
| Link redirect insecure | Passive | Risiko sniffing |
Praktik standar yang saya pakai sejak 2022: pakai header Content-Security-Policy: upgrade-insecure-requests agar browser otomatis mengkonversi http:// jadi https:// saat memuat resource yang sama domainnya.
Kenapa Penting?
Personal brand dan website bisnis Indonesia sering pindah dari hosting lama berbasis HTTP ke platform modern berbasis HTTPS. Sisa-sisa link HTTP di database konten lama membuat halaman menampilkan peringatan keamanan, menurunkan trust pengunjung dan sinyal E-E-A-T. Google Search Console juga melaporkan mixed content sebagai issue HTTPS yang dapat memengaruhi crawl. Dokumentasi web.dev menempatkan eliminasi mixed content sebagai langkah dasar migrasi HTTPS.
Pertanyaan Umum
Bagaimana cara mendeteksi mixed content di website saya?
Buka Chrome DevTools, tab Console. Cari pesan "Mixed Content". Atau pakai laporan HTTPS di Google Search Console dan tools seperti whynopadlock.com.
Apakah mixed content memengaruhi SEO?
Secara langsung tidak signifikan, tetapi Google membaca sinyal HTTPS sebagai bagian dari trust. Halaman dengan warning insecure cenderung memiliki bounce rate lebih tinggi yang berdampak pada peringkat jangka panjang.
Istilah Terkait