入力まわりを全ツールで揃えました——「サンプルを入れる」「リセット」「コピー」、押しやすいボタン、エラーの出し方

ツールページの入力まわりを、全 265 種まとめて揃えました。前回（上部を軽くする改修）に続く2回目です。計算や変換の内容は変わっていません。

3つの操作を、同じ場所・同じ言葉に

入力枠の右上に「サンプルを入れる」と「リセット」を置きました。これまでツールごとに「クリア」「全部消す」「初期値に戻す」と言葉も位置もばらばらだったものです。リセットは入力欄を最初の状態に戻し、結果もそのまま計算し直します。結果の「コピー」は結果枠の右上にあります。

スマートフォンで押しやすく

指で触る端末では、ボタン・セレクト・入力欄の高さを 44px 以上にしました。小さすぎた文字のリンクやボタンも一回り大きくしています。マウス操作のときは従来どおりです。

入力エラーの出し方を1つに

「1〜100 の整数で」などのエラーは、入力欄の直下に同じ色・同じ大きさで出ます。スクリーンリーダーにも読み上げられるよう、入力欄にエラー状態を示す属性を付けています。