フォームをアクセシブルにするためのベストプラクティス

フォームをアクセシブルにするためのベストプラクティス

お知らせ:当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。

アクセス不能なフォームの影響

ウェブアクセシビリティに対する注目度が高まるにつれて、インターネットの大部分、オンラインフォームを含む、依然として障害を持つユーザーにはアクセス不可能です。これは、人口のかなりのセグメントにとって情報や対話的な体験への重大な障壁となっています。
  1. 排除:障害を持つユーザーは、情報へのアクセス、アプリケーションの提出、調査への参加、またはフォームに依存するその他のオンライン活動から排除されます。
  2. ネガティブなユーザー体験:アクセスできないフォームに遭遇すると、ユーザーは挫折感や落胆感を覚え、プロセスを途中で放棄することがあります。
  3. 潜在的な顧客の損失:ビジネスや組織は、フォームがアクセス不能である場合、価値あるエンゲージメントの機会や潜在的な顧客を逃す可能性があります。

どのような処理を行うことができますか?

  1. 認識:フォームのアクセシビリティの重要性についての認識を高めることが不可欠です。あなたのチーム、開発者、デザイナー、コンテンツ作成者を含め、アクセシブルなフォームを作成するためのベストプラクティスについて教育する必要があります。
  2. ガイドライン準拠:WCAG(Web Content Accessibility Guidelines)などの確立されたアクセシビリティガイドラインを遵守することで、フォームが包括的な視点で設計および作成されることを確実にします。
  3. テストとユーザーフィードバック:障害を持つユーザーと定期的にフォームをテストし、そのフィードバックをデザインプロセスに組み込むことは、真にアクセシブルな経験を作成するために不可欠です。

Zoho Formsを使用したアクセス可能なフォームの作成


以下は、アクセシブルなフォームを作成するためのいくつかの推奨事項です。

Best practises for creating accessible forms

  1. フォーム名とフォームの説明が、フォームの目的を正確に伝えるように確認します。
    1. フォームの目的が明確にわかるような名前を目指してください。
    2. '登録フォーム'の代わりに、より具体的な「顧客登録フォーム」や「イベント登録フォーム」などを使用する。
    3. フォームの目的と適用される使用方法については、数文で簡潔に説明してください。技術的な言葉や過度に複雑な文章は避けてください。
    4. ユーザーが認識しておくべき特定の指示や要件をリストとして挙げたい場合は、それらを説明項目に記載します。
      例:
      フォーム名: オンラインコースフィードバック
      フォーム説明: 最近のオンラインコースの体験について正直なフィードバックを共有してください。あなたのフィードバックは、我々がコースを改善し、全ての人々により良い学習体験を提供するのに役立ちます。
  2. ウェブコンテンツアクセシビリティガイドライン(WCAG)に基づくフォームのアクセシビリティに関して、画像の代替テキストを提供することは、障害を持つユーザーが画像を理解するための重要な側面です。
    例えば、説明項目に画像を含めた場合は、その画像の代替テキストを提供してください。画像に視覚的なアクセスがないため、スクリーンリーダーを頼りにするユーザーに文脈を提供します。



  3. フォームに画像選択項目を含める場合、追加される各画像選択に適切な名前をつけることを確認してください。これは、「画像1」、「画像2」などの一般的な名前をつける以上の意義があります。なぜなら、それは直接アクセシビリティとユーザー体験に影響を与えるからです。スクリーンリーダーに頼るユーザーは、画像の名前を理解することで、自分が提示される選択肢を理解します。詳細な名前を用いることで、各画像に関する正確な情報を受け取ることが可能となり、インフォームドな選択をすることが可能になります。
    1. 名前は画像に描かれているものを正確に反映しているべきです。
    2.  過度に長いまたは複雑な名前を使用するのを避け、理解しやすく記憶しやすい名前を目指してください。
    3. すべての画像選択項目に一貫した命名形式を使用してください。
  4. フォーム項目を論理的な順序で整理することは、特にスクリーンリーダーを頼るユーザーにとって、スムーズで直感的なユーザー体験を提供するために重要です。
    以下に、フォーム項目を配置するための論理的な順序を提案します:


    メールアドレス
    電話番号
  5. フォーム項目に含める任意のリンクには、その目的をユーザーに明確に示す意味のある名前があることを確認してください。
    'ここをクリック'や'詳細'などの一般的なフレーズの代わりに、リンク先のコンテンツに関連する説明的なテキストを使用してみてください。
    1. リンクの名前は、スクリーンリーダーで文脈から取り除かれて読まれても意味があります。ユーザーは、リンクが周囲のコンテンツから隔てられた場合でも、その目的を理解できるはずです。
    2. リンクをクリックしたときに何が起こるかを示す操作指向の単語を含めてください。
      例えば、'詳細'ではなく、'商品の詳細を表示'や'当社のサービスについて詳しくはこちら'を考えてみてください。
    3. リンクのテキストは、明確さを保ちつつ簡潔に保つことです。過度に長いまたは複雑なリンクテキストは、圧倒的で混乱を招く可能性があります。
    4. 各リンクには一意で識別可能な名前を付けることを確認してください。これは、複数のリンクが異なる目的地につながる場合、混乱を防ぐためです。
      例えば、'利用規約を読む'、'商品の詳細を表示する'、'お問い合わせ'などのフレーズを考えてみてください。
  6. Zoho Formsの初期設定項目のラベルをカスタマイズすることは、ユーザーにとって明確さと使いやすさを確保するための重要な手順です。ユーザーは各項目で何が期待されているのかを迅速に理解できるべきです。
    例えば、メール項目のラベルを'メール'から'メールアドレスを入力してください'に変更することができます。
    名前項目については、'名前'から'フルネームを入力してください'に変更を検討してみてください。
    Customize field name
  7. 良好に構築されたエラーメッセージは、ユーザーフレンドリーで内税なフォームの必要な要素です。あなたのエラーメッセージをカスタマイズすることで、スクリーンリーダーを使うユーザーがフォームを正しく入力するためのガイドを提供します。あなたのエラーメッセージは何が間違っているのか、そしてそれをどのように修正するかを説明するべきです。
    予め設定されたエラーメッセージを表示するのではなく、大きなファイルがアップロードされたときには次のように表示することを考えてみてください:
    アップロードしたファイルは最大サイズ制限の5 MBを超えています。もっと小さいファイルをアップロードしてください。
    1. ユーザーが混乱する可能性のある専門用語は避けてください。
    2. あなたのフォームが視覚障害を持つユーザーに対してエラーメッセージを効果的に伝えるかを確認するために、スクリーンリーダーを使った徹底的なテストを行ってください。
  8. 重要な情報を伝えるために差し込み項目のテキストに依存することを避けてください。フォームの正確な提出に必要なエッセンシャルな詳細は、ラベルに含めるか、項目の下に説明を付けて必要な情報を提供すべきです。各フォーム項目に対して明確で詳細な説明を作成することは、障害を持つユーザーを効果的にガイドし、正確なデータ入力を保証するために必要です。
    例えば、
    名前項目については、次のように検討してみてください。公的なドキュメントに記載されているように、フルネームを入力してください。省略形は使用しないでください。
    電話番号項目については、次のように検討してみてください。ハイフンやスペースなしで 10桁の電話番号を 入力してください。
    Fileアップロード項目については、次のように考えてみてください。アップロードするドキュメントは、PDFまたはWord形式で、あなたの申請をサポートするものであるべきです。最大ファイルサイズは5 MBです。
    1. 'この項目を埋めてください'のような一般的過ぎる指示語句を使用することを避けてください。
    2. 項目が特定の形式(日付、電話番号、メールアドレスなど)を必要とする場合は、期待される形式を明確に説明してください。
    3. 何をしないかを述べるのではなく('特殊文字を入力しないでください')、何が許可されているかを説明します('英数字とハイフンのみを使用してください')。
  9. 必須のフォーム項目がある場合は、項目のラベルに'必須'のテキストを含めます。視覚に頼るユーザーがスクリーンリーダーの助けを借りて情報を理解するために、ラベルは項目の上に配置してください。
  10. フォーム作成に使用するテキストでは、記号や特殊文字の使用を避けてください。
  11. 色は視覚障害のあるユーザーにとって、オンラインフォームのアクセシビリティに直接影響を与えます。色彩コントラストについて理解する必要があります:
    1. なぜ色のコントラストが重要か
      1. 視覚障害のあるユーザーや色覚異常のあるユーザーは、背景とのコントラストが不十分なテキストを読むのに苦労することがあります。
      2. 一部のスクリーンリーダーは、受注データをパッケージデータに変換しながらテキストの色を黒または白に変換します。元の内容の色のコントラストが低いと、テキストが変換後に見づらくなる可能性があります。
    2. あなたのテーマをカスタマイズするという考えで、Zoho Formsのフォームには素朴なルックを持たせることを考えてみてください。
    3. フォームが複数の色をセクション、ヘッダーなどに使用している場合、テキストの色とそれぞれの色のコントラストを確認することが重要です。
    4. フォームが背景画像を使用している場合、テキストが背景の上でもはっきりと読めるようにしましょう。
    5. より良い表示設定とフォームのボタンへのユーザーインタラクションを実現するために、ボタンのテキストとボタンの背景色との間の良好な色のコントラストを保つようにします。
  12. フォントの視認性:
    1. 視認性が優れていて、読みやすいフォントファミリーを選択します。視覚障害や認知障害のあるユーザーが読むのに困難な装飾フォントやスクリプトフォントは避けてください。
    2. 視覚障害のあるユーザーが快適に読むことができる十分に大きなフォントサイズを選択します。非太字のテキストは最小16px、太字のテキストは14pxが推奨されます。
    3. フォントサイズはZoho Formsのテーマ設定内で調整できます
    4. イタリック体や太字のテキストを過度に使用するのは避けてください。
  13. Zoho Formsでは、最大200pxまでページを拡大できます。拡大するとフォームの項目やテキストが大きくなり、視覚障害者が見やすく、操作しやすくなります。



  14. フォームが長い場合は、それをクリアなヘッダーとともにセクションに分け、関連する項目をそれぞれの下にグループ化します。整ったセクションはクリアなナビゲーションポイントを提供し、アクセシビリティを向上させます。
  15. '保存して再開する'オプションは、あなたの長いフォームをより管理しやすく、認知障害のある人々にとってアクセシブルなものにします。長いフォームは一度に提示される情報量が多いため、認知障害のあるユーザーを圧倒することがあります。'保存して後で再開する'オプションを使用することで、ユーザーはフォームの入力処理をより小さな、管理しやすい部分に分割することができます。休憩を取りながら後で再開することで、ユーザーはフォームの入力過程を通じて集中力と一貫性を保つことができ、自己制御と自主性を養います。
    Save and resume functionality

  16. 回答者が自分のフォーム送信を確認することを可能にすると、それを送信する前に、回答者は入力中に起こり得たエラーを見つけることができます。これは特に認知的な障害を持つユーザーや、集中力、記憶力、情報処理、読字障害によりタイプミスや不正確な情報の入力に苦労するかもしれないユーザーにとって有用です。
  17. 認知的な障害を持つ個人は、エラーを犯すことに対する懸念から、フォームを入力する際にストレスや不安を感じる可能性があります。'編集という応答'オプションは、彼らが初回の送信プロセス中に生じた可能性のあるエラーやタイプミスを修正する力を与え、プレッシャーを軽減し、コントロール感を高めます。自分の回答を編集する能力により、彼らはフォームを再訪し、質問を確認し、再送信前に追加のリソースやサポートを求める可能性があります。
  18. あなたのフォームが異なる言語に翻訳されている場合は、エラーメッセージや、選択肢ベースの項目における選択肢の名称がそれぞれの言語に翻訳されていることを確認してください。未翻訳のエラーメッセージや選択肢の名称はユーザーにとって混乱を招く可能性があり、問題の誤解や意図せずに不適切なオプションを選択する原因となるかもしれません。
  19. ドロップダウン項目での検索可能なドロップダウンの使用ではなく、初期設定ドロップダウンオプションの使用をお勧めします。初期設定のドロップダウンは、キーボードの矢印キーを使用して簡単にナビゲートでき、スクリーンリーダーなどの支援技術を利用するユーザーにとって重要です。
  20. リンクの冗長性に注意を払い、同じ目的地への連続したリンクの数を最小限に抑えるように努めてください。Zoho Formsプラットフォームは、隣接するリンクを1つのリンクに結合することはありませんが、フォームの所有者は、リンクの不必要な重複を意識的に避けることでユーザー体験を向上させることができます。
  21. フォームの完成に時間制限(フォームの期限)を設定するのは、絶対に必要な場合を除き、避けてください。時間制限が必要とされる場合、制限を最低でも20時間に設定し、ユーザーがフォームを埋めて送信するための十分な時間を確保してください。
  22. フォームにセクションや複数のページが含まれている場合、説明を使用して目次を作成することを検討してください。ユーザーがフォームをナビゲートする際の期待を誘導するための項目です。
  23. 複数ページのフォームでユーザーフレンドリーな体験を提供するために、すべてのページでナビゲーションボタンが一貫してラベル付けされ、明確で情報を提供する表現を使用していることを確認してください。
  24. 専門用語、イディオム、略語、不明なフレーズの使用を避けてください。明確で簡潔な言語はユーザーの理解とアクセシビリティを強化します。
  25. ロゴの表示に必要な場合を除き、テキストを含む画像の使用を避けてください。
QuoteZoho Formsチームは、すべての人が自分の能力に関係なくZoho Formsを使用して強力なフォームを簡単に作成できるよう、アクセシビリティ機能の導入に大きな努力を払ってきました。Zoho Formsはユーザーフィードバックを開発の形成に重視しており、アクセシビリティも例外ではありません。私たちはユーザーにアクセシビリティへの懸念を報告し、彼らの貴重なフィードバックを感謝しています。


    Zoho CRM 管理者向けトレーニング

    「導入したばかりで基本操作や設定に不安がある」、「短期間で集中的に運用開始できる状態にしたい」、「運用を開始しているが再度学び直したい」 といった課題を抱えられているユーザーさまに向けた少人数制のオンライントレーニングです。

    日々の営業活動を効率的に管理し、導入効果を高めるための方法を学びましょう。

    Zoho CRM Training



              Zoho WorkDrive Resources



                Zoho Desk Resources

                • Desk Community Learning Series


                • Digest


                • Functions


                • Meetups


                • Kbase


                • Resources


                • Glossary


                • Desk Marketplace


                • MVP Corner


                • Word of the Day









                                • Related Articles

                                • ウェブアクセシビリティ - WCAG準拠

                                  お知らせ:当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。 目次 アクセシビリティの理解 ウェブアクセシビリティの定義 WCAG準拠の説明 アクセシビリティ向けの構築のメリット アクセシブルなZohoフォームの重要性 すべてへのZohoフォームの利便性を保証する ユーザーによる課題 ウェブアクセシビリティの原則 ...

                                Resources

                                Videos

                                Watch comprehensive videos on features and other important topics that will help you master Zoho CRM.



                                eBooks

                                Download free eBooks and access a range of topics to get deeper insight on successfully using Zoho CRM.



                                Webinars

                                Sign up for our webinars and learn the Zoho CRM basics, from customization to sales force automation and more.



                                CRM Tips

                                Make the most of Zoho CRM with these useful tips.