Краткий список WYSIWYG редакторов / Habr
Однажды мне потребовался WYSIWYG редактор, я помнил как он выглядит, его функции, но не помнил названия. Через 45 минут я все же его нашел… Тогда я поставил перед собой задачу помочь многим, в том числе и себе: сделать сводный список всех чуть более известных WYSIWYG редакторов.
Вступление
Данный топик представляет собой обширный список визуальных редакторов, почти или частично пригодных для использования. Цель, которой я руководствовался, заключался в том, чтобы систематизировать существующие данные, разбросанные по интернету.
TinyMCE
Один из самых распространенных визуальных редакторов, обладает недюжинным функционалом. Есть множество дополнений, по умолчанию установлено множество плагинов.
(Браузеры: Mozilla 1.3+, MSIE 5.5+, Opera 9.0+, Safari, Chrome)
[Официальный сайт | Демо]
CKeditor
Полный аналог TinyMCE.
(Браузеры: Firefox 1.5+, Opera 9.50+, Safari 3.0+, Camino 1.0+, Internet Explorer 5.5+, Google Chrome)
[Официальный сайт]
CLEditor
Незамысловатый визуальный редактор, особенных функционалом не балует. Но сделан вполне добротно, качественно реализованы все функции.
(Браузеры: Firefox 1.5+, Opera 9.50+, Safari 3.0+, Camino 1.0+, Internet Explorer 5.5+, Google Chrome)
[Официальный сайт]
NicEdit
Редактор очень похож на CLEditor. Обладает стандартным функционалом.
(Браузеры: Firefox 1.5+, Opera 9.50+, Safari 3.0+, Internet Explorer 5.5+, Google Chrome)
[Официальный сайт]
elRTE
Очень качественный визуальный редактор. Обладает широким функционалом. Сделан очень качественно.
(Браузеры: Firefox 3.5+, Opera 10+, Safari 3.0+, Internet Explorer 7+, Google Chrome)
[Официальный сайт | Демо]
Spaw
Очень средний визуальный редактор. Обладает стандартным функционалом.
(Браузеры: Firefox 1.5+, Opera 9+, Safari 3.0+, Internet Explorer 5.5+, Google Chrome)
[Официальный сайт | Демо]
Xinha
Неплохой визуальный редактор, отличительная особенность — множество встроенных action’ов. Т.е. настроить его под свои нужды не составит трудностей.
(Браузеры: Firefox 1.5+, Opera 9+, Safari 3.0+, Internet Explorer 5.5+, Google Chrome)
[Официальный сайт | Демо]
Imperavi (Платный)
Достаточно милый редактор, функционал не большой, но его вполне хватает. Существует ряд ошибок связанных с переходом от html к визуальному редактору и обратно. (убираются align’ы) Важно заметить, что Imperavi работает как плагин к JQuery.
Имеется неплохая документация.
(Браузеры: Firefox 1.5+, Opera 9+, Safari 4+, Internet Explorer 7+, Google Chrome)
[Официальный сайт | Демо]
Markitup
Markitup больше похож на удобный редактор html, который больше подойдет профессионалу, нежели рядовому пользователю. Но если вы знаете html, то он может оказаться вполне удобным.
[Официальный сайт | Демо]
Aloha Editor
Неплохой редактор, очень удобен. Однако существует огромный минус, который затмевает почти все плюсы — это отказ от поддержки старых и не очень браузеров (доступны только последние версии браузеров).
(Браузеры: Требуется поддержка HTML5, Opera не поддерживается)
[Официальный сайт | Демо]
Mercury editor
Mercury представляет собой цельную веб-страницу, и может быть использован для редактирования целой страницы или отдельных определенных областей. Он поддерживает функцию предварительного просмотра отредактированного содержимого, а также размещение ссылок, изображений, видео и таблиц. Загрузка файлов может быть осуществлена посредством интерфейса drag’n’drop.
Редактор также поддерживает совместную работу нескольких человек. Mercury может быть установлен в качестве отдельного Rails, либо за счет внедрения в код страницы. (Требуется JQuery)
И минус в том, что поддерживаются только следующие браузеры: Chrome 10+, Safari 5+, Firefox 4+.
[Официальный сайт | Демо на главной странице]
YUI Rich Text Editor
Визуальный редактор от Yahoo. Как справедливо заметил sdevalex, один из лучших визуальных редакторов. Обладает исчерпывающим функционалом, поддерживает подавляющим большинством браузеров.
[Демо]
MooEditable
Набор функций сильно ограничен, однако порой больше и не требуется.
[Демо]
OpenWysiwyg
Кросс-браузерный полноценный редактор со всеми требуемыми функциями. Он даже включает в себя привлекательные выпадающие меню и кнопки. К сожалению, Chrome не будет поддерживать его.
(IE 5.5+, Firefox 1.0+, Mozilla 1.3+ and Netscape 7+)
[Официальный сайт | Демо]
html-5-wysiwyg
Визуальный редактор на HTML5 со всеми вытекающими из этого последствиями. По большей части, редактор является демонстрацией возможностей HTML-5, нежели готовым продуктом.
(Как следует из названия, требуется поддержка HTML5)
[Страничка на code.google.com]
jWysiwyg
Леговесный плагин для jquery.
[Официальный сайт | Демо]
Реформатор
Визуальный редактор от студии Артемия Лебедева.
[Официальный сайт | Демо]
Итог
Надеюсь топик окажется вам полезным. Если вы нашли, что какой-либо визуальный редактор отсутствует, всенепременно напишите мне об этом, я буду вам очень благодарен.
UPD 1: дополнил описание YUI Rich Text Editor (спасибо sdevalex).
UPD 2: добавил jWysiwyg (спасибо mr47).
UPD 3: добавил Реформатор (спасибо kuber).
UPD 3: добавил Реформатор (спасибо kuber).
UPD 4: исправлено: Imperavi стал платным
P.S: 1. если какой не назвал, пишите, исправлю. 2. Если топик не актуален, напишите, уберу.
WYSIWYG редакторы – выбираем бесплатный WYSIWYG редактор для сайта. — 🚀 Land-site.ru
Большинство начинающих веб-мастеров даже не догадываются про существование таких программ, как WYSIWYG редакторы. Хотя при работе с самостоятельными CMS часто подобные программные продукты выручают. При написании статьи я полагался на несколько критериев. Например, поддержка работы с XHTML, простота работы со скриптами, присутствие API, файловый менеджер. Также отмечу, что программы работают со всеми известными браузерами.
Не у всех программ идентичный функционал. Но некоторым веб-мастерам достаточно минимальных функций для выполнения рабочих задач. Поэтому не всегда нужно выбирать максимально напичканную опциями программу. Я рекомендую остановиться вам на том редакторе, который работает грамотно, не изменяет в негативную сторону код, а редактирует его структурно.
Даже если веб-мастер наслышан про подобные ПО, он зачастую не понимает, в чем польза редакторов и можно ли с помощью них улучшить свой веб-ресурс. Грубо говоря, приложения необходимы для грамотного редактирования и структурирования текстового контента. Зачастую, добавляя новые статьи на сайт, веб-мастера сталкиваются с такой ситуацией, когда после публикации он отображается не так, как задумывал администратор. Все дело в коде – его можно изменить вручную, тем самым преобразовав внешний вид текста. Но гораздо удобнее решать такие задачи с помощью редакторов. То есть, мы устанавливаем межстрочный интервал, выбираем нужный шрифт, делаем гиперссылки, подчеркиваем какие-то слова, при этом не видим код совершенно. Веб-мастеру нужно лишь визуально отредактировать текст, а редактор самостоятельно сгенерирует правильный код.
Другими словами, если вы прекрасно знакомы с 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 редактор онлайн больше подходит для непостоянной работы. Если вы ежедневно оформляете текст, лучше иметь под рукой программу, которая гарантированно и бесперебойно будет работать, даже если отсутствует интернет-соединение.
land-site.ru
Программа для визуального создания сайтов: ТОП 5
Здравствуйте, мои дорогие читатели!
Человек всегда должен шагать в ногу со временем. А что может быть современнее и моднее своего собственного сайта? Конечно, если это всего лишь блажь на уровне «хочу и все!», то можно как-то обойтись многочисленными генераторами сайтов, где как в конструкторе – выбрал шаблон и радуйся.
Только вот загвоздка в том, что подобным образом созданный ресурс только номинально будет принадлежать вам. По сути это тот же аккаунт в социальной сети, только с более продвинутыми функциями.
Оставим в покое любительские странички в Интернете, перейдем к более глобальным замыслам. Итак, свой сайт. Как поступить, если в программировании вы ничего не соображаете, а нанимать специалиста дорого? Правильно, стоит воспользоваться доступным вариантом, программа для визуального создания сайтов в этом поможет.
Содержание:
- Что это такое?
- KompoZer
- WYSIWYG Web Builder
- Web Page Maker
- WebSite X5 Evolution 8
- Adobe Dreamweaver
Что это такое?
На самом деле это игрушка для ленивых, скажу я вам. Возможность создать почти профессиональный интернет-сайт без знания html. Хотя зачастую начинающие программисты могут использовать визуальные редакторы, как шпаргалку. Как? Проще простого. Составляешь сайт в редакторе, открываешь код страницы и изучаешь его от начала и до конца.
Прелесть использования таких ПО в том, что в окне программы будет сразу виден внешний вид ресурса на любом этапе работы с ним. Рассмотрим самые популярные редакторы, которые завоевали наибольшую популярность.
KompoZer
В первую очередь, стоит отметить такую программу, как KompoZer. Довольно простой визуальный редактор, который подходит как абсолютным новичкам, так и профессионалам своего дела. Легкое переключение между визуальным видом сайта и кодовой составляющей, возможность сделать интерфейс на русском языке. Это ли не счастье? Ну и плюс бесплатное распространение, работа с css (каскадными таблицами стилей), JavaScript и т.д.
С
тоит обратить внимание на то, что данный программный
продукт не предложит вам шаблон, все придется сделать самостоятельно.
Данное ПО создано на движке, на котором функционирует браузер FireFox. Это дает возможность подключить дополнительные модули, которые расширяют возможности программы.
В данной программе можно работать с несколькими страницами, они открываются в отдельных вкладках, что позволяет быстро переключаться с одной странички на другую.
WYSIWYG Web Builder
Единственным серьезным недостатком этой программы является отсутствие интерфейса на русском языке. Впрочем, это легко решить, заучив команды или открыв в интернете онлайн-переводчик. Плюс — это же бесплатная версия, а с таким раскладом это маленькое неудобство можно потерпеть.
Что предлагает нам этот редактор? Для полных «чайников» здесь есть готовые шаблоны сайтов в количестве десяти штук. Если вдруг не понравились, то вам прямой путь на официальный ресурс, где есть еще бесплатные шаблоны.
Ну а для тех, чей уровень чуть выше чайника, есть множество инструментов, которые позволят создать конкурентоспособный сайт с множеством интерактивных кнопок и ссылок, собирая его, как конструктор.
Рекомендую проверять, как отображается сайт в окнах браузеров. Это нужно для корректной работы у любого пользователя. Зачем проверять? Разные браузеры используют разные движки и способы отображения веб-страниц.
Web Page Maker
Web Page Maker также не имеет русского интерфейса. Этот редактор конечно попроще и имеет меньше возможностей, но добротный интернет-ресурс с его помощью все-таки создать можно. Больший упор здесь сделали на возможность собрать ресурс по блокам.
Даже есть готовые шаблоны меню. Здесь все можно подстроить под себя, установить там, где надо, и даже оживить сайт анимацией, чтобы не казался совсем уж статичным и застывшим. И самое важное – бесплатно вы получите только определенный набор функций. Для расширения возможностей придется платить.
WebSite X5 Evolution 8
Хорошая новость первая – эта программа имеет русский интерфейс.
Хорошая новость вторая – с ней справится даже абсолютный «чайник». Всего-то надо следовать подсказкам мастера и поэтапно выполнять то, что показывает программа. И можно быть уверенным, что сайт получится без дыр по кодам.
Некоторые этапы можно пропускать, если они вам не нужны. Например кнопки платежных систем. Распространение опять же смешанное, частично бесплатное.
Adobe Dreamweaver
Перейдем к платной, но очень популярной программе даже в среде специалистов. Adobe Dreamweaver является на сегодня самым удобным редактором с самым полным набором функций.
Она поддерживает новейшие языки программирования. Много возможностей цветовой разметки, проверки отображения сайта в разных браузерах и удобная работа в самом визуальном редакторе. Да и в конце концов, если денег жалко, то вполне можно поискать взломанную версию программы в рунете, которая раздается бесплатно.
Итоги этой статьи простые. Если есть спрос, значит есть и предложение. Заиметь свой собственный сайт в Интернете еще несколько лет назад могли только богатые люди и те, кто знает языки программирования. Сегодня это реально даже при наличии низкой зарплаты и без знания html. Было бы желание, как говорится.
В статье приведены краткие обзоры всего нескольких визуальных редакторов для сайтов, но их на самом деле намного больше. Легко можно подобрать тот, который будет удобным лично вам.
Вдохновения вам, творите свои веб-ресурсы различного дизайна, зарабатывайте деньги и помните – будущее за теми, кто шагает в ногу со временем. Не забудьте подписаться на обновления блога, обещаю, что вы еще много интересного сможете узнать в новых редакциях. Поделитесь прочтенным материалом в соц. сетях, возможно, ваши друзья тоже заинтересуются изложенным. До встречи!
С уважением! Абдуллин Руслан
Понравился блог? Подпишись, чтобы получать новые статьи на почту и быть в курсе всех событий!
abdullinru.ru
25 лучших визуальных редакторов от Smashing Magazine
Англоязычный вариант статьи на Smashing Magazine.
Когда дело доходит до редакторов кода иногда трудно получить четкий обзор всех преимуществ и функциональных возможностей, которые могут предложить разные редакторы. Однако, в конце концов требуется по крайней мере один, поэтому очень важно знать, какой редактор лучше всего подходит под ваши личные нужды.
WYSIWYG-редакторы зачастую критикуются сторонниками «ручного» создания кода за раздутый, грязный и не совместимый со стандартами исходный код, который эти редакторы производят. Однако в последнее время WYSIWYG-редакторы стали намного лучше. Иногда вам нужно предоставить своим клиентам самые простые инструменты для редактирования или обновления своих веб-сайтов. И как раз тут WYSIWYG-редакторы незаменимы.
Было бы неправильным рекомендовать вам некоторые «лучшие» редакторы, потому что выбор всегда зависит от ваших нужд, основных целей, навыков и опыта. Поэтому в этой статье мы попытались дать вам обзор разных, полезных и не очень WYSIWYG-редакторов.
Надеемся, Вы найдете новые редакторы о которых вы никогда не слышали раньше. Или, может быть, вы найдете некоторые функции, которые вы пропустили в Вашем любимом редакторе, или рискнете поэкспериментировать с рядом перспективных вариантов для улучшения вашего рабочего процесса. Кроме этого, вы можете узнать, какие редакторы можно использовать и какие инструменты вам не следует использовать.
Что же означает WYSIWYG?
В таких редакторах можно изменять не исходный код ваших документов, а его представление, которое (по-возможности) будет опубликовано в итоговом документе. Таким образом, вместо написания блоков кода вручную, вы управляете проектированием при помощи компонентов, используя окно редактора. Это означает, что Вы видите что-то очень похожее на конечный результат, хотя документ или изображение еще только создается.
Примечание: эта статья содержит рецензии только desktop-ориентированные WYSIWYG-редакторы, которые работают под Windows, Linux или Mac. Она не дает обзор WYSIWIG-редакторов на JavaScript, но вы можете найти обширный обзор таких редакторов на здесь или здесь.
Adobe Dreamweaver
Dreamweaver (Win / Mac)
Ранее продукт Macromedia, Dreamweaver — это инструмент который является одним из наиболее широко используемых редакторов, которые могут помочь разработчикам улучшить рабочий процесс и сэкономить массу времени при кодировании. Если предыдущие версии Dreamweaver, иногда генерировали причудливый исходный код, то последняя версия может генерировать (в большинстве случаев) совершенно чистую разметку.
Dreamweaver также предоставляет различные полезные инструменты, такие как, библиотеки фрагментов кода, ftp управление, сервер отладки и комплексного кодирования. Например, Вы можете просматривать CSS информацию в единой, унифицированной CSS панели, что позволяет легко увидеть стили применительно к конкретным элементам, определить, где атрибуты определяются и редактировать существующие стили. Смотрите также наш список обучающих материалов по Dreamweaver. Цена: $ 400 (версия CS3).
Некоторые из многочисленных возможностей Dreamweaver:
* Расширенное CSS редактирование
* Integrated coding environment
* Spry framework для Ajax
* Проверка совместимости браузеров.
* Интеграция с Photoshop CS3 и Fireworks.
* Code snippets (например, CSS форматов)
* Управление FTP
* Поддержка XML
* Поддержка FLV
* Обучающие ресурсы (например, Adobe CSS Advisor)
* Многочисленные расширения для Dreamweaver.
Amaya
Amaya (Win / Mac / Linux)
Что действительно делает Амайя непохожей на остальных, то что это гибрид веб-браузера и редактора веб-страниц, таким образом, Вы можете просмотреть страницы в Интернете и редактировать Ваши страницы в одном и том же приложении. Созданный WWW-консорциомом, этот инструмент позволяет управлять веб-сайтами, изменять и обновлять их содержание, добавить новые изображения и ссылки. Конечно, если Амайя сможет отображать эти страницы.
Последняя версия редактора, Амайя 10, была выпущена в феврале 2008 года. Он способен работать с нескольких документах одномременно ((X)HTML, MathML(. Mml) и SVG (. Svg) документы, могут быть отображаться и редактироваться одновременно). Например Вы можете вставить математические формулы, с помощью pop-up: Амайя преобразует их через Math-ML «на лету».
Амайя также включает в себя объединенное приложение аннотаций (аннотации, внешние комментарии, примечания, замечания, которые могут быть прикреплены к любому веб-документу или отдельной части документа) и он поддерживает SVG, RDF и XPointer. Open-source.
Rapidweaver
RapidWeaver (Mac)
RapidWeaver является мощным, основанным на шаблонах, инструментом для создания веб-сайтов, который может генерировать страницы разного рода, такие как, например, текстовые страницы, блоги, контактные формы, графические галереи и Flash слайд-шоу, а также имеет встроенный в FTP-менеджер и интеграция с iPhoto и .Mac.
Редактор включает в себя подкастинг, встроенные комментарии, RSS-ленты, permalink и поддержку тегов. RapidWeaver также будет SEO-дружелюбен. Он также имеет много мощных функций, таких как модифицирование тем, php-рендеринг, mix and match WYSIWYG and HTML, smart publishing, XHTML and CSS based site output, просмотр исходного кода, встроенная проверка ошибок. Все шаблоны основаны на XHTML и CSS. Что является замечательным так это то, что RapidWeaver генерирует код валидный. Цена: $ 49.
Adobe Contribute
Adobe Contribute
Основная цель Adobe Contribute, является возможность редактирования веб-сайтов и блоги для пользователей не имеющих каких-либо технических знаний. Contribute CS3 позволяет авторам обновить существующие сайты и блоги, сохраняя целостность сайта. Contribute предлагает интеграцию с Dreamweaver, дает возможность размещения материалов с Microsoft Office и редактирования из IE 7 и Firefox.
С этим WYSIWYG-редактором, авторы могут изменять или обновлять любой веб-сайт или блог без необходимости изучать HTML. Цена: $ 169 (версия CS3).
Adobe Golive
Adobe Golive (Win / Mac)
В апреле Adobe прекратила разработку и продажу GoLive 9. Adobe GoLive рекомендует пользователям перейти на Dreamweaver, после чего Вам, вероятно, не следует рекомендовать GoLive (на самом деле удивительно мощный инструмент редактирования, (см. ниже) для ваших клиентов.
Некоторые Adobe GoLive 9 возможности:
* Designer styles
* Visual CSS layout
* Place command
* Adobe InDesign® integration
* Color management
* Platform support
* Site management tools
* Publish Server
* Smart Objects
Microsoft Expression Web
Microsoft Expression (Win)
В свое время подвергшийся резкой критике за его действительно плохой веб-редактор (Frontpage), Microsoft недавно создал редактор, Expression, который кажется, наследовал многое из его предшественников. Expression попытался создать комфортную обстановку для интернет-пользователей, с чертами, которые являются чрезвычайно похожими на Adobe Dreamweaver. Однако, при прямом сравнении Dreamweaver предлагает больше и производит более чистой код. Тем не менее, Expression производит достойный, совместимый со стандартами код и знает, как работать с CSS и CSS-макетами.
Studio edition с прочими программными приложениями (graphic design tool, video encoding tool т.д.) стоит прим. $500. Одна лицензия Expression стоит $350. Вы можете получить Expression, обновив Frontpage и тем самым сэкономив деньги. Trial-версию на 60 дней можно загрузить бесплатно, однако требуется регистрация.
Обратите внимание: Expression не преемник Frontpage, это довольно разные инструменты разработки. Microsoft Expression имеет большее сходство с Microsoft SharePoint Designer, это скорее конструктор ориентированный и направленный на обеспечение общей веб-разработки. Microsoft SharePoint Designer делает акцент на разработке и адаптации к SharePoint-based сайтах, его можно рассматривать как старшего брата Frontpage.
Некоторые Microsoft Expression возможности:
* ASP.NET 2.0 Integration
* Advanced CSS rendering
* XPath Expression Builder
* Build and format views of industry-standard XML data
* Tag Property Grid
* Accessibility Checking
* Real-time Standards Validation
* Full Schema Support
NVU
NVU(Win / Mac / Linux)
Этот редактор должен стать реальной альтернативой доминирующим продуктам: WYSYWIG-редактор для Linux, Microsoft Windows и Mac, мог бы соперничать с FrontPage и Dreamweaver. А в некоторых аспектах Nvu действительно предоставляет больше возможностей, чем можно было ожидать от абсолютно бесплатного программного обеспечения.
Nvu (произносится как N-view, от «new-view — новый взгляд») предлагает интегрированный FTP-менеджер, мощную поддержку для форм, таблиц и шаблонов, и он действительно очень прост в использовании. CaScadeS, хорошо известный редактор CSS, как дополнительный модуль интегрируется в Nvu и позволяет легко создавать и управлять стилями и видеть как применяются Ваши стили «на лету» в документе Вы изменяете.
Nvu является open source и выпускалась под Mozilla Public License (MPL). К сожалению, развитие NVU не продолжается в последние лет. Усовершенствованную версию NVU можно взять тут — KompoZer.
Некоторые из возможностей NVU:
* Сайт-манаджер позволяет просматривать сайты, которые вы создаете.
* Поддержка XML.
* Встроенный валидатор.
Kompozer
KompoZer (Win / Mac / Linux)
Этот инструмент является ответвлением от NVU, которая была разработана после того дальнейшее развитие NVU замедлилось. KompoZer является веб-авторской системой, которая сочетает в себе менеджер для веб-файлов и WYSIWYG-редактор.
KompoZer чрезвычайно прост в использовании, что делает его подходящим решением для пользователей, которые хотят создавать сайты без получения технических знаний. По сравнению с NVU, Kompozer производит чистый код разметки.
Последняя версия была выпущена в августе 2007 года. Kompozer может рассматриваться в качестве альтернативы для небольших проектов и для пользователей, без технических знаний. Но она, безусловно, слишком слаба для профессиональных веб-разработчиков.
Namo WebEditor 2006
Namo WebEditor 2006 (Win)
Namo WebEditor сочетает в себе практически все инструменты, необходимые для создания веб-сайтов в простой и интуитивно понятный интерфейс. Элементы интерфейса являются чрезвычайно понятными, простыми и удобными в использовании. Вы можете переключаться между дизайн-редактором, HTML-браузером и просмотром фотографий. Вы можете также использовать ряд мастеров, чтобы автоматизировать рабочий процесс. Namo является мощным, однако его WYSIWYG-возможности ограничены. Редактор не обновлялся с 2006 года в связи с чем генерирование исходного кода иногда чрезвычайно странно. Веб-редактор Namo Pro поставляется с Flash-редактором, а также с графическими программами. Тест-версия доступна. Цена: $ 99,95.
Некоторые из Namo Webeditor возможностей:
* Code Helpers для авто закрытия тегов
* Quick Tag Editor
* Tag Selector
* HTML/CSS Reference
Evrsoft First Page 2006
Evrsoft First Page 2006 (Win)
На самом деле этот редактор очень недооценивается. Он не очень популярный и он не обновлялся с 2006 года, но у него есть много весьма полезных функций, которые можно было бы включить в современные WYSIWYG-редакторы. Например, функция Auto History — история помнит все атрибуты и значения, которые использовались и предлагает » правильное» значение автоматически.
Dual Preview Engine позволяет Вам просматривать веб-документы в нескольких браузерах с помощью First Page 2006. Вы можете просмотреть вашу работу в Internet Explorer, Mozilla или просматривать страницы в обоих браузерах бок о бок (горизонтальные / вертикальные панели). И в режиме реального времени просматривать код и редактировать документы.
First Page является бесплатной. Аналогичная бесплатная альтернатива (тоже не обновлялась с 2005): Selida HTML Editor.
Некоторые из возможностей First Page:
* CSS Class Support & Auto Detection
* Syntax Highlighting
* Tag Document Selection Tool
* Tag Auto Completion
* Tidy HTML Power Tools
* Preview in IE as you type
* Image Mapper
* CSS Style Sheet Designer
* Server Side Includes Support
* Highly customizable Toolbars and Interface
* FTP client
* Advanced Find & Replace In Files
Microsoft SharePoint Designer
Microsoft SharePoint Designer 2007 (Win)
Это преемник Microsofts Frontpage. SharePoint Designer является стандартом WYSIWYG-редактора. Помимо поддержки интерактивных страниц ASP.NET, он не предлогает что-то революционное. Бесплатные trial-версия доступна. Существует online-версия, которая требует Internet Explorer и большого терпения.
Некоторые из возможностей Sharepoint:
* support for interactive ASP.NET pages
* create Data Views from RSS, XMl, Office XML
* collaborate with the built-in Workflow Designer
* CSS tools
* track customized pages
* spelling checker
* SharePoint Server 2007 integration
NetObjects Fusion
NetObjects Fusion
Этот редактор когда-то был, вероятно, худшим, но тем не менее очень популярным WYSIWYG-редактором. Он генерировал ужасный исходный код (только MS Word делал это хуже), но часто использовался у веб-хостинговых компаний и провайдеров. NetObjects Fusion позволяет создавать веб-сайты без каких-либо технических знаний. Особенно, если вы хотите создать визитную карточку, Вы можете сделать это в считанные минуты. Но если вы хотите создать профессиональный веб-сайт, NetObjects это не вариант который заслуживает рассмотрения.
В настоящее время доступена 10 версия NetObjects Fusion. Качество генерируемого исходного кода, возможно, изменилось, однако это не имеет большого значения. Существует trial-версия, которая требует от вас зарегистрироваться в магазине. Вот почему у нас нет screenshot-a этого продукта. Цена: ? 100.
Quanta Plus
Quanta Plus (Linux)
Quanta Plus является стабильным, имеет очень удобные и богатые функции среды веб-разработки. Quanta создал редактор предназначеный для эффективной и естесственной разработке и с максимальной для пользователя расширяемостью.
Редактор поддерживает как handcoding, так и WYSIWYG-интерфейс. Он имеет следующие возможности: авто завершение тегов по мере ввода и редактирования тегов в рамках диалогового интерфейса, управление проектами, возможность выполнять от отлаживать PHP-код. Он также имеет визуальный редактор CSS, автодополнение для CSS, предлагает высокую расширяемость и предварительный просмотр.
Редактор также интересные особенности для управления проектами, включая поддержку для локального и удаленного (через сеть) проектов. Проекты могут быть загружены с различных серверов с использованием различных протоколов. CVS поддержка включена, поддержка Subversion возможна за счет внешних подключаемых модулей. Quanta базируется на KDE. Выпускается в соответствии с GPL-лицензией.
Freeway
Freeway (Mac)
Freeway (первоначально Uniqorn) поставляется в двух вариантах, Freeway Pro и Freeway Express. Freeway 5 Pro может быть использована для создания CSS макетов с использованием абсолютного позиционирования. В расширенным варианте, например, подключение к базе данных MySQL, используя скриптовый язык, такой как PHP, производится с помощью подключаемых модулей называемый «Actions». Некоторые Actions могут быть загружены бесплатно на нескольких веб-сайтах, но есть и коммерческие, такие как 3rd Party Actions.
Существует trial-версия, которая требует от вас заполнить довольно долгую веб-форму. Freeway был номинирован на Macworld 2008 Awards в номинации Creative Web Product года. Если вы используете Mac, то Freeway вместе с RapidWeaver является с первым вариантом, который заслуживает рассмотрения.
Некоторые из возможностей Freeway:
* Multiple Master Pages
* Layout Tools
* Link Map
* Link Styles
* Integrated .Mac upload
* Internet Explorer Compatibility
* Support for Sliced Background Images
* Built-in preview within Freeway (Safari/Webkit)
* Full EPS (Panther & later), Illustrator, Photoshop layered file import
* Freeway Shop
* Work with Blogger Templates
Seamonkey Composer
SeaMonkey Composer (Win / Mac / Linux)
Этот редактор является простой, но очень мощной альтернативой, крупных коммерческих приложений. Будучи наследником Netscape Composer, SeaMonkey Composer в действительности не имеют ничего общего с ним.
Редактор является мощным и одновременно простым и предлагает динамичные изображения и table resizing, быструю вставку и удаление из ячеек таблицы, расширеную CSS-поддержку, и поддержку позиционированных слоев. WYSIWYG-редактор встроен в SeaMonkey.
Create
Create (Mac)
Create сочетает в себе основные функции приложений таких как Illustrator, InDesign, Pages, GoLive, Canvas, Dreamweaver, QuarkExpress, и упорядочил их для удобного использования, он недорогой, предназначен для OS X. Среди прочего, вы можете добавить ссылки на текст и графику с помощью drag-n-drop, имееется инструмент который автоматически создает навигацию и индекс, и вы можете создавать PDF и веб-сайты из одного документа.
WYSIWYG Web Builder
WYSIWYG Web Builder
Web Builder является высоко настраиваемым и расширяемым приложением с множеством функций, скриптов и шаблонов. Новые элементы дизайна могут быть добавлены с помощью drag’n’drop, имеется множество скриптов. Возможно редактирования изображений в рамках программного обеспечения.
PayPal eCommerce Tools интегрирован; имеется RSS Feed объект, блог с встроенным RSS и SiteMap генератор совместимый с Google. Редактор также имеет множество расширений, таких как защита паролем, RSS канал, RSS парсер, фотоальбом и lightboxes.
Если у Вас возникли вопросы, то для скорейшего получения ответа рекомендуем воспользоваться нашим форумом
www.webmasters.by
Визуальный (WYSIWYG) редактор для создания сайтов
Почти каждый пользователь Интернета когда-нибудь задумывался о создании собственного сайта, но далеко не у всех есть время и способности, чтобы освоить хотя бы основы веб-программирования и верстки. Но, в большинстве случаев, нет необходимости в разработке сложных программируемых элементов, и создать красивый и функциональный сайт можно используя визуальный редактор сайтов или WYSIWYG-редактор.
Подобные программы, несмотря на относительную простоту использования, являются далеко не любительскими инструментами для разработки, но как раз в возможности работы пользователя с любым уровнем опыта и состоит их особенность.
WYSIWYG – это аббревиатура от английских слов What You See Is What You Get, что переводится как «что видишь, то и получишь». То есть, речь идет о среде разработки, в которой пользователь по мере своей работы может сразу же видеть примерный результат своих усилий. Чаще всего в Рунете используется русскоязычный аналог упоминаемой аббревиатуры, и программы такого типа носят название визуальных редакторов. С помощью подобных приложений можно создавать код на разных языках программирования и верстки – HTML, CSS, PHP и др.
Самый популярный WYSIWYG-редактор HTML и других языков веб-разработки – Adobe Dreamveawer. Он отличается действительно удобным интерфейсом, большим количеством доступных инструментов, поддержкой актуальных технологий и интеграцией с другими приложениями пакета Creative Suite. Большим плюсом Adobe Dreamveawer является наличие подробной профессиональной документации, а также множества бесплатных уроков по работе с программой, которые можно найти в сети Интернет. Кроме того, он может работать с распространенными движками (CMS), такими как Joomla, WordPress и Drupal. Актуальной сейчас является версия CS6.
Еще один популярный визуальный редактор — WYSIWYG Web Builder, который недавно обновился до версии 9. Это мощное решение, с помощью которого можно создавать качественные веб-сайты, не обладая при этом навыками верстки и веб-программирования. Программа позволяет создавать как простые сайты-визитки или корпоративные ресурсы, так и многостраничные ресурсы со сложными сценариями и вставкой интерактивных элементов. В комплекте идут несколько различных шаблонов, а в процессе работы можно добавлять новые. В последней версии WYSIWYG Web Builder появился ленточный интерфейс, добавлены новые возможности для работы с CSS3 и больше сотни других улучшений.
Кроме коммерческих решений, есть и хорошие open-source решения. Например, бесплатный визуальный редактор BlueGriffon, созданный на движке Gecko, на котором работает также всемирно известный браузер Mozilla Firefox.
Это современное и надежное решение для редактирования веб-страниц и создания сайтов, соответствующее последним стандартам Web. BlueGriffon является мультиязычным визуальным редактором HTML, PHP, CSS и других языков веб-разработки, который обладает интуитивно понятным, удобным интерфейсом, а редактируемый в нем документ будет выглядеть точно так же как в браузере Firefox.
WYSIWYG-редактор является действительно удобным инструментом для редактирования и веб-страниц и создания полноценных сайтов разного уровня сложности. При этом, пользователь может создавать привлекательные веб-сайты без необходимости обширных технических знаний.
Читайте также
- Топ 5 бесплатных HTML-редакторов
- Редактор HTML: советы по выбору
www.imagecms.net
Визуальный редактор сайтов
Создать холст Создать блок для компоновки (DIV)Сохранить класс Удалить класс
Режим редактирования hover
Режим редактирования по месту
Вырезать
(Ctrl + X)
Удалить всё
Копировать
(Ctrl + C)
Удалить стили
Вставить
Восстановить
Сохранить
Отменить последнее(Ctrl+Z)
Заголовок
Заголовок h2Заголовок h3Заголовок h4Заголовок h5 Маркированный список Нумированный список Абзац Изображение Таблица Раскрывающееся меню Элемент с надписью сверху Элемент с надписью снизу Создать формуРедактировать текст
Название шрифта
ArialTimes New RomanTimesCourier NewCourierVerdanaGeorgiaTrebuchet MSArial BlackImpactРазмер шрифта
891011121314151617181920212223252627282930Толщина шрифта
НормальныйЖирныйСтиль шрифта
Без наклонаКурсивНаклонныйЦвет шрифта
Выравнивание текста
По левому краюПо центру По правому краю По ширине Редактировать текст по классуНазвание шрифта
ArialTimes New RomanTimesCourier NewCourierVerdanaGeorgiaTrebuchet MSArial BlackImpactРазмер шрифта
891011121314151617181920212223252627282930Толщина шрифта
НормальныйЖирныйСтиль шрифта
Без наклонаКурсивНаклонныйЦвет шрифта
Выравнивание текста
По левому краюПо центру По правому краю По ширинеРедактировать размер Редактировать размер по классу
Редактировать границу Редактировать границу по классу
Редактировать фон Редактировать фон по классу
Редактировать таблицу
Промежуток между рамками ячеек
Рамки ячеек располагаются раздельноПромежутки между рамками убираютсяРедактировать список
Выберите тип маркера списка
Без маркераЗакрашенный кружокНезакрашенный кружокЗакрашенный квадратАрабские цифрыСтрочные римские цифрыЗаглавные римские цифрыСтрочные латинские буквыЗаглавные латинские буквыПоложение маркера относительно
блока строк текста
Выберите тип маркера списка
Без маркераЗакрашенный кружокНезакрашенный кружокЗакрашенный квадратАрабские цифрыСтрочные римские цифрыЗаглавные римские цифрыСтрочные латинские буквыЗаглавные латинские буквыИзменить прозрачность
Уровень прозрачности элемента
10,90,80,70,60,50,40,30,20,10 Скрыть элементСкрыть выбранный элемент Показать все элементы
Выровнять с FlexBox
Выберите направление
главной оси
Выберите тип выравнивания
вдоль главной оси
Выберите тип выравнивания
вдоль поперечной оси
Выбрать многострочный режим
Однострочный режимМногострочный режим слева направоМногострочный режим справа налевоТип выравнивания рядов блоков
Ряды блоков растянуты, дабы занять все имеющееся пространствоРяды блоков прижаты к началу flex-контейнераРяды блоков прижаты к концу flex-контейнераРяды блоков находятся в центре flex-контейнераПервый ряд блоков располагается в начале flex-контейнера, последний ряд блоков блок – в конце, все остальные ряды равномерно распределены в оставшемся пространстве Ряды блоков равномерно распределены в от начала до конца flex-контейнера, разделяя все свободное пространство поровну Выровнять с FlexBox по классуВыберите направление
главной оси
Выберите тип выравнивания
вдоль главной оси
Выберите тип выравнивания
вдоль поперечной оси
Выбрать многострочный режим
Однострочный режимМногострочный режим слева направоМногострочный режим справа налевоТип выравнивания рядов блоков
Ряды блоков растянуты, дабы занять все имеющееся пространствоРяды блоков прижаты к началу flex-контейнераРяды блоков прижаты к концу flex-контейнераРяды блоков находятся в центре flex-контейнераПервый ряд блоков располагается в начале flex-контейнера, последний ряд блоков блок – в конце, все остальные ряды равномерно распределены в оставшемся пространстве Ряды блоков равномерно распределены в от начала до конца flex-контейнера, разделяя все свободное пространство поровну Выровнять выбранный блокВыровнять выбранный блок по центру сверху Выровнять выбранный блок по центру слева Выровнять выбранный блок по центру справа Выровнять выбранный блок по центру снизу Выровнять выбранный блок по центру(по X и Y)
Выбрать тип курсора
Курсор по умолчаниюВ виде наклонной стрелкиВ виде крестикаДля справочной информацииКрестик (для пепемещаемых элементов)В виде руки (для гиперссылок)Для текстовых элементовВ виде песочных часов(режим зависания)
Выбрать тип курсора по классуКурсор по умолчаниюВ виде наклонной стрелкиВ виде крестикаДля справочной информацииКрестик (для пепемещаемых элементов)В виде руки (для гиперссылок)Для текстовых элементовВ виде песочных часов(режим зависания)
Обтекание текстомВыбрать тип обтекания текстом
Без обтеканияС правой стороныС левой стороныДобавить (удалить) гиперссылку
Удалить ссылку
Показать код Спрятать код Скачать код
perviyptr.github.io
выбери свой для удобной работы
Здравствуйте, уважаемые подписчики и гости моего блога. В нескольких предыдущих статьях я посвящал вас в основы языков css и html, однако только косвенно упоминал о вспомогательных программах. Именно поэтому сегодня считаю нужным рассказать про лучший визуальный редактор html. Расскажу вам о некоторых популярных инструментах сайтостроения, а впоследствии вы сможете скачать и опробовать на практике понравившийся.
Попадание в десяточку
На данный момент компании выпустили множество специализированных программных продуктов, основная цель которых оптимизировать рабочий процесс девелоперов. Существуют как платные, так и бесплатные редакторы.
Так как мой блог направлен на обучение новичков в этом деле, я решил описать топовые бесплатные инструменты создания страниц сайтов. Скорее всего вы уже догадались, что речь пойдет о десятке наиболее удобных визуальных программ. Начнем с самых простых.
Notepad++ (https://notepad-plus-plus.org/)
Это отличный инструмент для обучения будущих разработчиков. Программа обладает простым удобным интерфейсом без лишних наворотов, поддерживает многоязычность, т.е можно перевести меню редактора на русский. Также к преимуществам можно отнести подсветку синтаксиса кода, внедрение верификации и валидации.
PSPad (http://www.pspad.com/)
Также как и предыдущая программа, PSPad – это инструмент общего назначения, который подсвечивает css и html текст, автоматически сохраняет изменения после завершения программы, проверяет правильность написанного кода, позволяет включить режим предпросмотра разрабатываемых страниц в браузере. Данный визуальный редактор содержит в себе больше полезных функций, чем Notepad++, однако он все еще относится к простым средствам разработки.
KompoZer (http://www.kompozer.net/)
Программный продукт относится к WYSIWYG-редакторам, что означает «что ты видишь, то ты и получишь». KompoZer входит в список лидеров среди визуальных редакторов и неспроста. Он позволяет разработчикам и дизайнерам работать вместе, так как наделен 3-мя режимами работы. Начнем с моего любимого – режима кода.
Несмотря на отсутствие автозавершения парных элементов языков разметки, режим позволяет править код как в текстовых редакторах. В WYSIWYG-режиме дизайнерам удобно оформлять внешний вид веб-ресурсов. Совместный же режим предоставляет возможность детального ознакомления с разметкой конкретных объектов.
Komodo Edit (http://www.activestate.com/komodo_edit/)
Мощный инструмент с доступным исходным кодом. В основе его создания лежит коммерческая среда разработки Komodo IDE, поэтому продукт наделен множеством дополнительных плюшек: контекстное автоматическое заполнение и закрытие тегов, генерация случайного текста для заполнения полей, предварительный просмотр стилевой разметки, встроенные регулярные выражения и многое друге.
Ко всему этому хочу добавить, что возможности программы можно значительно расширить при помощи специальных утилит!
jEdit (http://www.jedit.org/)
jEdit относится к кроссплатформенным программным продуктам. В нем предусмотрена подсветка синтаксиса написанного текста, дополнительная установка плагинов для расширения возможностей после которых становится доступными автоматическое закрытие тегов, проверка подлинности кода и многие другие функции.
Однако лично для меня камнем преткновения на пути к этому редактору стал его неаккуратный и неудобный интерфейс.
Aptana Studio (http://www.aptana.com/)
Если вы хотите обучаться программировать в полноценной среде разработки, то поработайте в этом продукте. Среда поддерживает множество языков программирования и подойдет не только для сайтов, а и для написания других видов приложений. Но будьте готовы выделить некоторое время для освоения ее технических особенностей.
Fraise (https://www.assembla.com/home)
Это текстовый редактор, который подходит для создания веб-ресурсов, к сожалению, только под платформу Mac OS X 10.6. Программа поддерживает цветную подсветку текста различных языков, обеспечивает предпросмотр созданных страниц, оснащена специальными командами для ускорения набора кода и проверки синтаксиса, позволяет пользоваться регулярными выражениями, а также автоматически дописывает вводимые свойства.
Gedit (http://projects.gnome.org/gedit/)
Простенький текстовый редактор, который после установки дополнений чудесным образом превращается в веб-редактор. С помощью утилит добавляются такие свойства:
- Автозавершение парных элементов;
- Генерация временного текста;
- Проверка синтаксиса кода;
- Предпросмотр в любом браузере.
Vim (http://www.vim.org/)
Тяжелый в освоении консольный редактор, обладающий множеством плюсов для программистов. Оснащен 3-мя режимами работы.
ICEcoder (https://icecoder.net/downloads)
Это браузер 2015 года, редактор текста которого предоставляет возможность писать и править код непосредственно в браузере. Отличный современный инструмент для работы как локально, так и в сети, оснащен характеристиками стандартных редакторов, однако поддерживает работу с базами данных и функционирует на всех платформах.
Что касается меня, то я часто меняю WYSIWYG-программы, пробуя новые версии и продукты разных компаний.
На этом все, желаю удачи в поисках подходящего вам редактора! Делитесь с друзьями ссылочкой и перед уходом обязательно подпишитесь на мой блог. В проекте еще много полезных статей. Пока-пока!
С уважением, Роман Чуешов
Загрузка…Прочитано: 1017 раз
romanchueshov.ru