State of the Art in WYSIWYG HTML Editors
A common feature request from Aha! users was the ability to include images and tables inline with feature descriptions. A year or so ago we embarked on a project to improve our editor with a more feature rich experience.
When we originally chose an editor for Aha! we selected Ning’s wysihtml5 because it had a nice balance of functionality with a relatively simple and easy to follow code-base.
At the time it was a good choice for us because it was easy to integrate and most importantly had excellent support for inline-editing.
A key aspect of the editing experience in Aha! which is product roadmap software is that you can immediately start editing text inline, without needing to click an “edit” button or wait for the editor to load.
This makes editing quick and easy, but it does require that the editor code can work directly with <div>s that are marked with the contenteditable attribute.
Over time we found a few small problems with wysihtml5 that we were not able to fix: (1) weird text combinations that prevented editing, (2) clunky editing of links, (3) no cross-browser support for inline images. So we embarked on a search for a replacement.
After experimenting with many of the available editors we settled on tinymce.
We chose it because it has excellent cross-browser support, including inline images, because of its elegant table editor, and because we could be confident that because of the large existing user and developer base that there would continue to be improvements in the future.
Although tinymce has an inline mode, getting it to work satisfactorily for us turned out to be a much bigger undertaking than we expected. We are fussy about how a toolbar should behave when the screen is small, when it is resized and how it should behave during scrolling. Getting the right result required weeks of fine tuning, but we are very pleased with the result.
You probably now understand why we are excited to roll out the new text editor and start using it ourselves. Tell us about what you have learned about working with text editors.
