User:WikiMaster/WYSIWYG: Difference between revisions
Jump to navigation
Jump to search
WikiMaster (talk | contribs) (Add resources.) |
WikiMaster (talk | contribs) m (Move wikEd to Other Editing Tools section.) |
||
Line 15: | Line 15: | ||
: Wikipedia WYSIWYG is a collaboration between GRNET and MediaWiki developers. The goal is to provide a better editing interface for Wikipedia. This will be done by evaluating existing approaches and improving them. Read more about the usability testing.<ref>[https://code.grnet.gr/projects/wikipedia-wysiwyg/wiki/Usability_testing Wikipedia WYSIWYG: Usability testing]</ref> The first step is to do usability testing with some of the existing approaches: '''InlineEditor''', '''WYSIFTW''', '''RTE''' and others (see below for details). | : Wikipedia WYSIWYG is a collaboration between GRNET and MediaWiki developers. The goal is to provide a better editing interface for Wikipedia. This will be done by evaluating existing approaches and improving them. Read more about the usability testing.<ref>[https://code.grnet.gr/projects/wikipedia-wysiwyg/wiki/Usability_testing Wikipedia WYSIWYG: Usability testing]</ref> The first step is to do usability testing with some of the existing approaches: '''InlineEditor''', '''WYSIFTW''', '''RTE''' and others (see below for details). | ||
== | == Wiki Text / Wiki Markup == | ||
* [[ | * [[mediawikiwiki:Wikitext.next|Wikitext.next]] | ||
MediaWiki's markup syntax has grown organically since 2002, itself based on earlier wiki syntaxes going back to 1995. None of it's very consistent, and there are a lot of edge cases which tend to surprise folks. | |||
# Raw markup can look '''really ugly and intimidating''' to editors | |||
# Tables, templates, tags, etc have many unexpected boundary conditions, which makes some uses of these constructs hard to deal with even for experts | |||
# Lack of structure or standardization means that changes to the parser code can unexpectedly change those cases | |||
# Combination of edge cases makes round-tripping to HTML and back very hard, which has made it difficult to get rich text editing fully integrated | |||
== WYSIWYG Extensions == | |||
* [[mediawikiwiki:Category:WYSIWYG extensions|Category:WYSIWYG extensions]] | * [[mediawikiwiki:Category:WYSIWYG extensions|Category:WYSIWYG extensions]] | ||
=== FCKeditor (Official) === | |||
* [[mediawikiwiki:Extension:FCKeditor (Official)|Extension:FCKeditor (Official)]] | * [[mediawikiwiki:Extension:FCKeditor (Official)|Extension:FCKeditor (Official)]] | ||
=== WYSIWYG === | |||
* [[mediawikiwiki:Extension:WYSIWYG|Extension:WYSIWYG]] | * [[mediawikiwiki:Extension:WYSIWYG|Extension:WYSIWYG]] | ||
: The '''WYSIWYG extension''' enables a more intuitive editing of pages on a MediaWiki-based site. When this extension is installed, the tab 'Edit' in the command bar on top of every page leads directly in the wysiwyg editing mode. The WYSIWYG extension uses a special version of the CKeditor that outputs wiki text rather than the usual HTML that caused problems for MediaWiki integrations in the past. | : The '''WYSIWYG extension''' enables a more intuitive editing of pages on a MediaWiki-based site. When this extension is installed, the tab 'Edit' in the command bar on top of every page leads directly in the wysiwyg editing mode. The WYSIWYG extension uses a special version of the CKeditor that outputs wiki text rather than the usual HTML that caused problems for MediaWiki integrations in the past. | ||
=== RTE (Rich Text Editor (Wikia) === | |||
* [http://communitytest.wikia.com/wiki/Main_Page Wikia's Community Test Wiki] (RTE Demo) | * [http://communitytest.wikia.com/wiki/Main_Page Wikia's Community Test Wiki] (RTE Demo) | ||
: [[wikia:Help:Rich text editor|Help:Rich text editor]] | : [[wikia:Help:Rich text editor|Help:Rich text editor]] | ||
Line 46: | Line 39: | ||
: [https://svn.wikia-code.com/wikia/trunk/extensions/wikia/RTE/ svn.wikia-code.com/wikia/trunk/extensions/wikia/RTE] | : [https://svn.wikia-code.com/wikia/trunk/extensions/wikia/RTE/ svn.wikia-code.com/wikia/trunk/extensions/wikia/RTE] | ||
=== InlineEditor === | |||
* [[mediawikiwiki:Extension:InlineEditor|Extension:InlineEditor]] | * [[mediawikiwiki:Extension:InlineEditor|Extension:InlineEditor]] | ||
: InlineEditor is an editing interface that allows users to edit and preview elements in the page by clicking them. | : InlineEditor is an editing interface that allows users to edit and preview elements in the page by clicking them. | ||
Line 52: | Line 45: | ||
: [[mediawikiwiki:Extension:InlineEditor|Extension:InlineEditor]] [http://janpaulposma.nl/sle/wiki/index.php/Hoofdpagina Demo] | : [[mediawikiwiki:Extension:InlineEditor|Extension:InlineEditor]] [http://janpaulposma.nl/sle/wiki/index.php/Hoofdpagina Demo] | ||
=== | == Other Editing Tools == | ||
* [[mediawikiwiki: | === WYSIWTF (aka WYSIFTW) === | ||
* [[mediawikiwiki:WYSIFTW|WYSIFTW]] | |||
: '''WYSIFTW''' (formerly '''WYSIWTF''') is a JavaScript-based tool originally written by [[wikipedia:User:Magnus Manske|Magnus Manske]]. Its primary purpose is to make it easier to edit Wikipedia articles, especially for people unfamiliar with the intricacies of MediaWiki syntax. | |||
: [http://toolserver.org/~magnus/wysiwtf/wysiwtf.js WYSIWTF (aka WYSIFTW)] - The js code. | |||
** Demo: Get a user account on Wikipedia (en works best), then add... | |||
<pre>importScriptURI("http://toolserver.org/~magnus/wysiwtf/wysiwtf.js");</pre> | |||
...to your [[Special:MyPage/vector.js]] page. | |||
=== wikEd === | |||
* [[wikipedia:User:Cacycle/wikEd|User:Cacycle/wikEd]] | |||
: '''wikEd''' is a full-featured Wikipedia-integrated advanced text editor for regular to advanced wiki users. '''wikEd''' features [[wikipedia:syntax highlighting|syntax highlighting]] with code check and [[wikipedia:code folding|reference and template folding]], on-page ''Show preview'' and ''Show changes'', and advanced search and replace functions. Please check the [[wikipedia:User:Cacycle/wikEd help|'''wikEd''' help]] page for details. '''wikEd''' works under all web browsers ''except'' [[wikipedia:Internet Explorer|Internet Explorer]] and [[wikipedia:Opera (web browser)|Opera]]. | |||
** [[wikipedia:User:Cacycle/wikEd help|User:Cacycle/wikEd help]] | |||
** [[wikipedia:User:Cacycle/WYSIWYG|User:Cacycle/WYSIWYG]] | |||
: '''This Essay in a Nutshell:''' Pure WYSIWYG is evil. Really. But we can learn a thing or two from it. | |||
== | === Semantic Forms === | ||
* [[mediawikiwiki:Extension:Semantic Forms|Extension:Semantic Forms]] | * [[mediawikiwiki:Extension:Semantic Forms|Extension:Semantic Forms]] | ||
: Semantic Forms allows you to have '''forms for adding, editing and querying data''' on your wiki, '''without any programming'''. Forms can be created and edited not just by administrators, but by users themselves. | : Semantic Forms allows you to have '''forms for adding, editing and querying data''' on your wiki, '''without any programming'''. Forms can be created and edited not just by administrators, but by users themselves. |
Revision as of 08:58, 22 October 2011
WYSIWYG Research
- For the more technically inclined, wiki markup is a simple way of formatting a wiki page. However, many would-be users of MediaWiki are put off by what looks to them—rightly—to be code of any sort. These users are adjusted to publishing and editing in a more visually straightforward WYSIWYG (What You See Is What You Get) environment.
- “Wikipedia’s WYSIWYG Dilemma” (Wired)
- From Article: (Wikipedia's) editing platform is intentionally designed to be complex so as to lower participation and thus make it easier to manage, and that if they open up the floodgates, "the site will probably come to a grinding halt."
- WYSIWYM is an acronym for What You See Is What You Mean, and refers to a paradigm for document editing. It is an alternative to the better-known WYSIWYG (what you see is what you get) paradigm, which displays the document on screen as it will be printed.
- Wikipedia WYSIWYG
- Wikipedia WYSIWYG is a collaboration between GRNET and MediaWiki developers. The goal is to provide a better editing interface for Wikipedia. This will be done by evaluating existing approaches and improving them. Read more about the usability testing.[1] The first step is to do usability testing with some of the existing approaches: InlineEditor, WYSIFTW, RTE and others (see below for details).
Wiki Text / Wiki Markup
MediaWiki's markup syntax has grown organically since 2002, itself based on earlier wiki syntaxes going back to 1995. None of it's very consistent, and there are a lot of edge cases which tend to surprise folks.
- Raw markup can look really ugly and intimidating to editors
- Tables, templates, tags, etc have many unexpected boundary conditions, which makes some uses of these constructs hard to deal with even for experts
- Lack of structure or standardization means that changes to the parser code can unexpectedly change those cases
- Combination of edge cases makes round-tripping to HTML and back very hard, which has made it difficult to get rich text editing fully integrated
WYSIWYG Extensions
FCKeditor (Official)
WYSIWYG
- The WYSIWYG extension enables a more intuitive editing of pages on a MediaWiki-based site. When this extension is installed, the tab 'Edit' in the command bar on top of every page leads directly in the wysiwyg editing mode. The WYSIWYG extension uses a special version of the CKeditor that outputs wiki text rather than the usual HTML that caused problems for MediaWiki integrations in the past.
RTE (Rich Text Editor (Wikia)
- Wikia's Community Test Wiki (RTE Demo)
- Help:Rich text editor
- This extension is enabled by default on Wikia.
- svn.wikia-code.com/wikia/trunk/extensions/wikia/RTE
InlineEditor
- InlineEditor is an editing interface that allows users to edit and preview elements in the page by clicking them.
- Extension:InlineEditor/Proposal
- Extension:InlineEditor Demo
Other Editing Tools
WYSIWTF (aka WYSIFTW)
- WYSIFTW (formerly WYSIWTF) is a JavaScript-based tool originally written by Magnus Manske. Its primary purpose is to make it easier to edit Wikipedia articles, especially for people unfamiliar with the intricacies of MediaWiki syntax.
- WYSIWTF (aka WYSIFTW) - The js code.
- Demo: Get a user account on Wikipedia (en works best), then add...
importScriptURI("http://toolserver.org/~magnus/wysiwtf/wysiwtf.js");
...to your Special:MyPage/vector.js page.
wikEd
- wikEd is a full-featured Wikipedia-integrated advanced text editor for regular to advanced wiki users. wikEd features syntax highlighting with code check and reference and template folding, on-page Show preview and Show changes, and advanced search and replace functions. Please check the wikEd help page for details. wikEd works under all web browsers except Internet Explorer and Opera.
- This Essay in a Nutshell: Pure WYSIWYG is evil. Really. But we can learn a thing or two from it.
Semantic Forms
- Semantic Forms allows you to have forms for adding, editing and querying data on your wiki, without any programming. Forms can be created and edited not just by administrators, but by users themselves.
PortlandWiki WYSIWYG Discussions
- PortlandWiki Search Results: WYSIWYG