以下斜め読んだ内容

pseudo translation of useful posts, book reviews, remarks,etc. twitter: feeddict

Ron Garret「HTMLはオブジェクトコード」

斜め読み CSS

Rondam Ramblingsの2009年8月のエントリ

Rondam Ramblings: HTML is object code

2009年2月にテーブルレイアウト擁護論を公開した元GoogleのRon Garretによる、htmlのハンドコーディング禁止論

  • CSSレイアウトのもつ利点は、テーブルレイアウトでも実装可能
  • htmlのハンドコーディングはウェブの害悪の根源の１つ。

ウェブ標準な人からは出そうに無い感じの視点が出てて面白い。
いきなりCのソースコードとコンパイルされたコードを並べだしたので、斜め読み無理かもと思ったが、ソースコード／オブジェクトコードの理解が自分のように専門的でなくても斜め読みできた。
通念に反するためコメント欄が盛り上がり過ぎ。辿れない。
CSSアンチの議論の部分は自分は消化不良

以下斜め読んだ内容。
  • このエントリは・・・・
  • CSSレイアウトv.s.tableレイアウト再訪
    • 両陣営が見落としているポイント。
      • HTMLはオブジェクトコードである（もしくは、オブジェクトコードとして扱うべきである）。
  • ソースコードとオブジェクトコード
    • ソースコードは人間が読み書きする。
    • オブジェクトコードはコンパイラが生成するコード。なので人間が読み書きしない。
  • コンテンツとレイアウト情報の分離
    • tableレイアウトではこれができない。と、批判される。
    • この批判には暗黙の想定が２つ。これをこのエントリでは批判する。
  • tableレイアウト批判における暗黙の想定
    • htmlは「ソース」コードである（オブジェクトコードではない）。
    • 分離されたコンテンツとレイアウト情報の結合・マージは「ブラウザで」（クライアントサイドで）やるべき。
  • 暗黙の想定は両方とも間違い。
    • 分離と結合はサーバーサイドでできるから
    • htmlはソースコードではないから。
  • 「サーバーサイド」でもコンテンツとレイアウト情報の分離と結合は可能
    • クライアントサイド限定にする理由無し。
    • 例。htmlテンプレート
      • コンテンツとレイアウト情報は分離しつつ、結合できることがわかる。
    • htmlテンプレートとtableレイアウトを組み合わせる
      • 既に謳われてるtableレイアウトのデメリットは解決済
      • 「楽々クロスブラウザ対策」（＝tableレイアウトの最大のメリット）を享受できる
  • htmlは「オブジェクト」コード（、とみなすべき）
    • htmlはハンドコーディングすべきではない
    • サーバーサイドでコンパイラから生成させるべき
    • htmlはオブジェクトコードとしてのみ扱われるべき。
      • オブジェクトコードとして＝人間が読み書きしないコードとして。
      • 例外は、急いでるときとか暫定的な場面（quick-and-dirty hacks）
    • ハンドコードされたhtmlコードは多くのウェブの害悪の根源
  • html作成の正しいやり方
    • プログラミング言語による生成。
    • 高次の抽象化を実装する（building higher-order abstractions）ことでウェブページを生成させる
    • この役割を果たす言語は関数型だと思うが、その辺は自分はドグマを持っていない。
  • form要素
    • htmlはハンドコーディングすべきではないことが、一番よくわかる。
    • 日付を入力するタイプのformへ、カレンダー式のウィジェット機能を追加したい。
      • CSSにできることは皆無。リクエストへの対応が大変になる。
    • form要素をサーバーサイドで生成するテンプレート言語での実装
      • コンテンツとレイアウト情報を分離させたまま、ウィジェット機能追加のようなリクエストへ簡単に対応できる
  • tableレイアウトはアクセシブルではない、とされる件
    • htmlがソースコードであるとみなしているから。こういう意見がでる。
    • 複数のhtmlソースを用意する必要もない。
      • DRY (don't-repeat-yourself)の原則に従う
    • ユーザエージェントに応じて、異なるhtml（or音声ファイルなど別のファイル形式）を生成すればいい話。
    • ソースコードでは、高次のレイアウト情報を定義
HTMLテンプレートの例

<table>

<tr><td colspan=3> %header

<tr><td> %leftnav <td> %center <td> %rightnav

<tr> <td colspan=3> %footer

</table>

form要素の例

<form method="GET" action="date-foo">

Enter the date:

<input type="text" class="dateinput" name="date">

<input type=submit>

</form>

form要素をサーバーサイドで生成させるテンプレート言語のコード例

<standard-form>

<date-input label="Enter the date">

</standard-form>

コメント

formにウィジェット機能を追加の例では、CSSでは無理だけど、JSでオンザフライで書けると思うがその選択肢はどう考えてるんだろ？

Ron Garret氏