01 · Lab eksperimen UI
Interface Lab
Klaim tentang desain antarmuka diubah menjadi eksperimen yang bisa mendukung atau menggugurkannya di browser.
Buka Interface Lab (membuka tab baru)- Bentuk
- Situs riset: 7 eksperimen, 28 prinsip, 37 referensi
- Akses
- Publik
- Pengujian
- Observasi browser tercatat; eksperimen 007 direplikasi di 3 browser engine
- Pemakaian
- Belum diukur
Eksperimen 007 · Reflow di 320 px
Salah satu prinsip lab ini ditandai “sudah dicek” tanpa pernah diukur. Berikut jejak pengukurannya, termasuk satu koreksi pada alat ukurnya.
Pertanyaan · 3 Okt 2026
Lab mengklaim halamannya reflow di lebar 320 CSS piksel, lebar yang dipakai WCAG 2.2. Klaim itu ditandai “sudah dicek”, tetapi belum pernah diukur.
Apakah konten tetap utuh di 320 px, tanpa scroll ke dua arah, bahkan saat efek visual menyala?
Prinsip dan sumbernya (Interface Lab, membuka tab baru)Hipotesis, ditulis sebelum demo
Tiga varian. A dan C seharusnya tidak overflow. B sengaja dibuat gagal, supaya terbukti alat ukurnya bisa mendeteksi kegagalan.
Gugur jika A overflow lebih dari 1 px, jika C overflow sedikit pun, atau jika B lolos.
Hipotesis (Interface Lab, membuka tab baru)Koreksi
Pengukuran pertama menghitung caption tabel khusus screen reader sebagai “konten terpotong”. Pemeriksaannya diperbaiki agar mengabaikan elemen yang memang sengaja disembunyikan.
Hanya kolom elemen terpotong yang berubah: A dan C dari 1 menjadi 0, B dari 2 menjadi 1.
Hasil
Chrome 154, tiga kali run: A dan C overflow 0 px; B +308 px. Pemeriksaan 24 route di 320 × 568 menemukan 0 px di semuanya. Verdict: didukung.
Observasi (Interface Lab, membuka tab baru)Replikasi, di hari yang sama
Firefox 155 dan WebKit 26.6 memberi angka yang identik. Pemeriksaan diperluas ke ke-84 route: 0 px di kedua engine.
Temuan dan batasannya (Interface Lab, membuka tab baru)Belum diketahui
Baru lima jenis komponen yang diuji. Belum ada peta, canvas, video, atau editor; belum ada perangkat nyata atau screen reader; zoom 400% hanya diargumentasikan, belum dijalankan.
Situsnya sejak itu diterjemahkan ke bahasa Inggris, jadi angka ini bersifat historis sampai diukur ulang.
Pertanyaan berikutnya
Apakah spesimen yang bisa dioperasikan membantu orang menjelaskan reflow lebih akurat daripada gambar statis yang setara? Protokolnya sudah ditulis. Belum ada partisipan.
Varian B · Kontrol kaku
Sengaja dibuat gagal: root 480 px, tabel 560 px.
- Overflow panggung
- +308 px
- Komponen yang overflow
- 5 dari 5
- Elemen terpotong
- 1