wikigender.org:WYSIWYG

  • Edit
  • Discuss
  • History
From wikigender.org
Jump to: navigation, search

In its attempt to be open to the larger public, Wikigender uses a simple WYSIWYG editor. WYSIWYG is an acronym for What You See Is What You Get, used in computing to describe a system in which content displayed during editing appears very similar to the final output. WYSIWYG editors are a tool to translate common formatting options (e.g. bold text, italics, underline) into the wiki markup that is used by Wikigender. Users who are familiar with standard word processing tools (such as Microsoft's Word) will therefore not have any difficulty in drafting text in Wikigender.

FCKeditor

Wikigender uses the FCKeditor, a simple word processing tool to draft and format Wikigender articles. The editor provides a toolbar on top of each article that lists most common formatting options.

Toolbar of the FCK Editor used in Wikigender

These are:

Top row

  • Wikitext: allows users to switch back to wiki markup. Advanced users may find it easier and more convenient to work in wiki markup; for common users, we recommend to stay in the WYSIWYG mode
  • Cut (represented by scissors): cut highlighted text which can then be inserted at a different location
  • Copy (represented by two identical sheets): copy highlighted text which can then be inserted at a different location
  • Paste (represented by a notebook): insert text that has been cut or copied from a different location
  • Print (represented by a printer): send a document to the printer
  • Undo/Redo (represented by arrows to the left/right): undo or redo previous changes
  • Find (represented by binoculars): search for a specific word in the text
  • Replace (represented by an arrow between A and B): find and replace a specific word with another
  • Select All (represented by a green rectangle): highlight all the words in a specific location that can then be cut or copied
  • Remove Format (represented by a rubber): take of any formatting from a highlighted word or section
  • Insert Special Character (represented by a keyboard button): insert special characters such as €, ¢ or æ
  • Insert/Edit Table (represented by a table): create a table by selecting the number of rows and columns
  • Insert/Edit Image: insert an image (or document) that you have previously uploaded into Wikigender. For more information on how to upload documents, see
  • Insert Horizontal Line (self explanatory)
  • Insert/Edit Template (represented by a blue {T}): advanced users of Wikigender may want to create and use templates. Select from the list of existing templates (e.g. or create a new one.
  • Insert/Edit Special Tag (represented by a blue {S}): advanced users of Wikigender may want to create and use special tags. Select form the list of existing tags (e.g. "PageBy", which inserts the contributors of a page) or create a new tag.
  • Insert/Edit Reference (represented by a blue {R}): advanced users of Wikigender may want to insert a reference which will appear as a footnote at the end of the text
  • Insert/Edit Formula (represented by the Greek "sigma"): advanced users of Wikigender may want to insert or edit a formula that uses mathematical symbols

Bottom Row

  • Format: choose from the pull-down menu a specific format from the list of available styles (e.g. "Headline 1")
  • Bold (represented by a B): make highlighted text bold
  • Italics (represented by I): italicise highlighted text
  • Underline (represented by U): underline highlighted text
  • Strike Through (represented by ABC): strike through highlighted text
  • Subscript (represented by x2): write text in subscript
  • Superscript (represented by x2): write text in superscript
  • Insert/Remove Numbered List (represented by 1, 2, 3): create or remove a numbered list
  • Insert/Remove Bulleted List (represented by 3 bullets): create or remove a bulleted list
  • Blockquote (represented by quotation marks): insert or format highlighted text as a blockquote
  • Justification: left / center / right / block
  • Insert/Edit Link (represented by a globe with a link): Insert or edit a link to another Wikigender article or external website
  • Remove Link (represented by a globe with a broken link): take the link off a specific word
  • Insert/Edit Anchor (represented by an anchor): classify a specific section as an anchor which can be refered to elsewhere
  • Text Color (represented by a T with color scheme): choose a specific color for your text
  • Background Color (represented by a bucket and a color scheme): choose a specific background color for your text
  • Maixmize the editor size (represented by a blue rectangle): use an external window for editing, which can be adjusted in size
  • About FCKeditor (represented by a "?"): find out more about the FCKeditor


General Meaning of WYSIWYG

WYSIWYG implies a user interface that allows the user to view something very similar to the end result while the document is being created. In general WYSIWYG implies the ability to directly manipulate the layout of a document without having to type or remember names of layout commands. The actual meaning depends on the user's perspective, e.g.

  • In Presentation programs, Compound documents and web pages, WYSIWYG means the display precisely represents the appearance of the page displayed to the end-user, but does not necessarily reflect how the page will be printed unless the printer is specifically matched to the editing program, as it was with the Xerox Star and early versions of the Apple Macintosh.
  • In Word Processing and Desktop Publishing applications, WYSIWYG means the display simulates the appearance and precisely represents the effect of fonts and line breaks on the final pagination using a specific Computer printer configuration, so that a citation on page 1 of a 500-page document can accurately refer to a reference 300 pages later.
  • WYSIWYG also describes ways to manipulate 3D models in Stereochemistry, Computer-aided design, 3D computer graphics and is the brand name of Cast Software's lighting design tool used in the theatre industry for pre-visualisation of shows.

Modern software does a good job of optimizing the screen display for a particular type of output. For example, a word processor is optimized for output to a typical printer. The software often emulates the resolution of the printer in order to get as close as possible to WYSIWYG. However, that is not the main attraction of WYSIWYG, which is the ability of the user to be able to visualize what he or she is producing.

In many situations, the subtle differences between what you see and what you get are unimportant. In fact, applications may offer multiple WYSIWYG modes with different levels of "realism," including:

  • A composition mode, in which the user sees something somewhat similar to the end result, but with additional information useful while composing, such as section breaks and non-printing characters, and uses a layout that is more conducive to composing than to layout.
  • A layout mode, in which the user sees something very similar to the end result, but with some additional information useful in ensuring that elements are properly aligned and spaced, such as margin lines.
  • A preview mode, in which the application attempts to present a representation that is as close to the final result as possible.

Applications may deliberately deviate or offer alternative composing layouts from a WYSIWYG because of overhead or the user's preference to enter commands or code directly.

A common understanding is that this does not mean "Similar", as stated above, but as close as possible, is an "exact representation" of what the appearance will be.


Historical notes

Before the invention of WYSIWYG, text and control characters appeared in the same typeface and style with little indication of layout (margins, spacing, etc.). Users were required to enter code tags to indicate that some text should be in boldface, italics, or a different typeface or size. These applications used an arbitrary markup language to define the tags. Because of its simplicity, this method remains popular for some basic text editing applications.

Due to the high cost of computer memory in the early days of microcomputer development, true graphical displays were uncommon and expensive. An early video display was often text-only, constructed from a simple bitmapped character set stored permanently in Read Only Memory in the computer, with each character represented by a single byte of data. Many home computers used standard televisions for the computer screen, and most consumer televisions in the early 1980s were unable to show a high degree of detail without blurring and smearing.

Consequently the earliest home computers used a simple text-only display approximately 40 characters wide and 24 characters tall, which at 960 characters allows the entire screen of data to fit into 1 kilobyte of memory. The high cost of making ROMs often limited the available built-in character set so as to not have room for lowercase, accented, boldface, italic, or underlined characters. Some word processing systems allowed non-printing "control characters" to be imbedded into the plain text (such as the RUNOFF, IBM FORMAT and IBM SCRIPT systems). Specific characters would instruct specific printers to allow text formatting (boldface, italic, underline, various font faces, etc) along with page formatting chores (indenting, bulleting, indexing, creating headers/footers, etc). Because the final form of the document was obscured in text mode, there was often an available preview feature in a (slower) full graphics mode to allow preview before final printing.

In order to approach a somewhat more realistic word processing environment, many early word processors such as Bank Street Writer used the microcomputer's graphical display modes to simulate a more proper textual display with true lowercase letters, underlining, and so forth. But because the text was painstakingly drawn character-by-character as a graphical image by software rather than being directly supported in hardware, these graphics-simulated text editors were sluggish and could lag behind the speed of a fast typist. Even though a graphical display permitted more realistic character sets, the text was still usually limited to the printer's built-in fonts due to the large amount of additional memory that bitmapped fonts required and the limited system memory available at that time.

Fonts did not become widely understood by the general public until after WYSIWYG became popular. Early word processors had little or no control over the final appearance of the text and relied on whatever fonts were built into the printer, with most dot-matrix printers capable of only three or four fonts referred to as Condensed, Draft, Normal, and Dot_matrix_printer#Near_Letter_Quality_.28NLQ.29 | Near Letter Quality. The printer font was usually selected from the front panel of the printer and applied to the entire printed document, or in the case of daisy-wheel printers, selected by physically changing the typeface disc prior to printing. Direct control of printer fonts from within a word processor was possible, but usually required long strings of obscure control codes specific to each printer model.

The first versions of true WYSIWYG word processors allowed the user to only preview the final form of the document on-screen, as a non-editable graphical display. WordPerfect 5.2 offered this, still using the old text-only markup language for the primary document editing, and allowing the user to briefly switch to a graphical mode to see how the document would look when printed. This final rendering was computationally intensive and was consequently slow and clumsy. Due to the deeply ingrained user-experience of past WordPerfect products, as WordPerfect 6.0 made the transition from text-only DOS to a full WYSIWYG Windows 3.x GUI application it still held tightly onto its old code-markup system, offering two main view to the user, one version with the codes, and the other as a proper WYSIWYG live-editable version. Modern word processors still offer an option to show document formatting codes, but this feature is normally hidden from view and must be explicitly activated by the user.

More Information

Related Categories
  • This article is uncategorized. Please edit it to add a category.

Article Information
Wikiprogress Wikichild Wikigender University Wikiprogress.Stat ProgBlog Latin America Network African Network eFrame