FluentStack

Uji Kompetensi Forms and Basic Accessibility

Mode tersedia: dark, light, paper
MasukDaftar
Beginner · Level 2: HTML and Accessibility FoundationsBeginner45 menitBahasa Indonesia

Uji Kompetensi Forms and Basic Accessibility

Cek kesiapan kamu membuat form sederhana dengan kebiasaan accessibility dasar.

StatusMemuat progres
ReadinessMemuat...

...

Memuat progres

Menyiapkan langkah berikutnya

Yang dicek

  • Mengecek pemahaman link vs button
  • Membangun form sederhana dengan label yang terhubung
  • Mengecek pemahaman alt text dan keyboard navigation dasar
HTMLFormsAccessibilityCheckpoint

Isi lesson

6 blok
  1. 1.
    Apa yang dicek di checkpoint iniBelum selesaiWajib
  2. 2.
    QuizBelum selesaiWajib
  3. 3.
    Coding practiceBelum selesaiWajib
  4. 4.
    Writing practiceBelum selesaiWajib
  5. 5.
    Baca MDN secara terarahBelum selesaiOpsional
  6. 6.
    RingkasanBelum selesaiWajib

Apa yang dicek di checkpoint ini

Wajib

Checkpoint ini merangkum module Forms and Basic Accessibility. Kamu akan mengecek link vs button, form, label, input, textarea, select, required, alt text, keyboard navigation, dan checklist accessibility dasar. Tujuannya bukan mencari jawaban jebakan, tetapi memastikan struktur HTML dan form kamu mulai aman untuk dipakai lebih banyak user.

Bagian ini memengaruhi progres lesson.

Quiz

Wajib

Uji Kompetensi Forms and Basic Accessibility

Jawab pertanyaan satu per satu. Kamu bisa ulang quiz jika belum mencapai target lulus.

Target lulus

70/100

Skor terbaik

0/100

Status

Belum dikerjakan

Blok ini wajib untuk menyelesaikan lesson. Progres quiz naik setelah skor mencapai target lulus.

Pertanyaan 1 dari 10

Target lulus: 70

Jika elemen membawa user ke halaman dokumentasi, elemen mana yang paling tepat?

Coding practice

WajibDibuka di workspace khusus

Membuat form kontak yang lebih aksesibel

Checkpoint praktik untuk membuat form kontak dengan label, field penting, required, submit button, dan gambar bermakna.

Tujuan awal: Buat form kontak sederhana.

Practice ini dibuka di workspace khusus. Buka practice untuk memakai editor, preview, dan cek otomatis.

Tombol selesai aktif setelah semua validasi wajib lolos.

15 cek otomatis8 checklist
Belum selesaiBuka practice

Writing practice

Wajib

Latihan menulis

Setelah menyelesaikan form kontak, tulis self-review singkat. Cek minimal empat hal: - Apakah link dan button dipakai sesuai fungsi? - Apakah label terhubung ke field? - Apakah gambar bermakna punya alt text yang jelas? - Apakah elemen penting bisa dijangkau dengan Tab?

Tulis draft dulu sebelum menandai writing practice selesai.

Draft kosong

0/180 karakter

Checklist panduan

Checklist ini hanya panduan. Kamu tidak harus mencentang semuanya.

Blok ini wajib untuk menyelesaikan lesson.

Documentation Bridge

Opsional

Baca MDN secara terarah

Gunakan bagian ini sebagai latihan membaca dokumentasi resmi, bukan tugas menghafal. Kamu tidak perlu membaca semuanya sekarang. Fokus pada bagian yang mendukung form dan accessibility dasar di checkpoint ini.

MDN Web Docs

Web forms

Fokus baca

  • struktur form dasar
  • fungsi label dan input
  • cara browser memahami field form

Abaikan dulu

  • styling form advanced
  • custom form controls yang kompleks
Buka dokumentasi

MDN Web Docs

The label element

Fokus baca

  • fungsi label
  • hubungan for dan id
  • kenapa label membantu aksesibilitas

Abaikan dulu

  • semua attribute reference yang belum dipakai
Buka dokumentasi

MDN Web Docs

The button element

Fokus baca

  • fungsi button
  • type button dan submit
  • kapan button dipakai untuk aksi

Abaikan dulu

  • form method/action detail yang belum dibahas
Buka dokumentasi

MDN Web Docs

HTML images

Fokus baca

  • fungsi alt
  • cara menulis deskripsi gambar yang berguna

Abaikan dulu

  • responsive images
  • image performance
Buka dokumentasi

Aksi setelah membaca

Kembali ke latihan form kamu dan cek empat hal: label sudah terhubung ke field, button dipakai untuk submit, gambar bermakna punya alt text, dan elemen interaktif bisa dicek dengan Tab.

Opsional, tidak menghambat penyelesaian lesson.

Ringkasan

Wajib
  • Kamu membuktikan bahwa kamu bisa memilih link untuk navigasi dan button untuk aksi.
  • Kamu membuktikan bahwa kamu bisa membuat form dengan label, input, textarea, select, required, dan submit button.
  • Jika checkpoint belum lulus, review lagi link vs button, label/input, textarea/select, alt text, dan keyboard navigation dasar.
  • Setelah struktur form dan aksesibilitas dasar mulai aman, berikutnya kamu akan belajar CSS agar halaman bisa ditata tanpa merusak struktur HTML.

Bagian ini memengaruhi progres lesson.

Langkah berikutnya

Selesaikan bagian wajib checkpoint ini

Lanjutkan blok wajib berikutnya: Apa yang dicek di checkpoint ini.

Memuat progresReview module