Сегодня есть множество редакторов текста с возможностью расширенного форматирования (WYSIWYG — What You See Is What You Get), которые легко можно встроить в админ-панель сайта или в форму добавления комментария на блоге или форуме. Все они своей простотой в установке устраивают девелоперов и программистов, но мы верстальщики плюемся почти от каждого из них. Почему? Всё дело в том, что большинство доступных сегодня WYSIWYG-редакторов текста работают по разному в разных браузерах и тем более в разных ОС. Всплывают разные не понятные и не ожиданные теги, которые могут испортить верстку страницы. Например, любимый многими редактор TinyMCE при редактировании текста из-под MacOS (для определенности еще напишем, что браузер на Webkit) вместо просто тэга «Жирный» (<b>) добваляет целую связку (<span style=’font-style:bold’>). Вероятно это очень удобно для разработчиков плагина, и возможно даже хорошо для поисковых ботов, но может негативно повлиять на уже сверстанную страницу, особенно, если верстальщик не знает какое редактор установлен на сайте.

Поэтому сегодня рассмотри 4 наиболее удачных бесплатных WYSIWYG редактора.

WYMeditor — 4-тое место

NewImage.jpg
Альтернативный подход к редакторам текста для web. Разработчики вынесли в отдельные панели доступные готовые стили форматирование (вроде «Заголовок», «Субзаголовок»). Подозреваю, что это была попытка подражание профессионального инструмента для типографической верстки InDesign, достаточно удачная, хотя дизайн самого редактора не особеннов впечатлил.
Удобно то, что в поле редактирования все тэги добавленные в текст выделены и подписаны. Кроме того редактор формирует действительно те тэги, которые от него ожидает верстальщик.
Оценка: star.png

Ссылка: wymeditor


YUI-editor — 3-тье место

NewImage.jpg
Как и все продукты Yahoo (имеются в виду те Javascript решения, которые попали в пакет YUI) WYSIWYG редактор YUI порадовал хорошим интерфейсом и чистотой генерируемого кода. Минус только в том, что общий вес редактор достаточно велик, что не очень хорошо.
Но зато очень порадовал интерфейс всплывающих сообщений (видно на скриншоте).
Оценка: star.pngstar.png

Ссылка:
yui

Aloha-editor — 2-рое место

NewImage.jpg
Фантастически хороший интерфейс! Как написано на сайте редактора «Улучшенное удобство для пользователя». Плавающая панель инструментов, которую можно переместить туда, где привычно. Особенно порадует заядлых пользователей Windows и MS Word 2010, потому, что интерфейс отлично повторяет новую концепцию интерфейса MS (такую, как в пакете Office 2010).
Кроме того, это позволит сделать редактор из любого элемента страницы.
Очень приятно.
Не полностью устроило качество генерируемого HTML-кода. Но интерфейс просто сразу покупает.
Оценка: star.pngstar.pngstar.png

Ссылка: aloha-editor

elRTE — 1-вое место

NewImage.jpg
Нисколько не ангажированное решение! Абсолютный лидер. И на это есть свои причины:

  • написан на jQuery (меньше кода + 100% совместимость)
  • для интерфейса использует jQuery UI (простота настройки тем интерфейса)
  • генерирует абсолютно правильный HTML-код

Кроме того, очень приятно, что редактор написан русской командой, имеет большое количество функций (даже собственный файл-менеджер) и удобен в использовании.
Оценка: star.pngstar.pngstar.pngstar.png
Ссылка: elrte


Наверняка ты заметил, что в обзоре нет редакторов, которые у всех на слуху (FCK, TinyMCE), это потому, что они в той или иной степени платные и генерирует не всегда корректный HTML-код.