Land-site.ru
WYSIWYG редакторы

WYSIWYG редакторы – выбираем бесплатный WYSIWYG редактор для сайта.


Большинство начинающих веб-мастеров даже не догадываются про существование таких программ, как WYSIWYG редакторы. Хотя при работе с самостоятельными CMS часто подобные программные продукты выручают. При написании статьи я полагался на несколько критериев. Например, поддержка работы с XHTML, простота работы со скриптами, присутствие API, файловый менеджер. Также отмечу, что программы работают со всеми известными браузерами.

Не у всех программ идентичный функционал. Но некоторым веб-мастерам достаточно минимальных функций для выполнения рабочих задач. Поэтому не всегда нужно выбирать максимально напичканную опциями программу. Я рекомендую остановиться вам на том редакторе, который работает грамотно, не изменяет в негативную сторону код, а редактирует его структурно.

Что такое WYSIWYG редактор и как он работает?

Даже если веб-мастер наслышан про подобные ПО, он зачастую не понимает, в чем польза редакторов и можно ли с помощью них улучшить свой веб-ресурс. Грубо говоря, приложения необходимы для грамотного редактирования и структурирования текстового контента. Зачастую, добавляя новые статьи на сайт, веб-мастера сталкиваются с такой ситуацией, когда после публикации он отображается не так, как задумывал администратор. Все дело в коде – его можно изменить вручную, тем самым преобразовав внешний вид текста. Но гораздо удобнее решать такие задачи с помощью редакторов. То есть, мы устанавливаем межстрочный интервал, выбираем нужный шрифт, делаем гиперссылки, подчеркиваем какие-то слова, при этом не видим код совершенно. Веб-мастеру нужно лишь визуально отредактировать текст, а редактор самостоятельно сгенерирует правильный код.

Другими словами, если вы прекрасно знакомы с HTML, редактор вам ни к чему. WYSIWYG программы подходят для новичков. Насколько масштабно можно отредактировать текст? Все зависит от выбранного вами визуального редактор веб-страниц онлайн формата, либо программного продукта. Масштабность редактирования, в целом, является основным критерием при выборе ПО, сервиса или плагина.

Список лучших WYSIWYG редакторов

1. WYMeditor

Это далеко не ТОП редактор, поэтому русскоязычная аудитория о нем практически ничего не знает. Работать с огромнейшим текстом в такой программе будет довольно неудобно. Если нужно подкорректировать небольшое описание на несколько строчек – можно поработать с WYMeditor.

Базовый функционал присутствует. Можно оформить текст, вставить изображения, сделать гиперссылки. Больше всего радует визуальная составляющая ПО. Четко видна структура редактируемого текста. Код выдает чистейший. Вдобавок он укладывается в одну строку, поэтому большой вес HTML-коду свойственен не будет.

Работать с WYMeditor можно даже если у вас не самый современный браузер. Поддержка API, XHTML, плагинов присутствует.

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

2. TinyMCE

Многофункциональный мощный редактор, генерирующий чистый код. И сразу хотелось бы сказать об одном недостатке – куча кнопок в одной области. Этот пункт не кажется минусом, пока не начинаешь постоянно работать с TinyMCE – и тут начинаются проблемы, поскольку постоянно путаешься в этих кнопках, расположенных совершенно не структурировано.

API отличный, гибкий. Если нужен файловый менеджер, то его необходимо установить вручную. Работа с плагинами приветствуется – хотя вряд ли они вам понадобятся, поскольку огромный функционал может заменить все плагины.

В плане установки программа простейшая. Установка заключается в подкреплении двух скриптов в самом верху кода. Если есть желание, можете дописать скрипт с настройками программы. То есть, изменить скин, язык, структурировать кнопки, но это новички точно  не будут делать из-за сложности.

Интерфейс отвратительный. В нем, конечно, легко разобраться, но вопрос в другом – как с таким интерфейсом вообще работать? Опытные пользователи чистят программный код, но не каждый будет браться за эту работу.

Новичкам с API лучше не работать. Поскольку опция крайне сложна в ознакомлении. Понадобится практика и изучение документации, знание английского языка, чтобы нормально настроить API.

Вес достаточно приличный – около одного мегабайта. Не совсем понятно, почему у редактора такой вес. Упрощенной версии для новичков нет.

Не рекомендуем копировать текст из Word для работы с ним в редакторе. Поскольку Ворд постоянно ставит непонятные и ненужные теги, а редактор почему-то их не распознает и не убирает.

Нет горячих клавиш – вроде бы минус не особо значимый, но когда работаешь с огромным текстом и делаешь это постоянно, тратиться приличное время на решение, казалось бы, элементарных задач, справляться с которыми в других программах можно путем нажатия двух клавиш.

3. CKEditor (FCKeditor)

У предыдущего редактора в списке обширность функций лучше, но зато в данной программе легко будет освоиться даже новичку. Работа с API заключается в выполнении простейших задач. Можно настроить любые горячие клавиши. Из крепких недостатков – невозможность кидать тексты из Word. Изменение настроек не помогает – код сильно «пачкается» и приходится его чистить вручную.

Можно немного подкорректировать интерфейс (он несколько неудобен). Нужно создать «topmenu» по типу Google Docs. Сделать это достаточно просто за счет хорошего API. Но недостатки интерфейса некритичные, поэтому новичкам в его изменение вникать даже не стоит.

Присутствует контекстное меню для удобства простым пользователям. Можно написать дополнительный модуль (с этой задаче справится даже обычный пользователь). Нужно всего лишь в архиве со скриптом открыть нужную папку «_samples» и прописать новый модуль. В папке вы также найдете примеры написания модулей.

Синхронизация с файловым менеджером возможна – скачивайте любой менеджер и устанавливайте его за пару секунд.

Весит скрипт чуть ли не полтора мегабайта – это достаточно много, но недочет простительный, поскольку больше мегабайта веса приходится на плагины, а скрипт весит чуть более двадцати килобайт. Так что, если вес не устраивает, удаляйте плагины, которыми не пользуетесь.

4. YUI Rich Text Editor

Странно, что проект не получил массовую известность. Поскольку его выпуском занималась и занимается компания «Yahoo». На первый взгляд, перед нами обычное поле ввода текста. Но, начав с ним работать, поле превращается в WYSIWYG редактор. Есть несколько версий программы. Выбирайте ту, которую подходит вам по функционалу. Если вас интересует простое редактирование текста, можете выбрать любую версию – все они поддерживают WYSIWYG.

5. Markitup

Это НЕ полноценная программа, а именно плагин. Поддержка HTML, Wiki и BBcode. Не столь обширные опции, но чтобы «запилить» красочную статью, опций будет достаточно. Сам проект не позиционирует себя как редактор. Скорее, как плагин, который позволяет немного переоформить текст, сделав код правильным и чистым.

Из преимуществ – компактность и идеальность в ознакомлении для обычных пользователей.

6. FreeTextBox

WYSIWYG редактор онлайн. На первый взгляд – банальный Microsoft Word. Вот только по «чистоте» текста во много раз превосходит Ворд. Самая продвинутая и многофункциональная версия редактора является платной. Это не пугает, в бесплатной версии мы также можем кардинально переработать текст, подготовив его к публикации.

7. MooEditable

Основа проекта — JavaScript-библиотека. Поэтому выглядит ПО просто, несмотря на эффективный и грамотно организованный в плане интерфейса функционал. Возможно, вы слышали про Mootols – если работаете с данным приложением, этот редактор вас полностью устроит.

8. OpenWysiwyg

Кросс-браузерный HTML Online редактор. Первое, что бросается в глаза, прекрасно оформленный и структурированный интерфейс. Все кнопки на своем месте, есть даже всплывающие элементы, чтобы редактор не занимал много пространства.

Одна из ключевых особенностей – возможность реализовывать широкомасштабные таблицы. Из минусов, Google Chrome Open проект не поддерживает. Но вполне возможно, что ближайшие обновления ликвидируют данный недостаток.

9. jHtmlArea

Изначально проект создавался для всем известной библиотеки «JQuery». Далеко не самый известный продукт, но начинающим веб-мастерам я могу его смело порекомендовать. Настроить в редакторе можно абсолютно любые компоненты – начиная от скина приложения, заканчивая количеством пунктов в меню и языком. Опций немного. Акцент сделан исключительно на те функции, которые предназначены именно для оформления текстового контента.

10. NicEdit

Хорошая альтернатива предыдущему редактору из нашего списка. Редактор достаточно объемный. С одной стороны, это хорошо, поскольку можно кардинально редактировать оформление масштабных статей. С другой стороны, придется некоторое время повозиться с изучением редактора, что не совсем удобно, если вам нужно оформить всего лишь несколько строк.

Основной плюс – возможность интеграции WYSIWYG редактора на сайт. То есть, можно будет прямо в браузере сначала оформлять текст, а после сразу же его публиковать на свой веб-портал.

Можно ли оформить текст без WYSIWYG редакторов?

Если вы начинающий веб-мастер, которому необходимо заполнить сайт огромным количеством текстового контента, но при этом изучать HTML нет желания, стоит сделать выбор в пользу онлайн-конструктора сайтов Bloxy.ru.

Вы можете задать вполне логичный вопрос – какое отношение онлайн-конструктор имеет к WYSIWYG редакторам? Все довольно просто. В случае с самостоятельными CMS часто оформление текста генерируется неправильно – появляются лишние теги, сбивается межстрочный интервал. То есть, если текст в Word выглядит грамотно, то при его вставке на сайт оказывается, что оформление никудышное. В случае с Bloxy.ru, а этот проект в какой-то мере визуальный онлайн редактор сайтов, такой ситуации не происходит, поскольку система онлайн-конструктора автоматически генерирует правильный код, работая по принципу редакторов. Вот только в случае с редакторами можем исключительно изменить текст, а Блокси позволяет создать качественный и многофункциональный сайт с возможностью оформления текста прямо в конструкторе без работы с редакторами.

Подытожим

Если вы опытный пользователь, то из списка онлайн редакторов сайтов HTML вам стоит выбрать TinyMCE – это действительно мощный редактор с огромным количеством функций. Но на его изучение новичкам придется потратить много времени. Поэтому если вы обычный пользователь, который только учится работать с контентом, остановите свой выбор на «FreeTextBox», если хотите работать в режиме онлайн. Если вам нужна программа, то MooEditable – ваш правильный выбор.

Отметим, что HTML редактор онлайн больше подходит для непостоянной работы. Если вы ежедневно оформляете текст, лучше иметь под рукой программу, которая гарантированно и бесперебойно будет работать, даже если отсутствует интернет-соединение.