ボタンの表示ラベル
ボタンは、テキストのみ、画像とテキスト、またはテキストがない画像のみが表示されるように設計することができます。アクセシビリティに対応したボタンを作成するには、ui:button を使用し、label 属性を使用してテキスト表示ラベルを設定します。表示ラベルのテキストは支援技術では使用できますが、画面には表示されません。
1<ui:button label="Search"
2iconImgSrc="/auraFW/resources/aura/images/search.png"/>ui:button を使用する場合、空でない文字列を表示ラベル属性に割り当てます。次の例に、ui:button をどのように表示するかを示します。
1<!-- Good: using alt attribute to provide a invisible label -->
2<button>
3 <img src="search.png" alt="Search"/>
4</button>1<!-- Good: using span/assistiveText to hide the label visually, but show it to screen readers -->
2<button>
3 ::before
4 <span class="assistiveText">Search</span>
5</button>