Google Git
Sign in
apache / lenya / a5d955479e9b18e95769f2e099895787404c4036 / . / docs / 2_0_x / concepts / wysiwyg.html
blob: 336de8c316f2fd6f07ad18b744f05df3b3057af4 [file] [log] [blame]
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<META http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta content="Apache Forrest" name="Generator">
<meta name="Forrest-version" content="0.9-dev">
<meta name="Forrest-skin-name" content="pelt">
<title>WYSIWYG</title>
<link type="text/css" href="../../../skin/basic.css" rel="stylesheet">
<link media="screen" type="text/css" href="../../../skin/screen.css" rel="stylesheet">
<link media="print" type="text/css" href="../../../skin/print.css" rel="stylesheet">
<link type="text/css" href="../../../skin/profile.css" rel="stylesheet">
<script src="../../../skin/getBlank.js" language="javascript" type="text/javascript"></script><script src="../../../skin/getMenu.js" language="javascript" type="text/javascript"></script><script src="../../../skin/fontsize.js" language="javascript" type="text/javascript"></script>
<link rel="shortcut icon" href="../../../favicon.ico">
</head>
<body onload="init()">
<script type="text/javascript">ndeSetTextSize();</script>
<div id="top">
<!--+
|breadtrail
+-->
<div class="breadtrail">
<a href="http://www.apache.org/">apache</a> &gt; <a href="http://lenya.apache.org/">lenya</a><script src="../../../skin/breadcrumbs.js" language="JavaScript" type="text/javascript"></script>
</div>
<!--+
|header
+-->
<div class="header">
<!--+
|start group logo
+-->
<div class="grouplogo">
<a href=""><img class="logoImage" alt="Lenya" src="../../../images/apache-lenya-light.png" title=""></a>
</div>
<!--+
|end group logo
+-->
<!--+
|start Project Logo
+-->
<div class="projectlogo">
<a href=""></a>
</div>
<!--+
|end Project Logo
+-->
<!--+
|start Search
+-->
<div class="searchbox">
<form action="http://www.google.com/search" method="get" class="roundtopsmall">
<input value="lenya.apache.org" name="sitesearch" type="hidden"><input onFocus="getBlank (this, 'Search the site with ');" size="25" name="q" id="query" type="text" value="Search the site with ">&nbsp;
<input name="Search" value="Search" type="submit">
</form>
</div>
<!--+
|end search
+-->
<!--+
|start Tabs
+-->
<ul id="tabs">
<li>
<a class="unselected" href="../../../index.html">Project</a>
</li>
<li>
<a class="unselected" href="../../../docs/index.html">Developer</a>
</li>
<li>
<a class="unselected" href="../../../community/index.html">Community</a>
</li>
<li class="current">
<a class="selected" href="../../../docs/2_0_x/index.html">Version 2.0</a>
</li>
<li>
<a class="unselected" href="../../../docs/1_2_x/index.html">Version 1.2</a>
</li>
</ul>
<!--+
|end Tabs
+-->
</div>
</div>
<div id="main">
<div id="publishedStrip">
<!--+
|start Subtabs
+-->
<div id="level2tabs"></div>
<!--+
|end Endtabs
+-->
<script type="text/javascript"><!--
document.write("Last Published: " + document.lastModified);
// --></script>
</div>
<!--+
|breadtrail
+-->
<div class="breadtrail">
&nbsp;
</div>
<!--+
|start Menu, mainarea
+-->
<!--+
|start Menu
+-->
<div id="menu">
<div onclick="SwitchMenu('menu_selected_1.1', '../../../skin/')" id="menu_selected_1.1Title" class="menutitle" style="background-image: url('../../../skin/images/chapter_open.gif');">Version 2.0</div>
<div id="menu_selected_1.1" class="selectedmenuitemgroup" style="display: block;">
<div class="menuitem">
<a href="../../../docs/2_0_x/index.html">Index</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/faq.html">FAQs</a>
</div>
<div onclick="SwitchMenu('menu_1.1.3', '../../../skin/')" id="menu_1.1.3Title" class="menutitle">Installation</div>
<div id="menu_1.1.3" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/2_0_x/installation/index.html">Download</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/installation/subversion.html">Subversion Access</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/installation/source_version.html">Install Instructions</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.4', '../../../skin/')" id="menu_1.1.4Title" class="menutitle">Tutorials</div>
<div id="menu_1.1.4" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/2_0_x/tutorials/newpublication/index.html">Create a Publication</a>
</div>
<div onclick="SwitchMenu('menu_1.1.4.2', '../../../skin/')" id="menu_1.1.4.2Title" class="menutitle">Create a Resource Type</div>
<div id="menu_1.1.4.2" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/2_0_x/tutorials/resourcetype/part1.html">Declaration</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/tutorials/resourcetype/part2.html">Creation</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/tutorials/resourcetype/part3.html">Presentation</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/tutorials/resourcetype/part4.html">Editing (One-Form)</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/tutorials/resourcetype/part5.html">Editing (BXE)</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.4.3', '../../../skin/')" id="menu_1.1.4.3Title" class="menutitle">Implement a Usecase</div>
<div id="menu_1.1.4.3" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/2_0_x/tutorials/usecase/part1.html">Prerequisites</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/tutorials/usecase/part2.html">The Usecase</a>
</div>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/tutorials/setupide/index.html">Setting up Eclipse</a>
</div>
<div onclick="SwitchMenu('menu_1.1.4.5', '../../../skin/')" id="menu_1.1.4.5Title" class="menutitle">Proxying</div>
<div id="menu_1.1.4.5" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/2_0_x/tutorials/proxy/proxying.html">Proxying</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/tutorials/proxy/proxy.html">mod_proxy</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/tutorials/proxy/mod_proxy_ajp.html">mod_proxy_ajp</a>
</div>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/tutorials/bestpractises.html">Best Practises</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/tutorials/production.html">Production Checklist</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/tutorials/tests.html">Writing Tests</a>
</div>
</div>
<div onclick="SwitchMenu('menu_selected_1.1.5', '../../../skin/')" id="menu_selected_1.1.5Title" class="menutitle" style="background-image: url('../../../skin/images/chapter_open.gif');">Concepts</div>
<div id="menu_selected_1.1.5" class="selectedmenuitemgroup" style="display: block;">
<div class="menuitem">
<a href="../../../docs/2_0_x/concepts/publication.html">Publication</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/concepts/documents.html">Working with Documents</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/concepts/authoring_live.html">Authoring and Live mode</a>
</div>
<div class="menupage">
<div class="menupagetitle">WYSIWYG</div>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.6', '../../../skin/')" id="menu_1.1.6Title" class="menutitle">Technical Reference</div>
<div id="menu_1.1.6" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/2_0_x/reference/lenya-sitemaps.html">Overview of Lenya Sitemaps</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/reference/repository/index.html">Repository</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/reference/ac.html">Access Control Specification</a>
</div>
<div onclick="SwitchMenu('menu_1.1.6.4', '../../../skin/')" id="menu_1.1.6.4Title" class="menutitle">Usecase Framework</div>
<div id="menu_1.1.6.4" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/2_0_x/reference/usecase-framework/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/reference/usecase-framework/abstractusecase.html">AbstractUsecase</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.6.5', '../../../skin/')" id="menu_1.1.6.5Title" class="menutitle">Publications</div>
<div id="menu_1.1.6.5" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/2_0_x/reference/publication/configuration.html">Configuration</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/reference/publication/publication-templating/index.html">Publication Templating</a>
</div>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/reference/resource-types.html">Resource Types</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/reference/modules/index.html">Modules</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/reference/metadata.html">Meta data</a>
</div>
<div onclick="SwitchMenu('menu_1.1.6.9', '../../../skin/')" id="menu_1.1.6.9Title" class="menutitle">Protocols</div>
<div id="menu_1.1.6.9" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/2_0_x/reference/protocols/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/reference/protocols/lenya.html">lenya Protocol</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/reference/protocols/lenya-document.html">lenya-document Protocol</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/reference/protocols/site.html">site Protocol</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/reference/protocols/lenyadoc.html">lenyadoc Protocol</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.6.10', '../../../skin/')" id="menu_1.1.6.10Title" class="menutitle">URLs and Links</div>
<div id="menu_1.1.6.10" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/2_0_x/reference/urlMapping.html">URL Mapping</a>
</div>
<div class="menuitem">
<a href="../../../docs/2_0_x/reference/link-management.html">Link Management</a>
</div>
</div>
</div>
<div class="menuitem">
<a href="../../../apidocs/2.0/index.html">Core API</a>
</div>
<div onclick="SwitchMenu('menu_1.1.8', '../../../skin/')" id="menu_1.1.8Title" class="menutitle">Core Modules</div>
<div id="menu_1.1.8" class="menuitemgroup">
<div onclick="SwitchMenu('menu_1.1.8.1', '../../../skin/')" id="menu_1.1.8.1Title" class="menutitle">ac</div>
<div id="menu_1.1.8.1" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/ac/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/ac/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.8.2', '../../../skin/')" id="menu_1.1.8.2Title" class="menutitle">acusecases</div>
<div id="menu_1.1.8.2" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/acusecases/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/acusecases/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.8.3', '../../../skin/')" id="menu_1.1.8.3Title" class="menutitle">administration</div>
<div id="menu_1.1.8.3" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/administration/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/administration/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.8.4', '../../../skin/')" id="menu_1.1.8.4Title" class="menutitle">cache</div>
<div id="menu_1.1.8.4" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/cache/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/cache/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.8.5', '../../../skin/')" id="menu_1.1.8.5Title" class="menutitle">janitor</div>
<div id="menu_1.1.8.5" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/janitor/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/janitor/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.8.6', '../../../skin/')" id="menu_1.1.8.6Title" class="menutitle">ldap</div>
<div id="menu_1.1.8.6" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/ldap/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/ldap/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.8.7', '../../../skin/')" id="menu_1.1.8.7Title" class="menutitle">linking</div>
<div id="menu_1.1.8.7" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/linking/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/linking/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.8.8', '../../../skin/')" id="menu_1.1.8.8Title" class="menutitle">observation</div>
<div id="menu_1.1.8.8" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/observation/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/observation/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.8.9', '../../../skin/')" id="menu_1.1.8.9Title" class="menutitle">properties</div>
<div id="menu_1.1.8.9" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/properties/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/properties/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.8.10', '../../../skin/')" id="menu_1.1.8.10Title" class="menutitle">sitemanagement</div>
<div id="menu_1.1.8.10" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/sitemanagement/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/sitemanagement/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.8.11', '../../../skin/')" id="menu_1.1.8.11Title" class="menutitle">templating</div>
<div id="menu_1.1.8.11" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/templating/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/templating/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.8.12', '../../../skin/')" id="menu_1.1.8.12Title" class="menutitle">usecase</div>
<div id="menu_1.1.8.12" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/usecase/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/usecase/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.8.13', '../../../skin/')" id="menu_1.1.8.13Title" class="menutitle">workflow</div>
<div id="menu_1.1.8.13" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/workflow/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/workflow/index.html">API</a>
</div>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9', '../../../skin/')" id="menu_1.1.9Title" class="menutitle">Standard Modules</div>
<div id="menu_1.1.9" class="menuitemgroup">
<div onclick="SwitchMenu('menu_1.1.9.1', '../../../skin/')" id="menu_1.1.9.1Title" class="menutitle">blog</div>
<div id="menu_1.1.9.1" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/blog/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/blog/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.2', '../../../skin/')" id="menu_1.1.9.2Title" class="menutitle">bxe</div>
<div id="menu_1.1.9.2" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/bxe/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/bxe/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.3', '../../../skin/')" id="menu_1.1.9.3Title" class="menutitle">cforms</div>
<div id="menu_1.1.9.3" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/cforms/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/cforms/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.4', '../../../skin/')" id="menu_1.1.9.4Title" class="menutitle">collection</div>
<div id="menu_1.1.9.4" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/collection/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/collection/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.5', '../../../skin/')" id="menu_1.1.9.5Title" class="menutitle">contactform</div>
<div id="menu_1.1.9.5" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/contactform/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/contactform/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.6', '../../../skin/')" id="menu_1.1.9.6Title" class="menutitle">development</div>
<div id="menu_1.1.9.6" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/development/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/development/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.7', '../../../skin/')" id="menu_1.1.9.7Title" class="menutitle">editors</div>
<div id="menu_1.1.9.7" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/editors/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/editors/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.8', '../../../skin/')" id="menu_1.1.9.8Title" class="menutitle">export</div>
<div id="menu_1.1.9.8" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/export/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/export/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.9', '../../../skin/')" id="menu_1.1.9.9Title" class="menutitle">fckeditor</div>
<div id="menu_1.1.9.9" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/fckeditor/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/fckeditor/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.10', '../../../skin/')" id="menu_1.1.9.10Title" class="menutitle">kupu</div>
<div id="menu_1.1.9.10" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/kupu/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/kupu/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.11', '../../../skin/')" id="menu_1.1.9.11Title" class="menutitle">languageselector</div>
<div id="menu_1.1.9.11" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/languageselector/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/languageselector/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.12', '../../../skin/')" id="menu_1.1.9.12Title" class="menutitle">lenyadoc</div>
<div id="menu_1.1.9.12" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/lenyadoc/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/lenyadoc/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.13', '../../../skin/')" id="menu_1.1.9.13Title" class="menutitle">linkcheck</div>
<div id="menu_1.1.9.13" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/linkcheck/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/linkcheck/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.14', '../../../skin/')" id="menu_1.1.9.14Title" class="menutitle">links</div>
<div id="menu_1.1.9.14" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/links/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/links/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.15', '../../../skin/')" id="menu_1.1.9.15Title" class="menutitle">lucene</div>
<div id="menu_1.1.9.15" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/lucene/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/lucene/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.16', '../../../skin/')" id="menu_1.1.9.16Title" class="menutitle">migration</div>
<div id="menu_1.1.9.16" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/migration/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/migration/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.17', '../../../skin/')" id="menu_1.1.9.17Title" class="menutitle">neutron</div>
<div id="menu_1.1.9.17" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/neutron/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/neutron/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.18', '../../../skin/')" id="menu_1.1.9.18Title" class="menutitle">news</div>
<div id="menu_1.1.9.18" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/news/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/news/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.19', '../../../skin/')" id="menu_1.1.9.19Title" class="menutitle">notification</div>
<div id="menu_1.1.9.19" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/notification/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/notification/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.20', '../../../skin/')" id="menu_1.1.9.20Title" class="menutitle">opendocument</div>
<div id="menu_1.1.9.20" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/opendocument/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/opendocument/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.21', '../../../skin/')" id="menu_1.1.9.21Title" class="menutitle">prettyprinting</div>
<div id="menu_1.1.9.21" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/prettyprinting/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/prettyprinting/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.22', '../../../skin/')" id="menu_1.1.9.22Title" class="menutitle">profiling</div>
<div id="menu_1.1.9.22" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/profiling/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/profiling/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.23', '../../../skin/')" id="menu_1.1.9.23Title" class="menutitle">resource</div>
<div id="menu_1.1.9.23" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/resource/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/resource/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.24', '../../../skin/')" id="menu_1.1.9.24Title" class="menutitle">simplesite</div>
<div id="menu_1.1.9.24" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/simplesite/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/simplesite/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.25', '../../../skin/')" id="menu_1.1.9.25Title" class="menutitle">sitetree</div>
<div id="menu_1.1.9.25" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/sitetree/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/sitetree/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.26', '../../../skin/')" id="menu_1.1.9.26Title" class="menutitle">sourcerepository</div>
<div id="menu_1.1.9.26" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/sourcerepository/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/sourcerepository/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.27', '../../../skin/')" id="menu_1.1.9.27Title" class="menutitle">svg</div>
<div id="menu_1.1.9.27" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/svg/roundedcorners.html">Rounded Corners</a>
</div>
<div class="menuitem">
<a href="../../../docs/modules/svg/resizeimages.html">Resizing Images</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/svg/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.28', '../../../skin/')" id="menu_1.1.9.28Title" class="menutitle">tinymce</div>
<div id="menu_1.1.9.28" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/tinymce/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/tinymce/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.29', '../../../skin/')" id="menu_1.1.9.29Title" class="menutitle">usecasedocument</div>
<div id="menu_1.1.9.29" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/usecasedocument/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/usecasedocument/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.30', '../../../skin/')" id="menu_1.1.9.30Title" class="menutitle">webdav</div>
<div id="menu_1.1.9.30" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/webdav/index.html">Getting started</a>
</div>
<div class="menuitem">
<a href="../../../docs/modules/webdav/monitoring.html">Monitoring</a>
</div>
<div class="menuitem">
<a href="../../../docs/modules/webdav/webdav.html">WebDAV Servers</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/webdav/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.31', '../../../skin/')" id="menu_1.1.9.31Title" class="menutitle">xhtml</div>
<div id="menu_1.1.9.31" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/xhtml/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/xhtml/index.html">API</a>
</div>
</div>
<div onclick="SwitchMenu('menu_1.1.9.32', '../../../skin/')" id="menu_1.1.9.32Title" class="menutitle">xopus</div>
<div id="menu_1.1.9.32" class="menuitemgroup">
<div class="menuitem">
<a href="../../../docs/modules/xopus/index.html">Overview</a>
</div>
<div class="menuitem">
<a href="../../../../apidocs/2.0/modules/xopus/index.html">API</a>
</div>
</div>
</div>
</div>
<div id="credit"></div>
<div id="roundbottom">
<img style="display: none" class="corner" height="15" width="15" alt="" src="../../../skin/images/rc-b-l-15-1body-2menu-3menu.png"></div>
<!--+
|alternative credits
+-->
<div id="credit2">
<a href="http://wiki.apache.org/lenya/MeetingFreiburg2008"><img border="0" title="Meeting Freiburg 2008" alt="Meeting Freiburg 2008 - logo" src="../../../images/apache-lenya-meeting-freiburg-2008.png" style="width: 160px;height: 40px;"></a>
</div>
</div>
<!--+
|end Menu
+-->
<!--+
|start content
+-->
<div id="content">
<div title="Portable Document Format" class="pdflink">
<a class="dida" href="wysiwyg.pdf"><img alt="PDF -icon" src="../../../skin/images/pdfdoc.gif" class="skin"><br>
PDF</a>
</div>
<h1>WYSIWYG</h1>
<div id="front-matter">
<div id="minitoc-area">
<ul class="minitoc">
<li>
<a href="#Why+WYSIWYG+is+good+...">Why WYSIWYG is good ...</a>
<ul class="minitoc">
<li>
<a href="#Editing+without+WYSIWYG">Editing without WYSIWYG</a>
</li>
<li>
<a href="#WYSIWYG+hides+complexity+from+the+user">WYSIWYG hides complexity from the user</a>
</li>
</ul>
</li>
<li>
<a href="#...+and+why+WYSIWYG+can+be+bad+as+well">... and why WYSIWYG can be bad as well</a>
</li>
</ul>
</div>
</div>
<a name="N1000D"></a><a name="Why+WYSIWYG+is+good+..."></a>
<h2 class="h3">Why WYSIWYG is good ...</h2>
<div class="section">
<p>WYSIWYG (pronounce "vee-zee-weeg") stands for "What you see is what you get". To make most
people who's personal experience with computers does not at least date back into the 80ies, a little
history lesson is needed here. In case you have even used punch cards or you are a *IX person who
knows why vi is considered a visual editor (compared to ed), this section will not contain a lot of
news for you and you can safely skip to the next section. Anyone who grew up with windows
and mice read on.</p>
<a name="N10016"></a><a name="Editing+without+WYSIWYG"></a>
<h3 class="h4">Editing without WYSIWYG</h3>
<p>An electronic document - for example an HTML page - is nothing but a file on your system
which contains a character stream. You can edit an HTML page with a simple text editor such as
vi or Notepad. In that case, you have to put HTML tags into your text and ensure yourself that
the resulting file is valid and can be rendered by the browser.</p>
<p>This has nohting to do with WYSIWYG at all, as what you see on your screen while editing
looks entirely different than what you will see later in your browser when the HTML file is rendered.</p>
<p>While many people might have written their first HTML pages in a text editor, today it's hard
to imagine that early word processors worked the same way. You could not just select a word and hit
a button to make the world bold and immediately see the result, but you had to put control
characters into your text and could only see the result on paper after you printed the text to paper.
In the early days of word processing, the software did not even understand the control characters
but just sent them to the printer. Introducing printer independent control characters, which
were than mapped to the specific escape codes for a specific make and model of a printer
was already the first step of abstraction, which was considered an innovation when it was introduced.</p>
<p>Early word processors operated in text only mode which means that you cannot display different fonts,
font sizes of even bold or italic script on the screen at all. Later there have been graphic cards that
were able to display attributes such as bold or italic type, but it was never possible to display different
font sizes in text mode. Some word processors tried to compensate this by using colors.</p>
<a name="N10029"></a><a name="WYSIWYG+hides+complexity+from+the+user"></a>
<h3 class="h4">WYSIWYG hides complexity from the user</h3>
<p>The introduction of graphical user interfaces probably was the single most important enabler
to WYSIWYG word processors as well as any other kind of WYSIWYG editors, for example for spreadsheets,
presentation slides or illustrations.</p>
<p>With WYSIWYG (together with some other technologies such as Postscript or TrueType fonts) it was
possible to display a text exactly the way it will be printed later. You don't see any control
characters any more on your screen (though they are still in the character stream) but you can
select a part of the text and assign a font, font size or attributed such as bold or italics. And
afterwards, you get an immediate visual feedback of what you have done and you can decide if this
is really what you intended to do.</p>
<p>WYSIWYG has two obvious advantages:</p>
<ul>
<li>The user does not have to learn any control characters or tags, but he or she can manipulate
the document through clicking on intuitive buttons and other GUI widgets, for example a drop down
list of available fonts.</li>
<li>You don't have to imagine how your document will look like later but you can see it building up
in front of your eyes. For example, you can type a text first and then mark and format the headlines.
Editing a large text document or even a graphical document without WYSIWYG requires a lot of imagination
or a lot of experience with similar document types to avoid having too many interations of putting something
in, than having to render it for preview and then going back to the source code.</li>
</ul>
<p>The introduction of WYSIWYG word processors lead to a whole wave of WYSIWYG tools. It became next to
impossible to sell any new application that could not claim it was WYSIWYG. Besides word processors, it
was HTML editors and page layout systems (DTP) which became increasingly popular.</p>
</div>
<a name="N10046"></a><a name="...+and+why+WYSIWYG+can+be+bad+as+well"></a>
<h2 class="h3">... and why WYSIWYG can be bad as well</h2>
<div class="section">
<p>If you are looking for an example of the limits of WYSIWYG, take a look at the idea of "visual programming".</p>
<p>Some of the most powerful software companies as well as some smaller innovative companies have tried to
deliver on the promise that it will be possible to replace writing of source code with clicking together
components visually using the mouse. Aside from very specific aspects such as GUI design and linking data to a
GUI nobody ever really made it.</p>
<p>Depending on who you ask and depending on your personal point of view, you may pick from one of these two
explainations:</p>
<ul>
<li>It cannot be done.</li>
<li>It does not make sense.</li>
</ul>
<p>The idea of visual programming is a bit like trying not to write a letter or a novel character by
character but by choosing text blocks from a library. It can certainly be done but you are very limited
in the thoughts that you can express. If you try to express a thought that is new and has never been
expressed with this system before, you cannot.</p>
<p>Taking it back on a technical level, there is a danger that indifferent application of the WYSIWYG
idea leads to either oversimplifying things or having to build a GUI that is overly complex and not intuitive
at all.</p>
</div>
</div>
<!--+
|end content
+-->
<div class="clearboth">&nbsp;</div>
</div>
<div id="footer">
<!--+
|start bottomstrip
+-->
<div class="lastmodified">
<script type="text/javascript"><!--
document.write("Last Published: " + document.lastModified);
// --></script>
</div>
<div class="copyright">
Copyright &copy;
2002-2007 <a href="http://www.apache.org/licenses/LICENSE-2.0">The Apache Software Foundation.</a>
</div>
<div id="feedback">
Send feedback about the website to:
<a id="feedbackto" href="mailto:dev@lenya.apache.org?subject=Feedback%C2%A0for%C2%A0docs/2_0_x/concepts/wysiwyg.html">dev@lenya.apache.org</a>
</div>
<!--+
|end bottomstrip
+-->
</div>
</body>
</html>