2

私は現在、次のようなフォームを持っています:

<form action="#">
    <select {if $isPostRequest}disabled="disabled" {/if}size="1" name="locale" 
onchange="location.href={if $languageToggleNoUser}'{$currentUrl|escape}{if strstr($currentUrl, '?')}&amp;{else}?{/if}setLocale='+this.options[this.selectedIndex].value{else}('{url|escape:"javascript" page="user" op="setLocale" path="NEW_LOCALE" source=$smarty.server.REQUEST_URI}'.replace('NEW_LOCALE', this.options[this.selectedIndex].value)){/if}" class="selectMenu">{html_options options=$languageToggleLocales selected=$currentLocale}</select>
</form>

すべてのフォームに送信ボタンが必要なため、現時点では WCAG 2.0 エラーが発生します。

このコードを変更して送信ボタンを含める方法を考えています。onchange オプションのコードは非常に複雑で、私には理解できません。

ありがとう。

4

2 に答える 2

2

WCAG 2.0 では、送信ボタンは必須ではありません。あなたがリンクしているのは、有益な(規範的ではない)テクニックであり、ガイドライン3.2.2を達成するための多くの方法の1つにすぎません。

したがって、たとえば次のような場合に、送信ボタンがないことに準拠できます

ユーザーは、コンポーネントを使用する前にその動作について知らされていました

関連テクニック: G13: コンテキストの変更を引き起こすフォーム コントロールへの変更が行われる前に何が起こるかを記述する

于 2014-02-21T15:12:33.017 に答える
0

ここで注意すべき重要なことは、コンテンツ の変更がすぐにコンテキストの変更を意味するわけではないということです。

3.2.2 ガイドラインの観点からすると、選択ボックスは完全に問題ない可能性が非常に高くなります。

文脈の変化は、本当に劇的な変化を意味します。ユーザーが選択ボックスでオプションを選択すると、フォーカスがページの別のセクションに移動します。また、ページ全体を更新したり、新しいタブを開いたりすることも、この基準を満たしていません。

WCAG の「コンテキストの変更」の定義

ユーザーの意識なしに行われた場合、ページ全体を同時に表示できないユーザーの方向感覚を失わせる Web ページのコンテンツの大幅な変更

コンテキストの変更には、次の変更が含まれます。

  • ユーザーエージェント;
  • ビューポート;
  • 集中;
  • ウェブページの意味を変えるコンテンツ。

注:コンテンツの変更は、常にコンテキストの変更とは限りません。アウトラインの展開、動的メニュー、タブ コントロールなどのコンテンツの変更は、上記のいずれか (フォーカスなど) も変更しない限り、必ずしもコンテキストを変更するとは限りません。

例:新しいウィンドウを開く、フォーカスを別のコンポーネントに移動する、新しいページに移動する (ユーザーが新しいページに移動したように見えるものを含む)、またはページのコンテンツを大幅に再配置することが例です。文脈の変化の。

したがって、ページの他の場所でコンテンツを変更するだけで、ユーザーのフォーカス ポイントをいじらない場合は、3.2.2 ガイドラインの観点からすれば、すべてうまく行っていることになります。

あなたは現在別の方法で失敗していますが

選択ボックスがアクセシビリティに失敗する原因が 1 つあります。ラベルが欠けています。これは、ガイドライン2.4.6 見出しとラベルに対する失敗です。ラベルがないということは、ユーザーが選択ボックスの目的を理解できないことを意味します。

<form action="#">
    <label for="unique-id">Label for select box</label>
    <select id="unique-id" {... all that other junk ...}>
        {...<option> elements...}
    </select>
</form>
于 2020-05-26T08:54:38.527 に答える