02. HTMLとDITAのコードサンプル比較
2009年09月08日 11:58
HTMLはドキュメント構造を、DITAはコンテンツの構造を表す
HTMLは構造を表すべきで、スタイル（見た目）はCSSで制御すべき、とよく言われますが、どんなにストリクトにこの原則を守ったとしても、HTMLはWebドキュメントの構造を表すマークアップ言語なので、どうしてもレイアウト要素が残ります。
例えば、リストを表すタグ。確かに、
code 3
よりは
code 4
の方が構造的に見えます。
情報構造をXMLで表すDITA標準では、何をなぜどのようにしてリストで表現するのか、にまで踏み込みます。
DITA流のタスクの構造化アプローチ
なぜリストか？それはタスクの手順を表現しているからです。
そこで、DITAではタスク型リストをさらに
- 前の状態
- コンテクスト
- ステップ
- 結果
- 例
- 事後の状態
の６要素に分解します（全部が必須ではなく省略も可能）。ステップはリピート可能です。
各ステップはさらに、
- コマンド
- 情報
- サブステップ
- チュートリアル情報
- ステップ例
- 選択肢
- ステップ実行結果
に分かれます（コマンド以外は省略可能）。
この構造を繰り返すことで、タスクを記述するのです。
したがって、上記のHTMLで表したコンテンツをDITAで構造化すると、
DITAでタスクを記述した例
code 5
のようになります。これを
メニューの表示方法
・アイコンをクリック
・メニューが表示される
と表現するのはWebならではの表現スタイルの一つでしかない、と。確かに初心者向けの印刷物と携帯サイトでは、同じ内容でも見せ方が全く異なりますね。
そして、ストリクトなHTMLはこの特殊なスタイルを実現するためのドキュメント（ページ）構造を表すものであって、情報そのものの構造ではない、と。
コンテンツ（情報）を構造化するノウハウが詰まったDITA
このように、DITAは単なるXMLの技術仕様ではなく情報を構造化するための考え方の標準、といえます。実際にコンテンツをDITAで記述しなくても、構造化の考え方は参考になります。うちのCMSはDITAには対応していない、テクニカルライティングではないから関係ない、とスルーしてしまってはもったいないですね。
注釈
- 実際のDITAでは、taskはもっと細かく定義されています