0Pricing
Web Accessibility Academy · Pelajaran

Tajuk Baris dan Kolom yang Tepat

Hubungkan setiap sel dengan tajuk yang benar.

Tajuk Baris dan Kolom yang Tepat adalah pelajaran Web Accessibility Academy gratis di CoddyKit. Ini adalah pelajaran 2 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.

Sebagian Besar Tabel Memiliki Dua Jenis Header

Data nyata biasanya memiliki header di bagian atas dan di sisi samping. Setiap sel data berada di pertemuan antara header kolom dan header baris.

Setiap Sel Membutuhkan Keduanya

Nilai 92 tidak banyak berarti jika berdiri sendiri. Hubungkan nilai itu dengan Ada dan Score, maka hasilnya menjadi Ada, Score, 92. Pengaitan tersebut adalah asosiasi yang sedang Anda bangun.

Header Kolom di Bagian Atas

Baris pertama memuat header scope=col. Saat pengguna menekan panah ke bawah pada suatu kolom, pembaca layar terus menyebutkan header kolom tersebut sebagai konteks.

<tr>
  <th scope="col">Student</th>
  <th scope="col">Score</th>
</tr>

Header Baris di Sisi Kiri

Sel pertama di setiap baris isi menjadi header scope=row. Sel ini memberi nama pada baris sehingga nilai memiliki keterangan siapa atau kapan saat pengguna membacanya dari kiri ke kanan.

<tr>
  <th scope="row">Ada</th>
  <td>92</td>
</tr>

Sel Sudut

Sel kiri atas biasanya berada di atas header baris dan di samping header kolom. Membiarkannya sebagai th kosong tidak masalah dan menjaga struktur kisi tetap benar.

<tr><th></th><th scope="col">Score</th></tr>

Cakupan Bawaan Adalah Jebakan

Peramban mencoba menebak scope, tetapi tebakan tersebut tidak dapat diandalkan untuk kisi apa pun yang lebih rumit daripada yang paling sederhana. Selalu tetapkan scope sendiri agar yakin.

Gunakan thead dan tbody

Bungkus baris header dengan thead dan baris data dengan tbody. Ini memperjelas struktur bagi teknologi bantu dan membuat markup Anda jauh lebih mudah dibaca.

<thead>
  <tr><th scope="col">Name</th></tr>
</thead>
<tbody>
  <tr><th scope="row">Ada</th></tr>
</tbody>

Cara Pembaca Layar Membacanya

Pindahkan fokus ke sel data, lalu pengguna akan mendengar header baris, header kolom, kemudian nilainya. Scope yang tepat membuat pengumuman tersebut akurat.

Satu Sel Header, Satu Tugas

Gunakan th hanya untuk satu peran: header kolom atau header baris. Mencampur data dan label dalam satu sel mengaburkan keterkaitan bagi semua orang.

Uji dengan Membaca Satu Sel

Pilih satu sel data secara acak dan tanyakan: apakah header-nya menjelaskannya secara lengkap? Jika Anda tidak dapat mengetahui arti suatu angka dari header-nya, scope Anda salah.

Contoh Dua Sumbu

Header kolom di atas, header baris di kiri, dan data di tengah. Bentuk matriks ini mencakup sebagian besar tabel yang akan Anda buat.

<tr><th scope="row">Ada</th><td>92</td><td>88</td></tr>

Pemeriksaan Singkat

Pengguna menekan tombol panah hingga berada pada sel data jauh di dalam tabel yang ditandai dengan baik.

Ringkasan: Dua Sumbu, Dua Scope

Header kolom menggunakan scope=col, header baris menggunakan scope=row, dan setiap sel data berada di titik pertemuan keduanya. Tetapkan scope sendiri dan jangan pernah mempercayai tebakan peramban.

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Tajuk Baris dan Kolom yang Tepat” gratis?

Ya — teks lengkap “Tajuk Baris dan Kolom yang Tepat” 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 “Tajuk Baris dan Kolom yang Tepat”?

Hubungkan setiap sel dengan tajuk yang 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 2 dari 4.

Berapa lama pelajaran “Tajuk Baris dan Kolom yang Tepat” 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. th, scope, dan Elemen caption
  2. Tajuk Baris dan Kolom yang Tepat
  3. Tabel Rumit: Memasangkan headers dan id
  4. Tabel Tata Letak Adalah Perangkap
← Kembali ke Web Accessibility Academy