π Status Plugin
Test 1: Hover Text Sederhana
Hover teks ini untuk mendengar screen reader!
Paragraf dengan aria-label (hover saya!)
Test 2: Element dengan Title
Hover saya untuk dengar title attribute
Test 3: Link dan Interaktif
Klik link ini (hover untuk dengar)Link Tambahan untuk Struktur Halaman
π§ͺ Manual Test
π Console Output
π Instruksi Testing
- Pastikan dev server running (npm run dev)
- Cek "Status Plugin" di atas - harus β
- Klik button aksesibilitas di pojok kanan bawah
- Aktifkan "Screen Reader" dari menu
- Hover teks-teks di atas untuk dengar suara
- Cek console output di bawah untuk debug info
π¬ Test Animasi & Gambar:
- "Animasi dijeda" β Semua animasi berhenti (bounce, rotate, fade, dll)
- "Sembunyikan Gambar" β Gambar jadi transparan & grayscale
- Widget plugin tetap berfungsi normal (tidak terpengaruh)
β οΈ Testing Fitur Animasi & Gambar
Scroll ke bawah untuk melihat berbagai jenis animasi dan gambar. Gunakan menu aksesibilitas untuk menguji fitur "Animasi dijeda" dan "Sembunyikan Gambar".
π¨ Test Animasi - Rotating Icon
Expected: Icon berputar 360Β°. Saat "Animasi dijeda" aktif β icon berhenti berputar.
β¨ Test Animasi - Fade & Pulse
Expected: Teks fade & box pulse. Saat "Animasi dijeda" aktif β semua berhenti.
π Test Animasi - Rainbow Text
Expected: Warna berubah merahβorangeβkuningβhijauβbiru. Saat "Animasi dijeda" aktif β warna freeze.
π Gradient Animation Box
Expected: Background gradien bergerak. Saat "Animasi dijeda" aktif β gradien berhenti bergerak.
πΌοΈ Test Gambar - Image Gallery
Test: Aktifkan "Sembunyikan Gambar" dari menu aksesibilitas.
Expected: Gambar hilang sepenuhnya (display: none).
πͺ Test Kombinasi - Gambar + Animasi
Test kombinasi kedua fitur:
| Fitur | Expected Behavior |
|---|---|
| "Animasi dijeda" | Gambar berhenti berputar/bounce (tapi tetap terlihat jelas) |
| "Sembunyikan Gambar" | Gambar hilang sepenuhnya (tidak terlihat sama sekali) |
| Keduanya aktif | Gambar hilang + animasi berhenti |
π Test Animasi - Shake
Expected: Kotak goyang kiri-kanan terus-menerus. Saat "Animasi dijeda" aktif β kotak berhenti goyang.
π Testing Paragraf Teks
Gunakan paragraf di bawah untuk menguji fitur "Teks Lebih Besar", "Spasi Teks", "Tinggi garis", dan "Perataan Teks".
π Paragraf Demo - Bahasa Indonesia
Indonesia adalah negara kepulauan terbesar di dunia yang memiliki lebih dari 17.000 pulau. Terletak di antara dua benua dan dua samudra, Indonesia memiliki posisi strategis yang sangat penting dalam perdagangan internasional. Keberagaman budaya, bahasa, dan tradisi menjadi kekayaan yang luar biasa bagi bangsa Indonesia.
Dengan populasi lebih dari 270 juta jiwa, Indonesia merupakan negara dengan populasi terbesar keempat di dunia. Keberagaman ini tercermin dalam semboyan "Bhinneka Tunggal Ika" yang berarti berbeda-beda tetapi tetap satu. Masyarakat Indonesia terdiri dari berbagai suku bangsa, agama, dan bahasa daerah yang hidup berdampingan secara harmonis.
Kekayaan alam Indonesia sangat melimpah, mulai dari hasil tambang, perkebunan, hingga kelautan. Indonesia juga dikenal sebagai negara dengan keanekaragaman hayati tertinggi kedua di dunia setelah Brasil. Hutan hujan tropis Indonesia menjadi rumah bagi ribuan spesies flora dan fauna yang unik dan langka.
π Paragraf Demo - Teknologi
Perkembangan teknologi informasi di era digital saat ini mengalami kemajuan yang sangat pesat. Transformasi digital telah mengubah cara manusia berkomunikasi, bekerja, dan menjalani kehidupan sehari-hari. Internet dan smartphone menjadi bagian yang tidak terpisahkan dari kehidupan modern.
Kecerdasan buatan (Artificial Intelligence) dan pembelajaran mesin (Machine Learning) telah membuka peluang baru dalam berbagai bidang. Dari otomasi industri hingga asisten virtual, teknologi AI membantu meningkatkan efisiensi dan produktivitas. Inovasi ini terus berkembang dan memberikan dampak signifikan terhadap berbagai sektor kehidupan.
Aksesibilitas digital menjadi semakin penting untuk memastikan bahwa semua orang, termasuk penyandang disabilitas, dapat mengakses dan menggunakan teknologi dengan mudah. Fitur aksesibilitas seperti screen reader, kontras tinggi, dan navigasi keyboard membantu menciptakan pengalaman digital yang inklusif bagi semua pengguna.
π Paragraf Demo - Pendidikan
Rata Kiri (Default): Pendidikan adalah kunci untuk membuka pintu masa depan yang lebih cerah. Melalui pendidikan, seseorang dapat mengembangkan potensi diri, meningkatkan kualitas hidup, dan berkontribusi positif bagi masyarakat. Sistem pendidikan yang berkualitas akan menghasilkan generasi yang cerdas, kreatif, dan berkarakter.
Rata Tengah: Literasi digital menjadi kompetensi penting di abad 21. Kemampuan untuk menggunakan teknologi, mengakses informasi, dan berpikir kritis sangat diperlukan dalam menghadapi tantangan global. Pendidikan harus mengintegrasikan teknologi untuk mempersiapkan siswa menghadapi masa depan.
Rata Kanan: Guru memiliki peran vital dalam membentuk karakter dan kompetensi peserta didik. Mereka tidak hanya mentransfer ilmu pengetahuan, tetapi juga menjadi inspirator dan motivator bagi siswa. Profesi guru memerlukan dedikasi, kesabaran, dan komitmen yang tinggi.
Rata Kanan-Kiri (Justify): Pembelajaran sepanjang hayat (lifelong learning) menjadi konsep penting di era yang terus berubah ini. Setiap individu perlu terus belajar dan mengembangkan keterampilan baru untuk tetap relevan. Pendidikan tidak berhenti di bangku sekolah atau universitas, tetapi berlanjut sepanjang hidup. Teknologi memfasilitasi pembelajaran mandiri melalui berbagai platform online, kursus digital, dan sumber belajar yang mudah diakses. Dengan demikian, setiap orang memiliki kesempatan untuk terus berkembang dan meningkatkan kompetensinya.
π¨ Paragraf Demo - Seni & Budaya
Seni dan budaya merupakan cerminan dari identitas suatu bangsa. Indonesia memiliki kekayaan seni dan budaya yang sangat beragam, mulai dari tarian tradisional, musik daerah, hingga kerajinan tangan yang unik. Setiap daerah memiliki ciri khas budaya yang berbeda-beda namun tetap menyatu dalam kerangka Negara Kesatuan Republik Indonesia.
Wayang, batik, angklung, dan berbagai warisan budaya Indonesia telah diakui oleh UNESCO sebagai warisan budaya dunia. Pengakuan ini menunjukkan bahwa kebudayaan Indonesia memiliki nilai universal yang tinggi dan perlu dilestarikan. Generasi muda memiliki tanggung jawab untuk menjaga dan mengembangkan warisan budaya ini agar tidak punah.
Festival seni dan budaya yang rutin diselenggarakan di berbagai daerah menjadi sarana untuk mempromosikan dan melestarikan kekayaan budaya lokal. Melalui festival ini, masyarakat dapat mengenal dan mengapresiasi keberagaman budaya Indonesia. Pelestarian budaya harus diimbangi dengan inovasi agar tetap relevan dengan perkembangan zaman.
π‘ Paragraf Demo - Singkat
Ini adalah paragraf singkat untuk testing.
Paragraf ini sedikit lebih panjang dengan beberapa kata tambahan untuk variasi.
Paragraf medium: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.
π’ Paragraf Demo - List & Numbering
Manfaat Aksesibilitas Digital:
- Memungkinkan penyandang disabilitas untuk mengakses informasi dan layanan digital dengan mudah
- Meningkatkan pengalaman pengguna (user experience) untuk semua orang, bukan hanya penyandang disabilitas
- Memperluas jangkauan audiens dan meningkatkan inklusivitas produk digital
- Memenuhi standar dan regulasi aksesibilitas seperti WCAG (Web Content Accessibility Guidelines)
- Meningkatkan SEO (Search Engine Optimization) karena konten yang accessible lebih mudah dipahami oleh mesin pencari
Fitur Aksesibilitas Umum:
- Screen Reader - Membaca konten teks dengan suara
- Kontras Tinggi - Meningkatkan kontras warna untuk kemudahan membaca
- Teks Lebih Besar - Memperbesar ukuran font
- Navigasi Keyboard - Navigasi tanpa menggunakan mouse
- Subtitle & Caption - Teks untuk konten audio/video
β Testing Checklist
| Fitur | Testing Target | Status |
|---|---|---|
| Teks Lebih Besar | Paragraf membesar 110%, 120%, 130% | βͺ |
| Spasi Teks | Jarak huruf & kata bertambah | βͺ |
| Tinggi Garis | Jarak antar baris 1.5x, 1.75x, 2x | βͺ |
| Perataan Teks | Kiri, Tengah, Kanan, Justify | βͺ |
| Baca Diperlambat | Hover paragraf untuk mendengar suara | βͺ |