Онлайн-редактор форматированного текста - Online rich-text editor

Контент редактируется в Amaya онлайн-редактор форматированного текста

An онлайн-редактор форматированного текста это интерфейс для редактирования богатый текст в веб-браузеры, который представляет пользователю "что видишь, то и получаешь" (WYSIWYG) область редактирования. Цель состоит в том, чтобы уменьшить усилия пользователей, пытающихся напрямую выразить свое форматирование как допустимое. Разметка HTML.

Хотя очень ранние браузеры может отображать форматированный текст, ввод данных пользователя ограничен текстовые поля с единым шрифтом и стилем (реализовано с помощью <textarea> HTML-элемент). Internet Explorer был первым, кто добавил специальный "designMode", который позволял пользователю редактировать форматированные части документа с помощью курсор. Mozilla последовала его примеру в версии 1.3,[1] и большинство основных браузеров теперь в некоторой степени реализуют этот неформальный стандарт.[2]

Технические возможности, необходимые для реализации онлайн-редактора форматированного текста, не были охвачены W3C спецификации для HTML4. Тем не менее, популярные сервисы вроде Gmail и WordPress полагались на редактирование форматированного текста в качестве основного пользовательского интерфейса. С HTML5 была произведена некоторая стандартизация свойства DOM под названием contentEditable, которое напоминает исходное расширение Internet Explorer.[3] Многие из Онлайн-офисные пакеты имеют тенденцию предоставлять функции онлайн-редактирования и форматирования текста.

Подход

Большинство онлайн-редакторов форматированного текста используют iframe элемент для области содержимого. Таким образом, контент внутри редактора отделен от остальной части страницы, потому что он находится в другом документе. Преимущество этого разделения заключается в том, что редактор можно использовать в любом месте сайта (например, в области администрирования), сохраняя при этом стили контента, которые пользователи ожидают увидеть при публикации контента (например, в общедоступной области).

Некоторые редакторы используют div элементы для их области содержимого. Таким образом, содержимое редактора наследует тот же стиль, что и остальная часть страницы, поскольку находится в том же документе. Этот подход в основном используется, когда пользователям необходимо редактировать контент «на месте», сохраняя общий макет страницы. Примерами таких «локальных» редакторов являются DotNetNuke CMS.

Реализации

Встроенные редакторы отличаются от обычных редакторов, поскольку они могут редактировать контент напрямую, не помещая его в другой элемент, часто с `contenteditable` атрибут. Эти редакторы включают Редактор Алоха, CKEditor, SnapEditor и TinyMCE.[4] Редакторы, использующие iframe, чтобы избежать конфликтов стилей, включите CKEditor, Редактор Dijit и TinyMCE.

Другие известные редакторы включают WYMeditor (редактор XHTML с открытым исходным кодом, ориентированный на семантическую разметку), Редактор форматированного текста YUIYahoo! компонент редактора форматированного текста) и Визуальный редакторРасширение MediaWiki ).

Смотрите также

Рекомендации

  1. ^ «Редактирование форматированного текста в Mozilla». developer.mozilla.org.
  2. ^ RE: HTML Action Item 54 - ... черновик текста спецификации HTML 5, требующий от производителей / авторов включать @alt в элементы img. От Фредерико Калдейры Кнаббен от 14 мая 2008 г. ([email protected] с мая 2008 г.) ». Lists.w3.org. Получено 2010-09-23.
  3. ^ «7 Взаимодействие с пользователем - HTML5». W3.org. Получено 2010-09-23.
  4. ^ "TinyMCE | Внешний вид редактора". www.tinymce.com. Получено 2016-07-05.

внешняя ссылка