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

Онлайн -редактор форматированного текста — это интерфейс для редактирования форматированного текста в веб-браузерах , который предоставляет пользователю область редактирования «что видишь, то и получаешь» (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` атрибут. К этим редакторам относятся Aloha Editor, CKEditor , SnapEditor и TinyMCE . ^[4] Редакторы, использующие iframe , чтобы избежать конфликтов стилей, включают CKEditor , Dijit Editor и TinyMCE .

См. также

Текстовый редактор

Ссылки

^ «Редактирование расширенного текста в Mozilla» . сайт разработчика Mozilla.org.
^ «RE: Пункт действия HTML 54 — … проект текста спецификации HTML 5, требующий от производителей/авторов включать @alt в элементы img. от Фредерико Кальдейры Кнаббена 14 мая 2008 г. ( [электронная почта защищена] от мая 2008 г.)» . Lists.w3.org . Проверено 23 сентября 2010 г.
^ «7 Взаимодействие с пользователем — HTML5» . W3C . Проверено 23 сентября 2010 г.
^ «TinyMCE | Внешний вид редактора» . www.tinymce.com . Проверено 5 июля 2016 г.

Внешние ссылки

[1] «Редактирование расширенного текста в Mozilla» . сайт разработчика Mozilla.org.

[2] «RE: Пункт действия HTML 54 — … проект текста спецификации HTML 5, требующий от производителей/авторов включать @alt в элементы img. от Фредерико Кальдейры Кнаббена 14 мая 2008 г. ( [электронная почта защищена] от мая 2008 г.)» . Lists.w3.org . Проверено 23 сентября 2010 г.

[3] «7 Взаимодействие с пользователем — HTML5» . W3C . Проверено 23 сентября 2010 г.

[4] «TinyMCE | Внешний вид редактора» . www.tinymce.com . Проверено 5 июля 2016 г.

[1]

[2]

[3]

[4]