xoxo-ja: Difference between revisions
m (→別の簡単な例: added '「' that was lacked) |
m (→別の簡単な例: added translator's note) |
||
Line 118: | Line 118: | ||
* [http://diveintomark.org/public/2004/01/xo-with-style.xo CSS でレイアウトした standalone XHTML としての XO]([http://validator.w3.org/check?uri=http%3A%2F%2Fdiveintomark.org%2Fpublic%2F2004%2F01%2Fxo-with-style.xo これも妥当な XHTML です]) | * [http://diveintomark.org/public/2004/01/xo-with-style.xo CSS でレイアウトした standalone XHTML としての XO]([http://validator.w3.org/check?uri=http%3A%2F%2Fdiveintomark.org%2Fpublic%2F2004%2F01%2Fxo-with-style.xo これも妥当な XHTML です]) | ||
* [http://homepage.mac.com/ctholland/thelab/outlines/ Chris Holland Outline Helper]:上の例に手を加え、簡単のため CSS をコピーし、[http://homepage.mac.com/ctholland/thelab/outlines/outlines.css outlines.css] と [http://homepage.mac.com/ctholland/thelab/outlines/outlines.js outlines.js] への参照を追加して、compact 属性をつけた別の ul/ol/li を組み合わせて貼り付けた例 | * [http://homepage.mac.com/ctholland/thelab/outlines/ Chris Holland Outline Helper]:上の例に手を加え、簡単のため CSS をコピーし、[http://homepage.mac.com/ctholland/thelab/outlines/outlines.css outlines.css] と [http://homepage.mac.com/ctholland/thelab/outlines/outlines.js outlines.js] への参照を追加して、compact 属性をつけた別の ul/ol/li を組み合わせて貼り付けた例 | ||
** セマンティックな指針に適合させようとする時、ol や ul 要素の "compact" 属性は、表示状態を操作する物となります。スクリプトの中で、スタイルに柔軟性を持たせるために下位項目を持つ li 要素にクラスを設定しました。CSS の指導者的立場の人達は、「'compact' 属性が設定されている ol ノードを含む li ノードを選択する」他の CSS セレクターで "li.expanded" | ** セマンティックな指針に適合させようとする時、ol や ul 要素の "compact" 属性は、表示状態を操作する物となります。スクリプトの中で、スタイルに柔軟性を持たせるために下位項目を持つ li 要素にクラスを設定しました。CSS の指導者的立場の人達は、「'compact' 属性が設定されている ol ノードを含む li ノードを選択する」他の CSS セレクターで "li.expanded" を置き換えられるかもしれません。 | ||
*** 「'compact' 属性が設定されている ol ノードを含む li ノードを選択する」CSS セレクターは「li ol[compact="compact" | *** 「'compact' 属性が設定されている ol ノードを含む li ノードを選択する」CSS セレクターは「li ol[compact="compact"」になるでしょう(訳注:このセレクターは目的のノードを選択しません)。 | ||
== Properties of Outline Items == | == Properties of Outline Items == |
Revision as of 19:49, 30 December 2008
<entry-title> XOXO 1.0: Extensible Open XHTML Outlines </entry-title>
XOXOとは、標準的なXHTMLで書かれたシンプルでオープンなアウトラインフォーマットで、(X)HTML, Atom, RSS, そしてarbitrary XMLに組み込むのに適しています. XOXOは microformat オープンスタンダードの一つです.
仕様ドラフト 2004-10-01
編者
作者
- Kevin Marks(Technorati, Inc)
- Tantek Celik(Technorati, Inc, formerly of Microsoft Corporation)
- Mark Pilgrim(IBM)
- Morten W. Petersen
著作権
This specification is (C) 2003-2024 by the authors. However, the authors intend to submit (or already have submitted, see details in the spec) this specification to a standards body with a liberal copyright/licensing policy such as the GMPG, IETF, and/or W3C. Anyone wishing to contribute should read their copyright principles, policies and licenses (e.g. the GMPG Principles) and agree to them, including licensing of all contributions under all required licenses (e.g. CC-by 1.0 and later), before contributing.
- Tantek: I release all my contributions to this specification into the public domain and I encourage the other authors to do so as well.
- When all authors/editors have done so, we can remove the MicroFormatCopyrightStatement template reference and replace it with the MicroFormatPublicDomainContributionStatement.
特許
この仕様はロイヤリティーフリーの特許方針に帰属するものです。特許方針に関してはW3C Patent PolicyやRFC3667、RFC3668をご覧下さい。
あらすじ
Attention.xmlについて話し合っていたとき、XHTMLで作るアウトラインおよびblogrollフォーマットの可能性をTantekが指摘しました。XHTMLで記述することにより、ブラウザで表示することも出来れば厳密なXML処理系でパースすることも可能です。このページはそのフォーマットについて考えるための場所として作られました。
名称
XOXOはeXtensible Open XHTML Outlinesの略称であり、「エックス オー エックス オー」、「ジョージョー」または「ショーショー」などと発音されています。
要約
XOXO はマイクロフォーマットの一つです。この仕様では、モジュールの骨格と、「XHTML のモジュール化」(XHTMLMOD)で定義されたモジュールに基づいて、新しい XHTML ドキュメントタイプを定義します。 XHTML として使いやすく、XML エンジンが処理してブラウザで簡単にインタラクティブな表示ができるようなアウトラインの土台となるのが XOXO の目的です。
XOXO ドキュメントタイプ
XOXO ドキュメントタイプは次の XHTML モジュールで構成されます。このモジュールにある要素、属性、最小内容モデルは「XHTML のモジュール化」(XHTMLMOD)で定義されています。要素は情報を提示するためにここで一覧にしますが、最終的には「XHTML のモジュール化」での定義を参照するべきです。このドキュメントのオンライン版では、下の一覧のモジュール名を、「XHTML のモジュール化」現行バージョン内のモジュール定義へのリンクとしています。
body, head, html, title
ハイパーテキストモジュール(Hypertext Module)
a
dl, dt, dd, ol, ul, li
メタ情報モジュール(Metainformation Module)
meta
スタイルシートモジュール(Style Sheet Module)
style 要素
スタイル属性モジュールモジュール(Style Attribute Module)
style 属性
link
ol と ul での compact 属性
XOXO プロファイル
XOXO の class 属性用の値を定義した XOXO の XMDP プロファイルは、xoxo-profile を参照してください。
簡単な XOXO の断片
マークアップ
<ol class='xoxo'>
<li>項目 1
<ol>
<li>下位項目 a</li>
<li>下位項目 b</li>
</ol>
</li>
<li>項目 2
<ol compact="compact">
<li>下位項目 c</li>
<li>下位項目 d</li>
</ol>
</li>
<li>項目 3
<ol>
<li>下位項目 e</li>
</ol>
</li>
</ol>
表示例
1. 項目 1 a. 下位項目 a b. 下位項目 b 2. 項目 2 3. 項目 3 a. 下位項目 e
'compact' 属性の使用法
「項目 2」という見出しの下位項目が開いた状態ではない(訳注:折りたたまれた状態である)ことを示すために、'compact' 属性を使ったことに注意してください。そこ以外に 'compact' 属性は無いので、他の見出しは開いた状態です。
表示例のようになるデフォルトスタイルルールの一例
ol.xoxo { list-style:decimal; }
ol.xoxo ol { list-style:lower-latin; }
ol[compact="compact"] { display:none; }
別の簡単な例
マークアップが簡単なまま表現を豊かにすることが可能であることを示す、MarkP による例の一式があります。
- グループを入れ子にした XO。これも XHTML に直接埋め込める
- standalone XHTML ページとしての XO(妥当な XHTML です)
- CSS でレイアウトした standalone XHTML としての XO(これも妥当な XHTML です)
- Chris Holland Outline Helper:上の例に手を加え、簡単のため CSS をコピーし、outlines.css と outlines.js への参照を追加して、compact 属性をつけた別の ul/ol/li を組み合わせて貼り付けた例
- セマンティックな指針に適合させようとする時、ol や ul 要素の "compact" 属性は、表示状態を操作する物となります。スクリプトの中で、スタイルに柔軟性を持たせるために下位項目を持つ li 要素にクラスを設定しました。CSS の指導者的立場の人達は、「'compact' 属性が設定されている ol ノードを含む li ノードを選択する」他の CSS セレクターで "li.expanded" を置き換えられるかもしれません。
- 「'compact' 属性が設定されている ol ノードを含む li ノードを選択する」CSS セレクターは「li ol[compact="compact"」になるでしょう(訳注:このセレクターは目的のノードを選択しません)。
- セマンティックな指針に適合させようとする時、ol や ul 要素の "compact" 属性は、表示状態を操作する物となります。スクリプトの中で、スタイルに柔軟性を持たせるために下位項目を持つ li 要素にクラスを設定しました。CSS の指導者的立場の人達は、「'compact' 属性が設定されている ol ノードを含む li ノードを選択する」他の CSS セレクターで "li.expanded" を置き換えられるかもしれません。
Properties of Outline Items
Outlines typically consist of a hierarchy of points and subpoints. Each of those points (outline items) itself may have some properties (AKA attributes or metadata) that need to be represented. Perhaps the most common additional property on outline items in practice is the URL as demonstrated in Mark Pilgrim's examples above. Even the text label/title of an outline item could be considered a common property. A few such common properties:
- text
- description
- url (often called xmlurl or htmlurl; sometimes called permalink)
- title
- type (hint of the MIME type of the resource indicated by the URL)
In general, properties on an outline item <li>
are represented by a nested definition list <dl>
. Strictly speaking, it is the first <dl>
inside the <li>
and before any following <ol>
, <ul>
, or <li>
, e.g. here is an item "item 1" with a description property (the subpoints are there purely as a point of reference to an earlier example).
<ol class='xoxo'> <li>item 1 <dl> <dt>description</dt> <dd>This item represents the main point we're trying to make.</dd> </dl> <ol> <li>subpoint a</li> <li>subpoint b</li> </ol> </li>
Special Properties
There are a handful of special properties which we are able to represent more directly and conveniently with the semantic XHTML building blocks that we have included, instead of terms in a definition list. Mostly taken from the above list of common properties, these are:
- text, url, title, type, and rel (short for relationship)
If we were to represent them simply as definition terms (including the "description" property from the previous example), they might look something like this:
Example for the sake of discussion only / not a canonical XOXO example:
<ol class='xoxo'> <li> <dl> <dt>text</dt> <dd>item 1</dd> <dt>description</dt> <dd> This item represents the main point we're trying to make.</dd> <dt>url</dt> <dd>http://example.com/more.xoxo</dd> <dt>title</dt> <dd>title of item 1</dd> <dt>type</dt> <dd>text/xml</dd> <dt>rel</dt> <dd>help</dd> </dl> </li>
However, by taking advantage of the semantic <a href>
element, we are able to dramatically simplify the common cases that utilize these properties. From a parser's perspective, this applies to the first <a href>
element directly inside the <li>
.
Actual XOXO Example:
<ol class='xoxo'> <li><a href="http://example.com/more.xoxo" title="title of item 1" type="text/xml" rel="help">item 1</a> <!-- note how the "text" property is simply the contents of the <a> element --> <dl> <dt>description</dt> <dd>This item represents the main point we're trying to make.</dd> </dl> </li>
Any other properties are simply added to the definition list in the same way as the "description" property.
Publishing XOXO
XOXO may be published in two forms, valid XHTML, and simple well-formed XML.
Valid XHTML XOXO
A valid XHTML XOXO page is a complete XHTML document.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>XOXO page</title> </head> <body> <ol class="xoxo"> <li><a href="URL-one">TEXT-one</a></li> <li><a href="URL-two">TEXT-two</a></li> ... </ol> </body> </html>
Simple well-formed XML XOXO
The root element of a simple well-formed XML XOXO page is either an ol
or ul
with class name of "xoxo". This variant is ideal for syndication and transclusion into (X)HTML pages with AHAH.
<ol class="xoxo"> <li><a href="URL-one">TEXT-one</a></li> <li><a href="URL-two">TEXT-two</a></li> ... </ol>
Content-Type
Valid or well-formed XHTML XOXO SHOULD be served with this Content-Type header for maximum browser compatibility.
Content-Type: text/html; charset=utf-8
It MUST be served with one of these Content-Type headers:
Content-Type: text/html; charset=utf-8 Content-Type: application/xhtml+xml Content-Type: application/xml
Examples in the Wild
This section is informative.
There are many wild examples. Nearly every blogroll on the Web can be parsed as XOXO, since they are typically an unordered list of list items of hyperlinks, which is within the XOXO profile. List examples here, when the list becomes too long we can move to a dedicated page.
Implementations
This section is informative.
- CVarious S5 tools
- Christian Neukirchen has written a xoxo.rb, a XOXO parser and generator for Ruby
- Odeo publishes users' subscription lists in XOXO. See Ryan King's list here.
- Les Orchard has written a nice XOXO outline editor in javascript.
- http://homepage.mac.com/ctholland/thelab/outlines/ is a great demonstration of dynamic interactive XOXO with use of "compact" and DHTML to collapse/expand.
- http://tool-man.org/examples/sorting.html is a great demonstration of drag and drop sortable XOXO lists with javascript and CSS.
- http://www.opendarwin.org/~drernie/xoxo-datatypes.html Mapping XOXO to Mac OS X property lists
- single line of rails to convert XOXO to HTML
Sample Code
- See the xoxo-sample-code page for open source sample code to read and write XOXO files.
- See also the xoxo-compact-sample page with source for CSS and JS that alters the look and feel of some very plain XOXO to have twiddlable triangles for nested lists that respect the compact attribute as well.
XOXO Schemas
This section is informative.
Note: these may be out of date and require updating to reflect the use of <dl> for annotating XOXO items with arbitrary properties.
References
Normative References
Informative References
This section is informative.
- Attention.xml
- VoteLinks
- XHTML 1.1
- OPML 1.0
- Contributed from http://developers.technorati.com/wiki/XOXO
Similar Work
- XHTML Outlines - DannyAyers independently came up with idea in 2003 October (just a month or two before Kevin and Tantek independently came up with XOXO) to use a simple profile of XHTML to semantically represent outlines using existing building blocks from XHTML.
- XOW - making them editable, producing RDF and bookmark lists from them (DannyAyers)
- XBEL, or the XML Bookmark Exchange Language, an open XML standard for sharing Internet URIs, also known as bookmarks (or favorites in Internet Explorer).
- OPML (Outline Processor Markup Language), an XML format for outlines.
Related Reading
- Questionable Content comic #493 - apparently the Faye character is a fan of XOXO.
Promotional Materials / Schwag
- There is an entire XOXO clothing and accessories line. Buy XOXO stuff online.
Discussions
This specification is a work in progress. As additional aspects are discussed, understood, and written, they will be added. There is a separate document where we are keeping our brainstorms and other explorations relating to XOXO:
- See xoxo-brainstorming for additional thoughts on how to use XOXO for specific uses.
- See also blogs discussing this page.
Q&A
- If you have any questions about XOXO, check the xoxo-faq, and if you don't find answers, add your questions!
Issues
- Please add any issues with the specification to the separate xoxo-issues document.