YUGIEN ATLAS 標準・根拠・実装を確認する
テーマ

HTML / Grouping content

HTMLリスト要素 — 順序・番号・Accessibility Mapping

状態: 仕様確認・選定WPT・Chromium実測 対象: HTML Living Standard・HTML-AAM・CSS Lists・WPT

Technical Summary

olは順序が意味を持つ項目群、ulは項目を入れ替えても意味が変わらない項目群を表します。各項目はliで表し、番号の決定はol・start・reversed・li[value]の条件で行います。CSSのmarker表示とHTMLのリスト意味、HTML-AAMのrole mapping、ブラウザーで観測したAccessibility Treeは別のEvidenceとして扱います。

このTopicはol・ul・liを対象にします。コマンド群を表すmenuと、用語・説明のまとまりを表すdlは関連する別のcontent modelです。

定義・選択条件

HTML Living Standard §4.4.5–4.4.8（2026-10-30）では、olを順序が重要な項目群、ulを順序が重要ではない項目群、liを項目として定義します。見た目に番号や点があるかではなく、順序を変えると意味が変わるかで選びます。

  • ol: 手順や順位など、並び順が情報の一部。
  • ul: 道具や成分など、項目の順序が情報の一部ではない。
  • li: 親リスト内の一項目。親要素がolなら、番号付きリストのordinal value（順番を表す数値）を持つ。

視覚的な番号は順序付きリストの表示結果ですが、順序付きリストの意味そのものとは分けて考えます。番号をCSSでアルファベットやローマ数字に変えても、項目の順序に意味があるという点は変わりません。

Content model・入れ子・番号計算

olとulの子要素はliおよびscript-supporting elementsです。liのcontent modelはflow contentです。入れ子リストは、親のliの子として置きます。liの終了タグは、次のliの直前、または親に続く内容がない場合に省略できます。

ol[start]は最初のordinal valueを指定します。reversedは順序付きリストのordinal valueを減らします。reversedがありstartがない場合、開始値はそのリストが所有する項目数から決まります。li[value]はその項目のordinal valueを設定し、後続項目の計算にも影響します。reversedは項目のDOM順を入れ替える属性ではありません。

HTMLOListElement.start・reversed・type、およびHTMLLIElement.valueはDOM APIで参照できます。反映されたIDL属性値と、画面に表示されるordinal valueは同じ概念ではありません。li.valueはcontent attributeを反映するプロパティです。

CSS markerとlist owner

ol[type]は数字・英字・ローマ数字などのmarker形式を指定できます。表示の調整にはCSSのlist-style-typeなどが使えます。markerの外観だけを設定したCSSは、HTML上のol / ulの意味を選び直しません。

CSS Lists Moduleのlist owner計算は、HTMLの親子関係だけでなく、描画される要素とcomputed display: list-itemも考慮します。このため「HTMLのliの親リスト」と「CSS markerのlist owner」は、異なる対象を扱う場合があります。選定WPTには、liの親・list ownerに関するreftestもありますが、この実測ではtestharness形式の選定ファイルを実行し、reftest全体は実行していません。

HTML-AAM mapping

HTML-AAM 1.0 Working Draft（2026-10-26）は、olとulをWAI-ARIAのlist roleへ、親のol・ul・menuに属するliをlistitem roleへ対応付けます。list item mappingでは、所属リスト内の個数と位置をaria-setsize・aria-posinsetに対応させます。条件を満たさないliはgenericとして扱われる場合があります。

2026-11-01のChrome 156実測では、HTMLのol・ulはlist、所属するliはlistitemとして返りました。入れ子の項目にはlevel=2がありました。一方、リスト外に置いたliもlistitemでした。HTML-AAMのWorking Draftは、この条件ではgenericを示します。また、CDPの項目にはaria-setsize・aria-posinsetに相当する情報が見つかりませんでした。これは仕様とChromeのbrowser treeに差があるという観測です。

Implementation Evidenceには、Chrome DevTools Protocol（CDP）が返したbrowser Accessibility Treeを記録します。CDPのbrowser treeは、Windows UI AutomationなどのOS accessibility APIや、スクリーンリーダーの発話そのものではありません。ほかのブラウザーやOSで同じ結果になるとは限りません。

Fact / Evidence

HTML Standardの規範的な定義、WPTの選定assertion、HTML-AAMのmapping、Chromeの実測を分けて記録します。WPTのpass数はそのファイルのassertionに限られ、HTML全体や他ブラウザーの適合を示しません。

ol・ul・li: Fact and Evidence
TypeFact / ClaimScope / conditionEvidence
SPEColは順序が重要な項目群、ulは順序が重要ではない項目群を表す。markerのCSSだけでは要素の意味を置き換えない。HTML Living Standard §4.4.5–4.4.6。著者が選ぶ意味と、browserの視覚表示を区別。HTML Standard: ol · HTML Standard: ul
SPECol[start]、boolean reversed、li[value]がordinal valueを計算する。reversedは項目のDOM順を逆にしない。HTML Standardのstarting value / ordinal value algorithmとIDL reflection。表示markerとIDL値を区別。HTML Standard: ol numbering · HTML Standard: li value
SPECol / ulはlist role、所属するliはlistitem roleへmappingされ、set sizeとpositionの情報を持つ。HTML-AAM 1.0 Working Draft 2026-10-26。規範的なmappingと個別browser treeを混同しない。HTML-AAM: ol · HTML-AAM: ul · HTML-AAM: li
WPTrole mapping、DOM interface、start / reversed / value reflectionの選定WPTを実行する。測定結果は下のImplementation Evidenceに記録。pinned WPT revisionを記録。testharnessとCDP helperを使い、公式wptrunner / WebDriverと区別。HTML-AAM roles · grouping-ol · grouping-ul · grouping-li

Evidence sources

Implementation Evidence

Browser DOM and Chrome Accessibility Tree measurements use a dedicated fixture. The four Yugien / Atlas pages are checked for links, page metadata, responsive widths, themes, and search. Selected WPT files use the pinned testharness; the HTML-AAM role test uses a Playwright / CDP adapter. This is not the official wptrunner / WebDriver launcher.

Reproducible record: fixture, scripts, and JSON outputs are under build-config/yugien/research-results/list-v1/. The written evidence summary is docs/atlas/list-evidence-2026-11-01.md.

ol・ul・li Implementation Evidence registry
TypeReproduced scopeRecorded conditionsStatus
IMPL Yugien / Atlasの日英4ページにあるHTMLリスト、共通ナビ・検索・言語切替、レスポンシブ表示、テーマ、DOMとChrome Accessibility Tree 2026-11-01 / Windows 11 Pro build 26300 / Google Chrome 156.0.8078.74 / Playwright 1.57.0 / DPR 1 / local loopback。4ページすべてHTTP 200。canonical、ja/en hreflang、共通ナビ・検索・言語切替を確認。内部route・fragment欠落、console error、local resource failureなし。幅320 / 390 / 768 / 1280 / 1920 CSS pxでdocumentの横はみ出しなし。Atlasの2 tableは320 / 390pxで名前付き・keyboard-focusableなrole=region内を横scroll（table 608px、wrapper 286 / 356px）、768px以上では670px内に収まる。各ページでsystem light / darkと明示的なlight / darkを確認。Atlas日本語「箇条書き」とYugien英語ordered listの検索で、対象ページと反対言語ページを確認。fixtureは14/14 checks pass。詳細とJSON reportはbuild-config/yugien/research-results/list-v1/。 部分観測（Chrome 156 / 4ページ / 5幅 / 3テーマ）
WPT HTML-AAM role、DOM interface、ol / ul / liの選定testharness 2026-11-01 / Google Chrome 156.0.8078.74。html-aam/roles.html 60/60、grouping-ol.html 25/25、grouping-ul.html 1/1、grouping-li.html 10/10。合計96/96 pass、failなし。ローカルtestharnessを実行し、role testにはPlaywright / CDP helperを使用。公式wptrunner / WebDriver実行ではない。選定した4ファイルとreportはbuild-config/yugien/research-results/list-v1/。

実行したテストの版: 5b11a9b4169aba2d11f33d787c88222bf9f017c3。テストファイルへのリンクは、この版のファイルを開きます。

 96/96 pass（選定4 files / 1 browser）
AAM fixtureおよび4ページ内のlist / listitem role、入れ子のlevel、CSS display:list-item、リスト外liのChrome Accessibility Tree 2026-11-01 / Google Chrome 156.0.8078.74 / Windows 11 Pro build 26300。CDP Accessibility.getPartialAXTreeで測定。native ol / ulはlist、所属するliはlistitem。入れ子の項目はlevel=2。display: list-itemのdivもlistitem。リスト外liもlistitemとなり、HTML-AAM WD 2026-10-26が示すgenericと異なった。実測した項目のCDP propertiesにaria-setsize / aria-posinset相当の情報なし。OS accessibility API、他ブラウザー、支援技術の発話・点字は未実測。詳細はdocs/atlas/list-evidence-2026-11-01.md。 部分観測・仕様差あり（Chrome AX Tree / 1環境）

Coverage / Open Issues

  • 仕様確認済みol・ul・liの意味、content model、ordinal value、DOM interface、HTML-AAM role mapping
  • 選定範囲のみ実測ローカルfixture、日英4ページ、選定WPT filesとChrome Accessibility Tree。詳細条件はEvidence rowを参照。
  • AAMの実測差リスト外のliをChromeはlistitemとして返しましたが、参照したHTML-AAM draftはgenericを示します。CDPは実測した項目のset sizeとpositionを返しませんでした。
  • 未実施Firefox・Safari等との比較、公式wptrunner / WebDriverによる実行、全WPT、Windows UI Automation / IAccessible2 / macOS AX / ATK、読み上げ・点字。
  • 関連境界menuとdlの独自content model、CSS list-ownerの全条件は、このTopicの全網羅対象ではない。
  • レビュー未実施Expert-gap Reviewおよび複数の支援技術を使った利用者観点の確認。

Chromiumの単一環境の結果を、すべてのbrowser・OS accessibility API・assistive technologyで同じになるという主張には一般化しません。HTML-AAMの参照版はWorking Draftで、今後変更される可能性があります。

Related surfaces

初心者向けの例と選び方はYugienのHTMLリスト説明を参照してください。リンク群とnavigation landmarkの関係はnav Topic、見出しの階層はheading Topicで扱います。用語と説明のまとまりを作るdlは別のTopic範囲です。