OK

• ✓サイズは input-{sm,md,lg}、エラー時は input-error を付ける。
• ✓ラベルは label-control と組み合わせる。

NG

• ✕エラー色を直書きしない → input-error を使う。
• ✕プレースホルダーをラベル代わりにしない → label-control でラベルを置く。

可視ラベルを for／id で関連付ける。placeholder は入力例にとどめる。

<label for="email">メールアドレス</label>
<input id="email" type="email" class="input input-md"
  placeholder="you@example.com" />

placeholder をラベル代わりにしない。入力すると消え、コントラストも低く、SR でも安定して読まれない。

<input type="email" class="input input-md"
  placeholder="メールアドレス" />  <!-- ラベルなし -->

境界色＋エラーテキストを aria-describedby／aria-invalid で関連付ける。

<input class="input input-md input-error"
  aria-invalid="true" aria-describedby="err" />
<p id="err">8 文字以上で入力してください</p>

赤い境界線だけでは、色を区別できない人に何が問題か伝わらない。

<input class="input input-md input-error" value="abc" />
<!-- エラー文も aria もない -->