Laporan pembaikan

Laporan Pembaikan Kebolehcapaian

Kami menguji laman web anda berdasarkan WCAG 2.2 A dan AA dalam pelayar sebenar, melalui laluan utamanya dengan papan kekunci sahaja (pada kedai, sehingga butang checkout) dan memberi pembangun anda perubahan bagi setiap halangan, yang dibina daripada markup anda sendiri.

  • Sehingga 25 halaman diuji
  • Ujian perjalanan papan kekunci
  • 5 ujian semula disertakan

Apa yang kami semak

  • Peraturan WCAG 2.2 A dan AA

    Ujian axe-core automatik pada halaman penting anda dan sehingga 20 halaman lagi daripada peta laman anda: teks alt, kontras warna, nama untuk butang dan pautan, label borang, heading, landmark dan ARIA.

  • Ujian perjalanan papan kekunci

    Menggunakan papan kekunci sahaja: pada kedai, dari halaman utama ke produk, pilihan, Tambah ke troli dan troli, lalu berhenti di butang checkout; di laman lain, dari halaman utama ke halaman penting, seruan bertindak utamanya dan medan borangnya. Tiada apa-apa yang dihantar.

  • Perangkap fokus dan fokus yang kelihatan

    Sama ada fokus tersekat, contohnya dalam sepanduk kuki, dan sama ada pelawat dapat melihat kedudukannya.

  • Aliran semula telefon pada 320 px

    Sama ada halaman memerlukan penatalan ke sisi pada telefon kecil (WCAG 1.4.10).

  • Peta dakwaan surat tuntutan

    Jika anda menampal surat, setiap dakwaan dipadankan dengan apa yang dihasilkan semula oleh ujian kami, dengan bilangan kejadian bagi setiap halaman.

  • Perkara untuk semakan manusia

    Perkara yang ditandakan oleh ujian tetapi tidak dapat ditentukan, seperti teks di atas imej, berserta cara menyemak setiap satu.

Apa yang anda terima

  • Senarai mengikut keutamaan: baiki dahulu, baiki seterusnya, tambah baik
  • Kod sebelum dan selepas yang dibina daripada setiap elemen yang gagal
  • Langkah untuk Shopify, WordPress, WooCommerce atau platform yang kami kesan
  • Prompt AI sedia guna untuk setiap penemuan
  • Tangkapan skrin dengan elemen yang gagal ditandakan dengan garis
  • Draf pernyataan kebolehcapaian dan log bukti
  • 5 ujian semula untuk mengesahkan pembaikan anda, serta PDF

Cara laporan dihasilkan

  1. 1

    Lima halaman daripada imbasan percuma anda, serta sehingga 20 halaman lagi daripada peta laman anda, dimuatkan dalam Chromium dan diuji dengan axe-core.

  2. 2

    Sesi pelayar berasingan melalui laluan utama laman dengan papan kekunci sahaja dan merekodkan setiap langkah, dengan tangkapan skrin apabila sesuatu gagal.

  3. 3

    Setiap kegagalan diberi pembaikan yang ditulis untuk platform anda, kemudian laporan disusun dan dihantar kepada anda melalui e-mel.

Penemuan daripada contoh laporan

Output sebenar untuk Harbor & Pine, sebuah kedai rekaan yang kami bina dengan masalah biasa.

Buka contoh laporan penuh
  • Critical

    @axe/button-name/help{"$en":"Buttons must have discernible text"}

    @axe/button-name/help{"$en":"Buttons must have discernible text"}: the failing element outlined in red

    41 instances on 9 pages. WCAG 4.1.2 requires every control to have a name. Unnamed buttons often include quantity steppers, close buttons and slider arrows.

    Fix: Add visible text, visually hidden text, or an aria-label that says what the button does (for example {a} or {b}).{"a":"aria-label=\"Close\"","b":"aria-label=\"Increase quantity\""}

  • Critical

    @axe/image-alt/help{"$en":"Images must have alternative text"}

    @axe/image-alt/help{"$en":"Images must have alternative text"}: the failing element outlined in red

    22 instances on 7 pages. WCAG 1.1.1 requires a text alternative for meaningful images. Without it, a screen reader user can't tell which product a photo shows.

    Fix: Describe what matters to a shopper: product name, color and the angle shown (for example 'Canvas tote in olive, front view').

  • Critical

    @axe/label/help{"$en":"Form elements must have labels"}

    @axe/label/help{"$en":"Form elements must have labels"}: the failing element outlined in red

    7 instances on 6 pages. WCAG 1.3.1, 3.3.2 and 4.1.2 require form fields to have labels. Newsletter sign-up and search fields are common offenders.

    Fix: Placeholder text alone does not count as a label.

Perkara yang tidak diliputi

  • Output pembaca skrin, kapsyen dan perihalan audio (senarai semak manual disertakan)
  • Checkout, pembayaran dan penghantaran borang
  • Halaman di sebalik log masuk
  • Nasihat undang-undang, atau sijil pematuhan ADA atau EAA

Soalan tentang laporan ini

Adakah ini audit WCAG penuh?

Ini audit automatik serta ujian perjalanan papan kekunci. Ujian automatik hanya menemui sebahagian daripada isu WCAG pada sesebuah laman, jadi laporan turut menyenaraikan perkara yang memerlukan semakan manusia dan cara melakukannya.

Adakah ia membantu dengan surat tuntutan ADA?

Jika anda menampal surat itu, laporan menunjukkan dakwaan mana yang dihasilkan semula oleh ujian kami pada laman web anda, berserta bukti. Ini rekod fakta, bukan nasihat undang-undang; berbincanglah dengan peguam tentang surat itu sendiri.

Untuk platform mana kod ini berfungsi?

Pembaikan ditulis untuk platform yang kami kesan: tema Shopify, WordPress dan WooCommerce, Webflow, BigCommerce, Wix, Squarespace, rangka kerja seperti Next.js, atau HTML biasa. Jika kami tidak dapat melihat kod sumber anda, lokasi fail diberikan sebagai petunjuk.

Apakah 5 ujian semula itu?

Selepas pembangun anda membuat perubahan, anda boleh menjalankan semakan yang sama sekali lagi daripada laporan, sehingga lima kali, dan melihat masalah mana yang tidak lagi dihasilkan semula.

Panduan berkaitan

Laporan lain

Imbas laman web anda hari ini

Cari. Baiki. Sahkan.

Laman web jenis apakah ini?

Jawapan anda memilih semakan yang sesuai, seperti perjalanan membeli-belah untuk kedai dalam talian. Kami tetap menyemak bukti laman itu sendiri dan menunjukkan kedua-duanya.

Laman web jenis apakah ini?

Imbasan percuma. Tidak perlu kad kredit.