Средства редактирования HTML-кода (включая текст). Простые текстовые редакторы и текстовые процессоры. Для создания веб-страничек можно использовать самые разные средства, от текстовых процессоров типа Microsoft Word до простых редакторов текста типа Блокнота в Windows. Хотя текстовые процессоры типа MS Word и позволяют сохранять набранный текст в формате html, но полученный код, мягко говоря, оставляет желать лучшего. Отмечу, что текстовый процессор Write из пакета OpenOffice. org, существующий в вариантах как для Windows, так и для Linux, создает значительно более приемлемый код, однако и он довольно избыточен.
Так что использовать такие продукты при разработке сайтов не рекомендуется. Другой крайностью является прямое редактирование html-кода в простом текстовом редакторе типа Блокнота в Windows. Большинство опытных вебмастеров утверждают, что им для создания сайта ничего кроме Блокнота не требуется. Вероятно, это действительно так. Говорят, что хорошему плотнику тоже ничего не требуется, кроме топора. Я тоже практически все страницы сайта создавал во встроенном текстовом редакторе файлового менеджера FAR для Windows. В ОС GNI/Linux имеются аналогичные средства: Kwrite или Kate в KDE, gedit в GNOME.
Что касается BestAddress HTML Editor 2010 Professional, можно сказать, что эта программа имеет все шансы Редактор может автоматически загружать проект на Новички, желающие понять принципы работы и написания HTML, CSS, Java и PHP- кода.
С точки зрения начинающего веб-мастера такие средства имеют существенный недостаток, заключающийся в том, что для создания страничек в простом текстовом редакторе требуются основательные знания по HTML и CSS. А если вы разрабатываете динамический сайт, то необходимы знания используемого языка программирования, баз данных и так далее. Текстовые редакторы с подсветкой тегов. Второй вид редакторов, часто используемых веб-мастерами, - это текстовые редакторы с подсветкой тегов. При работе с ними Вы тоже видите непосредственно HTML-код документа, но HTML-теги и другие служебные элементы (например, скрипты) будут выделены цветом, что несколько облегчает работу вебмастера.
Программа для создания веб-страниц, которая автоматически создает HTML - код в то время, как вы просто размещаете объекты. Т.е. знание HTML от. Но мы заявляем — забудьте об этой программе, она не Если ваша цель — написание небольшого HTML - кода, После запуска программы минимальный первоначальный код будет создан автоматически. Тем, кто предпочитает набирать код HTML вручную, но кому не хватает что при написании HTML -документа все теги автоматически подсвечиваются. Программа автоматически сканирует выбранную папку и выбирает файлы, которые содержат нужный код.
Часто можно подключить внешний браузер, так что вы можете оперативно контролировать результаты работы, просматривая создаваемую страницу в браузере. К этому классу редакторам можно отнести и редакторы для программистов, обеспечивающие подсветку синтаксиса (в том числе и синтаксиса html). Примером редактора этого класса может служить Notepad++. А можно выделить такие редакторы в отдельный тип, аргументируя это тем, что в html-редакторах обычно встроены средства просмотра получающегося результата (типа встроенного браузера), а в редакторах для программистов ничего подобного нет (но зато часто можно просто подключить вызов браузера). Некоторое время я пытался из под Windows пользоваться редактором Notepad++.
но потом обнаружил PSPad. который мне понравился гораздо больше. Одно из существенных преимуществ PSPad состоит в удобной работе с файлами в разных кодировках, в том числе с UTF-8. Поскольку в PSPad встроено средство просмотра html-файлов (своего рода мини-браузер), то этот редактор ближе к специализированным html-редакторам, хотя и позиционируется разработчиками как редактор для программистов.
Специализированные редакторы HTML-кода. Специализированные HTML-редакторы отличаются тем, что поддерживают следующие возможности:. подсветка синтаксиса — выделение тегов, текста, ключевых слов и параметров разными цветами. Это облегчает поиск нужного элемента, ускоряет работу разработчика и снижает возникновение ошибок;.
работа с вкладками. Сайт представляет собой набор файлов, которые приходится править по отдельности, для чего нужен редактор, умеющий одновременно работать сразу с несколькими документами. При этом файлы удобно открывать в отдельных вкладках, чтобы быстро переходить к нужному документу;. подсказки по использованию элементов html и css (встроенные справочники);. проверка текущего документа на ошибки;. встроенный браузер, что позволяет не выходя из редактора посмотреть, как будет в итоге выглядеть создаваемая страничка. Существует широкий спектр HTML-редакторов: от простых редакторов исходного html-кода (подобных рассмотренным выше редакторам с подсветкой тегов) до WYSIWYG-редакторов.
WYSIWYG-редакторы (What You See Is What You Get - что видишь, то и получаешь) - это программы, с помощью которых можно создавать страницы, не имея никакого понятия о языке HTML. Самым распространенным из них является, вероятно, Microsoft FrontPage. Недостатком WYSIWYG-редакторов является громоздкость созданных с их помощью HTML-документов.
Это получается оттого, что WYSIWYG-редакторы вставляют HTML-коды, как говорится, "на все случаи жизни". В результате объем документа, а значит и время загрузки страницы, увеличивается. В отличие от WISIWIG-редакторов в обычных редакторах HTML-кода результирующий HTML-документ, как правило, получается более компактным и изящным. Здесь речь идет именно о HTML-документе, а не о странице, которая будет видна в окне браузера. Красота и изящность страницы очень слабо связаны со способом ее создания. Ниже перечислены некоторые из специализированных html-редакторов. Поскольку я, естественно, не имею достаточного опыта работы с каждым из этих продуктов, приведенные характеристики этих редакторов частично заимствованы из Сети.
Отдельно перечислю редакторы для Windows и Linux, учитывая, что некоторых читателей может интересовать только одна из этих категорий. Рассматриваются в основном свободные, то есть бесплатные продукты.
Те, у которых имеется русскоязычный интерфейс, помечены знаком Рус. HTML-редакторы для Windows. 1st Page Один из самых лучших HTML редакторов, к тому же Freeware! Правда, при установке предупреждает, что некоторые элементы будут недоступны. Возможностей уйма, подстройка интерфейса (для начинающего, продвинутого, крутого вебмастера), очень много документации по HTML и всему, что с этим связано! Пишет по-русски (для этого заходите Options-> Editing preferences и для "Default text charset" выбираете Russian вместо ANSI). Окно редактора разбито на два поля (см. рис. ниже), причем все изменения, вносимые в верхнем поле (где собственно осуществляется редактирование, сразу же отображаются в нижнем поле - окне предпросмотра.
К сожалению, выложенная на сайте версия датирована 2006-м годом. Ну и, на мой взгляд, немного медленно работает. Тем не менее продукт вполне работоспособный. Рис. Редактор 1st Page. Arachnophilia Это HTML-редактор, созданный Полом Лутусом (Paul Lutus).
На домашней страничке автора выложена версия 5.
датированная 2010 годом. Эта версия была полностью переписана Полом на языке Java. Она, к сожалению, не русифицирована. Русифицированную версию 4.
0 можно найти на странице Она вполне подходит для выполнения большинства задач по созданию WEB-страниц, обеспечивает проверку синтаксиса, тегов HTML, CGI, JAVA. Этот редактор хорошо иметь под рукой как вторичный инструмент, подправить что-то быстренько и т. Абсолютно бесплатен, т.
Freware. Amaya Рус Фирменный веб-браузер и HTML-редактор производства W3C - организации, занимающейся разработкой принципов функционирования WWW. Amaya является веб-редактором, то есть, инструментарием, предназначенным для создания и обновления документов непосредственно в сети. В одном пакете объединены все средства браузера и редактора для просмотра, редактирования и удаленного управления файлами.
Это соответствует оригинальной версии сети Интернет, понимаемой как площадка для сотрудничества, а не только среда для публикации. Первые шаги Amaya были в качестве редактора HTML + CSS. С течением времени программа была расширена с целью поддержки XML и таких приложений XML, как XHTML, MathML, а также SVG.
Она позволяет одновременно редактировать все эти приложения в сложных документах. Актуальная версия - Amaya 11. 1 (30 января 2009г. ) доступна для Linux, Windows и MacOS X.
Русифицирована версия 11.
У меня при попытке редактирования настоящей странички с помощью Amaya были порушены все вхождения тега <noindex>. Видимо программе этот тег, изобретенный Яндексом, неизвестен и она пытается его править, но делает это не корректно. HTML-Kit 292 Бесплатный текстовый редактор со множеством наворотов для Windows 7, Vista, XP, 2003, 2000, NT 4, ME, 98 and 95. Создается впечатление, что он может редактировать все: HTML, CSS, JavaScript, Python, Perl, C/C++, PHP, VBSCript, ASP и многое (!) другое. Очень много разнообразнейших плагинов, расширяющих функциональность этого редактора. Но не русифицирован, что может несколько снизить его привлекательность для начинающего вебмастера.
HtmlReader 2. 5 Рус Программа HtmlReader - бесплатный, русскоязычный редактор, предназначенный для просмотра, корректировки и создания новых html - страниц.
Редактор позволяет работать с html- текстом в стиле 1st Page 2000, HomeSite, AceHtml Pro и других подобных программ. Редактор имеет быстрый просмотр во встроенном броузере (MSIE4+) или в любом другом подключенным пользователем, настраиваемую подсветку синтаксиса html файлов. Во встроенном броузере имеется широкий выбор инструментов просмотра страницы с различными эффектами.
Текущая версия - HtmlReader v2. 5 от 18. 12. 2007. NeonHTML 4.
5 Рус Бесплатный редактор HTML и CSS с визуальными инструментами. Поддерживает XHTML. Позволяет редактировать быстро и комфортно: подсветка синтаксиса, визуальное создание тегов в диалогах. Большинство инструментов имеют предпросмотр. Есть встроенный браузер с имитацией разного разрешения и масштаба. Инструмент поисковой (SEO) оптимизации и проверки рейтинга сайта.
Очень хорошая работа с цветами - специально созданная палитра как в графических редакторах, список недавних цветов, список цветов страницы, быстрое редактирование цвета одним кликом, мгновенное создание параметров стиля с выбором цвета, докер цвета, копирование и перенос цветов между диалогами. Инструменты взаимодействуют друг с другом, этим достигается быстрое привыкание к интерфейсу, удобство и высокая скорость работы. Не содержит множества бесполезных меню.
Вы всегда можете отредактировать интерфейс, убрать ненужные кнопки и создать собственные панели с необходимыми Вам функциями, каждой из которых можно назначить сочетание клавиш. Рис. Редактор NeonHTML. NVU 1. 0 Рус Визуальный (WYSIWYG) HTML-редактор. Основой для создания NVU послужил код Mozilla Composer. Удобные мастера позволяют вставить ссылку или картинку, разместить таблицу или форму с помощью нескольких кликов и тут же посмотреть изменения.
При незначительной правке существующего шаблона знание html вообще не требуется - работать с кодом можно на уровне визуального редактора. Такие инструменты как редактор css, мастер оптимизации кода, консоль javascript значительно упрощают разработку. Функциональность редактора может быть расширена за счет плагинов, которые можно скачать с официального сайта.
В редактор встроен html валидатор, кроме этого можно запустить мастер проверки орфографии и, таким образом, полностью подготовить страницу к публикации в сети. Готовый проект выгружается на сервер с помощью ftp клиента, который также интегрирован в программу. Существуют версии программы под ОС Windows, Linux и Mac. К недостаткам программы можно отнести то, что в сохраненном файле оказалось очень много лишних пробелов.
И вообще код был отформатирован по каким-то непонятным мне принципам. Не понравилось Кроме того, программа датирована 2005-м годом, что тоже не увеличивает ее привлекательности. Web Development Studio 2. 0 Рус Средство для разработки веб-сайтов (HTML, PHP, Perl, CSS, JS, VBS, ASP, SSI, Curl, VRML) Несмотря на небольшой размер редактор имеет широкую функциональность и гибкие настройки.
Большим плюсом программы является встроенная справочная система по 11 языкам программирования и разметки. Справочник содержит достаточно подробную информацию о функциях, тегах, их свойствах и вариантах применения. Версия файла: 2. 16.
1232 от 20. 04. 2006. Все перечисленные в этом списке редакторы я устанавливал на свой компьютер и немного в каждом из них работал. Правда, явно недостаточно для того, чтобы делать окончательные выводы. Однако предварительно могу сказать, что больше всех мне понравились редакторы 1stPage и NeonHTML 4.
Но первая работает с какими-то задержками, так что пока я остановился на второй, а далее посмотрим. HTML-редакторы для Linux.
Из приведенного выше списка html-редакторов для Windows по крайней мере 3 имеют версии и для Linux. Это Arachnophilia (поскольку она написана на Java и будет также работать в Linux, если в системе установлена JRE), Amaya и NVU. Не думаю, что под Linux они работают лучше, чем под Windows, поэтому посмотрим на альтернативы. Aptana Studio Мощная среда программирования веб-приложений на основе HTML, CSS и JavaScript.
Bluefish Мощный редактор, предназначенный для веб-разработчиков, предоставляющий множество опций при написании html-страниц и скриптов. Ориентирован на создание динамических и интерактивных веб-сайтов. Версия 2.
2 требует gtk 2. 12 или более позднюю и опционально библиотеки libenchant для проверки правописания и libgucharmap для вывода таблицы символов.
Quanta Plus Программа производит очень хорошее впечатление. Её мощь, гибкость и настраиваемость способны удовлетворить требования самых привередливых веб-кодеров независимо от их уровня подготовки. Кроме режима ручного редактирования и визуального режима имеет так называемый «комбинированный» режим работы, когда пространство окна разбивается на две части, верхнюю, где можно увидеть, как будет выглядеть страница, и нижнюю, с исходным кодом. Редактировать страницу можно как в нижней части, так и в верхней, все изменения автоматически синхронизируются. Вставив код, вы сразу же увидите, что из этого получится, а поставив перенос строки сможете посмотреть, каким тегом это делается. SCREEM Очень удобный HTML-редактор для среды GNOME.
Не относится к WYSIWYG, то есть предназначен только для редактирования html-кода. Имеет средства визуализации и управления сайтом, включая автоматическое обновление ссылок и средства загрузки проекта на сервер. OpenBEXI OpenBEXI - это средство разработки вебсайтов в режиме WYSIWYG.
Включает инструменты для создания страниц, редактирования и выкладывания на сервере провайдера. KompoZer KompoZer - редактор класса WYSIWYG для создания веб-страниц.
Создан с целью максимального облегчения процесса для неподготовленных пользователей, которые хотят тем не менее создавать профессионально выглядящие сайты. SeaMonkey Интегрированный набор веб-приложений, включающий браузер, почтовый клиент, HTML-редактор, feed-ридер, IRC-чат.
Сравнительный анализ этих средств веб-редактирования я пока не проводил. Кое-какие сведения и сравнения (не очень свежие) вы найдете в статьях С. Супрунова "HTML-редакторы" и А. Федорчука "Пингвин в паутине. Web-редакторы для Linux".
"Сага о Web-редакторах". Полезные ресурсы. Другие средства обработки текста. Кроме удобного редактора текста вебмастеру бывают нужны и полезны и другие средства работы с текстами. Иногда (а может быть даже часто) нужно бывает произвести замену какого-то фрагмента текста сразу во всех файлах сайта.
К примеру, если вы переместили страничку из одного подкаталога в другой, нарушились все ссылки на эту страницу. Нужен какой-то инструмент для того, чтобы поменять такие ссылки во всех файлах. В таких случаях вам может помочь Text Replacer - утилита для поиска и замены многострочных фрагментов текста в файлах указанного каталога и вложенных папок. Ни один, даже самый грамотный вебмастер, не застрахован от опечаток и ошибок при наборе текста. Поэтому желательно после завершения редактирования какой-то странички проверить себя с помощью средств проверки правописания. В некоторых редакторах такие средства встроены, однако не всегда работают достаточно хорошо. На этот случай можно предложить такой прием: загружаем полученный html-файл в текстовый процессор типа MS Word или OpenOffice.
org Writer и смотрим, какие есть ошибки. Только не нужно править эти ошибки непосредственно в текстовом процессоре.
Откройте параллельно ваш любимый редактор html-кода и делайте исправления там. По завершении работы выйдите из текстового процессора без сохранения файла (иначе html-код будет безвозвратно испорчен) и сохраните тот результат, что получен в html-редакторе. Существует и онлайн-сервис для проверки орфографии - " Орфограф " студии А. Лебедева. Вставленный в форму на сайте текст он проверяет непллохо, а вот когда я задал проверку этой веб-страницы целиком, он не справился с кодировкой.
С помощью текстового процессора мы выявим грамматические (точнее, орфографические) ошибки. Но возможны и ошибки в HTML-коде, например, неправильно закрытые или не закрытые теги, а также ошибки в CSS-таблицах.
На этот случай имеются две интересные программы: HTML Tidy - программа и библиотека для выявления ошибок и оптимизации html-кода, и CSS Tidy - библиотека для оптимизации CSS-кода. Огромное количество сайтов предлагают минимизаторы, основанные именно на CSS Tidy: CleanCSS.
CSS Formatter and Optimizer. CSS Compressot и многие другие. Для оптимизации JavaScript можно использовать YUI Compressor. Полезные ресурсы.
Дополнение. Платные продукты. Adobe (Macromedia) Dreamweaver Этот редактор считается наилучшим средством создания веб-страниц, он часто упоминается как эталон при описании других продуктов аналогичного назначения. Разработан и поддерживался компанией Macromedia в версиях до 8-й (2005 год). Следующие версии (начиная с Dreamweaver CS3 (2007)) выпускает Adobe. Богатый инструментарий, открытость приложения для всевозможных настроек, удобный интерфейс и другие особенности сделали Dreamweaver одним из наиболее популярных HTML-редакторов в мире. Недостатком считается добавление "лишнего" кода.
К сожалению, Dreamweaver платный и очень не дешевый. Для знакомства с ним можно скачать полноценную 30-ти дневную пробную версию.
SNK Metaproducts Web Studio Рус Metaproducts Web Studio представляет собой пакет программ, предназначенный для создания сайтов, включая разработку, верстку, кодирование и загрузку по FTP. С помощью Web Studio вы можете быстро и с максимальным удобством создавать и поддерживать собственные web-сайты. Имеет также прекрасную справочную систему не только по работе с самой программой, но и по языкам HTML и JavaScript.
Программа условно-бесплатная, то есть фирма SNK Software дает Вам программу в бесплатное пользование на 30 дней. Предполагается, что за этот срок Вы опробуете программу и решите: нужна она Вам для дальнейшего использования или нет.
По истечении испытательного срока программу необходимо зарегистрировать (русскую версию можно зарегистрировать по специальной цене - 1300 руб. PHP Expert Editor 4. 3 Рус PHP Expert Editor - удобный редактор для PHP, Perl, Python, HTML, Java Script и других файлов с поддержкой UTF-8.
Программа разработана специально для PHP мастеров и имеет встроенный отладчик PHP. PHP Expert Editor имеет встроенный HTTP сервер и позволяет запускать PHP, Perl, Python, скрипты. Вы также можете использовать любой внешний HTTP сервер. Проверка синтаксиса PHP, встроенный браузер, FTP клиент с поддержкой SFTP, Кодовый и файл эксплорер, поддержка проектов, настраиваемые шаблоны кода, настраиваемая подсветка кода, и многие другие функции значительно облегчают работу разработчика. Распространяется на принципах Shareware, стоимость - 35 евро. phpDesigner 7 – от MPSOFTWARE. phpDesigner 7 представляет собой универсальное решение для веб-разработчиков.
Включает полнофункциональную среду программирования (IDE) на PHP и PHP-редактор с поддержкой редактирования HTML, CSS и JavaScript. Пригоден как для начинающих, так и для опытных профессиональных разработчиков! Мощнейшая программа, работает с HTML. CSS. ASP. PHP. Включает TIDY и т.
однако интерфейс и прочее на английском языке.