Web Accessibility Academy · Pelajaran

Kelompokkan Kolom dengan fieldset dan legend

Gabungkan kontrol terkait seperti kelompok radio dengan benar.

Pelajaran 3 dari 413 langkah

Kelompokkan Kolom dengan fieldset dan legend adalah pelajaran Web Accessibility Academy gratis di CoddyKit. Ini adalah pelajaran 3 dari 4. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar Web Accessibility Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus Web Accessibility Academy mencakup 4 pelajaran total.

Beberapa Bidang Perlu Dikelompokkan

Sekumpulan tombol radio atau kotak centang terkait merupakan satu pertanyaan, bukan banyak pertanyaan. Elemen fieldset mengelompokkannya sebagai satu kesatuan. 🧩

Grup Membutuhkan Nama

Setiap kontrol memiliki label sendiri, tetapi seluruh grup juga membutuhkan satu label. legend memberikan pertanyaan bersama untuk kumpulan tersebut.

legend Berada di Awal

legend harus menjadi anak pertama dari fieldset. Elemen ini berfungsi sebagai keterangan yang dihubungkan pembaca layar dengan setiap kontrol di dalamnya.

<fieldset>
  <legend>Shipping speed</legend>
</fieldset>

Grup Radio yang Lengkap

Di sini, fieldset membungkus pilihan dan legend mengajukan pertanyaan. Setiap radio tetap memiliki labelnya sendiri.

<fieldset>
  <legend>Size</legend>
  <label><input type="radio" name="s"> Small</label>
  <label><input type="radio" name="s"> Large</label>
</fieldset>

Yang Didengar Pembaca Layar

Saat berpindah ke radio yang dikelompokkan, pembaca layar mengumumkan legend beserta pilihannya, misalnya Ukuran, Kecil. Konteks diperoleh secara otomatis.

Radio adalah Contoh Klasik

Tombol radio yang memiliki nama sama adalah penggunaan yang umum. Tanpa fieldset, pengguna mendengar pilihan tanpa mengetahui pertanyaan yang dijawab.

Kumpulan Kotak Centang Juga

Daftar pilihan ganda seperti Pilih minat Anda juga merupakan sebuah grup. fieldset menghubungkan kotak centang dengan satu instruksi bersama.

Pisahkan Input Tunggal

Bidang alamat yang dipecah menjadi beberapa input juga memperoleh manfaat. legend seperti Alamat penagihan memberikan konteks untuk seluruh bagian.

Jangan Menggunakannya Berlebihan

Satu input teks tidak membutuhkan fieldset. Gunakan pengelompokan hanya untuk bidang yang benar-benar menjawab satu pertanyaan secara bersama-sama.

Gaya Dapat Diubah dengan Bebas

Garis tepi bawaan terlihat ketinggalan zaman, tetapi Anda dapat mengubah gayanya dengan bebas menggunakan CSS. Semantik tetap utuh, apa pun tampilannya.

ARIA adalah Pilihan Terakhir

Jika fieldset yang sebenarnya tidak memungkinkan, role group dengan aria-labelledby dapat menirunya. Namun, utamakan elemen bawaan jika memungkinkan.

Pemeriksaan Singkat

Elemen apa yang memberi nama pada fieldset untuk teknologi bantu?

Rangkuman

Bungkus kontrol yang saling terkait dalam fieldset dan beri keterangan dengan legend. Kumpulan radio dan kotak centang memperoleh konteks yang dapat diandalkan setiap pengguna. ✅

Gratis untuk memulai

Belajar HTML dengan tutor AI — gratis

Tulis dan jalankan kode asli di browser kamu, dapatkan bantuan instan dari tutor AI 24/7, dan lanjutkan di mana kamu tinggalkan di web atau aplikasi.

Kursus
30
Pelajaran
120

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Kelompokkan Kolom dengan fieldset dan legend” gratis?

Ya — teks lengkap “Kelompokkan Kolom dengan fieldset dan legend” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus Web Accessibility Academy, upgrade ke CoddyKit PRO. Kursus Web Accessibility Academy mencakup 4 pelajaran total.

Apa yang akan aku pelajari di “Kelompokkan Kolom dengan fieldset dan legend”?

Gabungkan kontrol terkait seperti kelompok radio dengan benar. Kamu berlatih Web Accessibility Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.

Apakah aku perlu pengalaman untuk memulai Web Accessibility Academy?

Tidak diperlukan pengalaman sebelumnya. Web Accessibility Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 3 dari 4.

Berapa lama pelajaran “Kelompokkan Kolom dengan fieldset dan legend” memakan waktu?

Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.

Bisakah aku menulis dan menjalankan kode dalam pelajaran Web Accessibility Academy ini?

Ya. Setiap pelajaran Web Accessibility Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.

Semua pelajaran dalam kursus ini

  1. Setiap Input Membutuhkan label Asli
  2. Placeholder Bukan Label
  3. Kelompokkan Kolom dengan fieldset dan legend
  4. Teks Bantuan dan Kolom Wajib yang Diumumkan
← Kembali ke Web Accessibility Academy