optgroup要素（option group）は select要素で作る選択メニューの中で選択項目の option要素 をまとめてグループ化します。選択肢が複雑であったり、選択肢が多く見通しが悪い場合にユーザビリティの向上に役立ちます。
視覚環境の UA では optgroup要素によってメニュー項目が階層化され、メニューのラベル（見出し）を label属性で指定することで視覚的にわかりやすくなる効果が期待されます。最新の UA は optgroup要素に十分対応していますが、対応していない UA であれば optgroup要素部分は無視されるので、互換性を義性にすることなく使えるように設計されています。また、仕様には HTML の将来のバージョンでは optgroup要素を入れ子にできる機構の拡張があり得るとの注釈があります。
ユーザーによるグループ化した選択項目を選択する操作を禁止します。選択が禁止されたコントロール部品の値（この場合は option要素の value属性の値）は選択できないため、データ送信時にも送信されません。HTML4.01 では disabled、XHTML では属性値を省略できないため disabled="disabled" と記述します。Windows版Internet Explorer と Safari は optgroup要素の disabled属性に対応していないので、この機能は無効です（選択もできれば、選択した値も送信されてしまいます）。
グループ化した選択項目にラベル（見出し）を指定します。さらに各選択肢に対しても、内容となっているテキストそのものよりも簡略化した見出しを option要素の label属性に指定することで、グループ化選択用の簡略表示のレンダリングが期待されるのですが、この仕様通りのレンダリングを行うのは Macintosh版Internet Explorer 5 のみで、それ以外の UA では option要素の内容となっているテキストをそのまま表示します（サンプル参照）。
<p>もっとも良く利用するブラウザは次のうちどれですか。<br> <select name="browser" size="15"> <optgroup label="Netscape Navigator or Netscape"> <option label="8.x" value="N8">Netscape Browser 8.x</option> <option label="7.x" value="N7">Netscape 7.x</option> <option label="6.x" value="N6">Netscape 6.x</option> <option label="4.x" value="N4">Netscape Navigator 4.x</option> </optgroup> <optgroup label="Internet Explorer"> <option label="7.0" value="I7">Internet Explorer 7.0</option> <option label="6.0" value="I6">Internet Explorer 6.0</option> <option label="5.x" value="I5">Internet Explorer 5.x</option> </optgroup> <optgroup label="Opera"> <option label="9.x" value="O9">Opera 9.x</option> <option label="8.x" value="O8">Opera 8.x</option> <option label="7.x" value="O7">Opera 7.x</option> </optgroup> <option value="F1">Firefox 1.x</option> <option value="Other">Other</option> </select> </p>
http://w3g.jp/xhtml/dic/optgroup実績：大阪学院 入試サイト New! / 三田市民病院 / 神戸女学院大学 入試サイト / 釣りサンデー