WYSIWYMとは？ わかりやすく解説

相互作用の技術については「WYSIWYM (相互作用の技術)（英語版）」をご覧ください。

コンピューティングにおいてWhat You See Is What You Mean (WYSIWYM, [ˈwɪziwɪm]^{[注釈 1]})とは、構造化文書の編集ないしエディタに関するパラダイムである。これはWYSIWYG（What You See Is What You Get）の補完であり、コードをむき出しで表示するのではなく、画面上や印刷物で表示されるのと同じ形式の文書結果を表示する^[1][2]。

WYSIWYMエディタでは、ユーザーは構造化された方法でコンテンツを記述し、その意味や文書内での役割に応じて内容をマークアップする。最終的な表現は、1つ以上の独立したスタイルシートに委ねられる。 つまり、この概念は文書の実際の形式ではなく、伝達されている「内容そのもの」を正確に表示することを目的とする^[3]。

例えば、WYSIWYM文書では、テキストを手動で「文書のタイトル」「セクション名」「図表のキャプション」「著者名」などとしてマークアップする。これにより、セクション見出しなどの要素が、あるスタイルシートでは太字の大きな文字で、別のスタイルシートでは赤色の中央揃えテキストで表示されるなど、最終的な表現を自動的に制御できる^[4]。 通常、このような機能を活用するには、文書を執筆する前に、意味的構造を事前に決めておかねばならない。 エディタには、指定された構造に従って文書の最終形式を生成するための、構造化コンテンツのエクスポート機能も必要である。

このパラダイムの最大の利点は、完璧な内容と表現の分離（英語版）を実現している点である。ユーザーは一度文書の構造を定義し、内容を記述すれば、その後は表現を切り替える必要がなくなる。この方法には、独自の切り替え費用（英語版）が伴う従来の手法と比べて、大きな利点がある。 フォーマットの描画処理をエクスポートに委ねることで、デザインの一貫性をより容易に実現できる。

構造化されていない固定配置の文書とは異なり、WYSIWYMを実現するにはワードプロセッサではなく文書処理ソフトウェアを使う。 WYSIWYMという概念を明確に定義した最初の文書処理器は^[5]、LyXだった。ただし、これと類似した概念は、LaTeX、TPS（Xerox PARCの先駆的な研究をモデルにしたもの）、およびFrameMakerといった初期の出版システムにも見出せる。

例えばFrameMakerでは、文書の作成（閲覧・編集）において、「フォーマット」と呼ばれるスタイルタグと文書内容は「本文ページ」に配置され、構造と表現は「マスターページ」で定義される^{[注釈 2]}。 このような複数の文書を相互にリンクさせ、さまざまな用途に応じて条件分岐処理をプログラムすることも可能である。 これらの要素は、マークアップ言語（XML/HTML/CSS/PDFなど）へのエクスポート時にその機能の一部または全部を保持するように、対応するタグに変換できます。あるいは、PostScriptから生テキストに至るまで、さまざまな形式で直接レンダリングすることも可能です。

WYSIWYMの哲学に対する別の手法を採用しているのがGNU TeXmacsだ。これは、文書構造の画面上表示と、ほぼ忠実なWYSIWYGレンダリングを組み合わせている^[7]。

主要なベンダーは、自社のWYSIWYG製品にウェブページ作成機能を統合し、その利便性を高めている。 例えばユーザーはWeb開発の技術を持たずとも、ワードプロセッサ上でウェブページを作成している。ただし、ほとんどのIDEで作成されるウェブマークアップや手書きのマークアップと同様、これらのツールがソースフォーマットを自動解析する際、HTMLのコンテンツとCSSなどの手段による表現の区別を適切に考慮することは稀である^[要出典]。

このような固定表示のHTML生成ツールは、主にコードの肥大化（英語版）と低品質さから批判を受けており^[8][9]、WYSIWYMモデルの変更を求める声も上がっている^[10][11][12]。

WYMeditorはWYSWYMウェブページエディタの一例である^[13]。

このエディタでは、文書の構造がHTML要素のclass属性により決まる。これらのクラスはまた文書の最終的な外観を適用することもできる。ただWYMeditorはWYSIWYMモデルに従い、文書の形式は常にHTMLであって、その最終的な出力は常にこれらのクラスに対し表示要素を適用することによって構築される

その他のCMSはユーザーがコンテンツを編集するときWYSIWYMインターフェースを提供する方面に発展している。

• 文書マークアップ言語の比較（英語版）
• 軽量マークアップ言語
• マークアップ言語の一覧（英語版）
• シングルソースパブリッシング（英語版）

1. ^ 「あなたが見るものがあなたの意味するところである」の意
2. ^ 厳密に言えば、このFrameMakerのページビューに関する説明は、いわゆる「非構造化文書」にのみに当てはまる。これらのページビューは、異なる種類の文書を作成するために使用される、よく知られたFrameMakerのモードと混同しないよう注意されたい。非構造化文書用のモードは「非構造化フレームメーカー」または単に「フレームメーカー」と呼ばれ、いわゆる「構造化文書」用のモードは「構造化フレームメーカー」と言われる。フレームメーカー12以降では、さらに「フレームメーカー XML オーサー」と呼ばれる第三のモードも提供されています^[6]。

1. ^ “What is WYSIWYG (what you see is what you get)? - Definition from WhatIs.com” (英語). WhatIs.com. 2019年7月23日閲覧。
2. ^ “WYSIWYM -- Integrated Visualization, Exploration and Authoring of Un-structured and Semantic Content” (英語). www.semantic-web-journal.net. 2024年4月24日閲覧。
3. ^ “WYSIWYM - EduTech Wiki”. edutechwiki.unige.ch. 2019年7月23日閲覧。
4. ^ “LyX | What is LyX?”. www.lyx.org. 2019年7月23日閲覧。
5. ^ “Public release of LyX version 1.0.0”. www.mail-archive.com. 2019年4月23日閲覧。
6. ^ “Adobe FrameMaker 12”. help.adobe.com. 2019年4月23日閲覧。
7. ^ van der Hoeven, Joris (2001). “GNU TeXmacs, A free, structured, wysiwyg and technical text editor”. Cahiers Gutenberg 39-40: 39–50. http://cahiers.gutenberg.eu.org/fitem?id=CG_2001___39-40_39_0. 
8. ^ Spiesser, J., Kitchen, L.: Optimization of HTML automatically generated by WYSIWYG programs Archived 2021-03-01 at the Wayback Machine.. In: 13th International Conference on World Wide Web, pp. 355-364. WWW '04. ACM, New York, NY (New York, NY, USA, May 17–20, 2004)
9. ^ de Vries, D.J. (2010年10月29日). “RenovatioCMS - An innovative view”. 2010年9月12日時点のオリジナルよりアーカイブ。2010年10月29日閲覧。
10. ^ Roger Johansson. “456BereaStreet”. 456BereaStreet. 2012年8月2日閲覧。
11. ^ Peter Krantz (2006年12月5日). “standards-schmandards”. standards-schmandards. 2012年8月2日閲覧。
12. ^ “Thom Shannon's blog”. Ts0.com (2007年9月19日). 2012年2月7日時点のオリジナルよりアーカイブ。2012年8月2日閲覧。
13. ^ “WYMeditor: web-based XHTML editor”. 2011年5月27日閲覧。