タグ

UIとwai-ariaに関するd4-1977のブックマーク (2)

  • リンクかボタンかそれ以外か - Unreviewed

    あるアクションを引き起こす「モノ」を「リンク」とするか「ボタン」とするかは、何を基準に判断すればよいのでしょうか。ここでは最近の私の解釈を書きます。 最近の私の解釈 最近の私の解釈は「アクションが、ページの遷移かフォーカスの移動を発生させるものはリンク、そうでなければボタン」というものです。この解釈はWAI-ARIA 1.0のある注記がきっかけになっています。 WAI-ARIA 1.0 WAI-ARIA 1.0 (2011年1月18日勧告候補)にはlinkロールとbuttonロールがそれぞれ用意されています。中でもlinkロールには私の解釈の直接のきっかけとなった注記があります。 Note: If pressing the link triggers an action but does not change browser focus or page location, authors

    リンクかボタンかそれ以外か - Unreviewed
  • WAI-ARIA対応のタブ型UIの作り方(基本編) - ICS MEDIA

    HTMLのマークアップでアクセシビリティーを向上させる方法として、WAI-ARIA(ウェイ・アリア)があります。HTML要素の属性に aria-* を追加することで音声読み上げの精度を高められます。 WAI-ARIAの特徴として、状態を示す属性が存在します。たとえば、aria-selected 属性。名前の通り、該当のHTML要素が選択状態であるかを示すことができます。ウェブサイトのUIパーツにはタブやアコーディオンなど動的なものがあります。こういった動的なパーツの「状態」はHTMLのマークアップだけでは示すことが難しく、JavaScriptの実装が不可欠です。 ▲記事で解説するサンプル。タブの切り替えによって、aria-selected属性を動的に切り替えている。JavaScriptの制御が必要である。 よく利用される例としてタブ型のユーザーインターフェイスを題材とし、流行りのJSライ

    WAI-ARIA対応のタブ型UIの作り方(基本編) - ICS MEDIA
    d4-1977
    d4-1977 2019/07/04
    aria属性の使い方、上手くなりたい
  • 1