<h1>Best Practice Rich Text Editor</h1> <p>This sample's goal is to create a web-based editing environment that content authors will enjoy using. To do this I implemented <a href="http://gabesumner.com/wysiwyg-rich-text-editors-your-cmss-achilles-heel">several changes</a> to the default Rich Text editor. Test this experience by switching into full-screen mode and composing some content. Ideally, you'll forget you're working in a web-based editor.</p> <p><a class="CallToAction" href="http://gabesumner.com/wysiwyg">Learn more</a></p> <hr /> <h2>Why is it good?</h2> <ul class="GoodvsBad"> <li>Toolbar is minimal (uncluttered) and expandable</li> <li>Full-screen mode is available</li> <li>Styling is widescreen friendly</li> <li>TAB can be used to indent lists</li> <li>Pasted content is automatically cleaned</li> <li>Produces clean & maintainable markup (no in-line styling)</li> <li>Custom styles create a WYSIWYG experience</li> </ul> <h2>Why is it bad?</h2> <ul class="GoodvsBad"> <li class="Bad">Less flexibility during authoring - no fonts or in-line styling</li> <li class="Bad">No auto-save functionality</li> <li class="Bad">Automatically stripping styling on paste might confuse users</li> </ul> <h2>Disclaimer</h2> <p>This demo is still a work in progress.</p>
Return to the main page.