MW211 EXIT

devlog
HTML/ボタン
2015年08月22日
今更ながら、現在のところボタンはどういう方式で運用されているのか軽く見てみた。

以下の三つがあり、大手サイトはほぼそのいずれかを使っている。
┌──┬──────┬────────────────────────────┐
│i系 │inputタグ系 │<input type="button" name="" value="ボタン"/>           │
│    │            │<input type="submit" name="" value="ボタン"/>           │
├──┼──────┼────────────────────────────┤
│b系 │buttonタグ系│<button name="" value="">ボタン</button>                │
├──┼──────┼────────────────────────────┤
│a系 │aタグ系     │<a href="">ボタン</a>                                   │
└──┴──────┴────────────────────────────┘

特徴を分析すると以下の通り。
┌──┬───────────────────────────────────┐
│i系 │○オーソドックスなやり方                                              │
│    │×ラベル名が属性に含まれるので、多言語対応時のビュー切り分けが不得手  │
├──┼───────────────────────────────────┤
│b系 │○モダンなやり方(value値が表に出ないので自由に使える)                 │
│    │×レガシーブラウザでは非対応                                          │
├──┼───────────────────────────────────┤
│a系 │○ボタンに依存しないやり方                                            │
│    │×本来の使い方ではない(ボタン形状は自前で用意)                        │
└──┴───────────────────────────────────┘

「i系」から「b系」から移行しつつある一方で、
別概念の「a系」に移行する流れも見られる感じか。
分類:HTML