editing host

仕様書

[10] HTML Standard (2017-02-20 18:15:56 +09:00) https://html.spec.whatwg.org/#best-practices-for-in-page-editors

意味

作成

contenteditable
designMode

[11] 著者は、editing host やこれを使って作成された要素において、 white-space: pre-wrap を設定するべき (encouraged) です。 >>10

[12] これは、 white-space: normal の場合に、利用者が複数個連続して空白を入力すると U+0020 と U+00A0 が自動的に併用されて、 U+00A0 のために行折り返しが不自然な表示となるためです。 >>10

挙動

[2] Enter を押すと、段落が改められます。

[3] div 要素内であれば、または特に要素内になければ、新たな div 要素が挿入されます。

[4] 末尾で新しい段落が挿入されると、新しい段落の中身は br 要素1つだけとなります。

問題

[23] 要素の境界を利用者がうまく扱う方法がありません。境界で入力したときにどちらに入るかは Webブラウザー次第で、利用者が指定する手段がありません。

[26] コピペや DnD でも境界のどちら側になるかはWebブラウザー次第です。例えば a 要素内に img 要素だけがあるとき、両者をまとめて他の位置に移動させる良い方法がありません。

[24] コピペで中途半端に CSS の指定が style 属性に保存されることがあります。どういう条件で何が保存されるのかは摩訶不思議です。

[14] コピペで要素や CSS を保存せずに貼り付けさせることができません。 (onpaste 時に貼り付けデータを得て自力で操作すればできないことはありませんが...)

[25] 画像のサイズ変更の UI は IE や Firefox が実装していますが、 Chrome や Safari が実装していません。

選択子

[13] :read-write と一致することがあります。

歴史

前史

[28] WorldWideWeb には編集モードがありました。

[8] Web の流行が始まった90年代中頃、 Netscape Navigator Gold や Microsoft FrontPage、ホームページビルダーといった WYSIWYG 型の HTMLエディターが登場しました。

しかしこの世代の製品は Webブラウザーとは別の独立したソフトウェアとして HTML の編集機能を提供していました。 Netscape Navigator Gold のように Webブラウザーと統合された製品も、 (内部的にどうなっていたのかは知りませんが、) 表示と編集は別々の機能で、表示中の文書を直接編集したり、編集機能を表示中の文書内に埋め込んだりすることはまだできませんでした。

[9] Microsoft Office は、独自の処理モデルを持った Web とは異なるソフトウェア群でしたが、この時期に Web から色々な機能を取り入れました。 HTML の読み書きに加えて、 Web 風の URL を指定したハイパーリンクのような機能も追加されていました。 ActiveX Document によって Internet Explorer の窓内に Microsoft Office の文書を表示することもできました。こうした一連の機能群で Microsoft が提示した世界観は、ある意味で後の時代の contenteditable のある Web を先取りしたものでした。 (現在の Google Docs はそれが完全に Web 上に移ったものと理解できましょう。)