Аналоговый Dreamweaver для Linux

Обновлено: 03.07.2024

Adobe Dreamweaver — это популярный инструмент для профессионалов для разработки веб-сайтов. Несмотря на то, что в последнее десятилетие он наслаждался всей своей славой, он больше не является самым популярным инструментом (по крайней мере, насколько мне известно).

Его дорогие планы подписки и наличие бесплатных альтернатив с открытым исходным кодом повлияли на его популярность.

Более того, с ростом популярности CMS с открытым исходным кодом и конструкторов веб-сайтов с перетаскиванием создать веб-сайт стало намного проще, чем в предыдущем десятилетии.

Если вы не профессионал с определенным набором требований, нет причин использовать Dreamweaver. Итак, в этой статье я собираюсь перечислить некоторые из лучших бесплатных альтернатив Dreamweaver с открытым исходным кодом, которые позволяют редактировать HTML/CSS.

Редакторы HTML и CSS с открытым исходным кодом для веб-разработчиков

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

Я использовал этот шаблон веб-сайта для тестирования HTML-редакторов. Этот список не имеет определенного порядка ранжирования.

1. Редактор Bluefish

Основные моменты:

  • Автозаполнение
  • Предварительный просмотр в браузере
  • Параметры загрузки/скачивания с сайта
  • Свертывание блоков кода
  • Поддержка нескольких языков программирования
  • Поддерживает файлы определения языка WordPress
  • Кроссплатформенная поддержка

Bluefish – это многофункциональный редактор, который идеально подходит как для начинающих, так и для опытных веб-дизайнеров.

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

Попробуйте, чтобы узнать больше об этом.

Как его установить?

Вы можете найти его в своем центре программного обеспечения. Если вы этого не сделаете, вы можете следовать официальным инструкциям по установке, чтобы добавить репозиторий и установить его в свой дистрибутив Linux.

Кроме того, доступен пакет Flatpak, если вы предпочитаете его использовать. Я бы посоветовал вам обратиться к нашему руководству по Flatpak, если вы не знаете об этом.

2. Синий Грифон

Основные моменты:

  • WYSIWYG-редактор
  • Черно-светлая тема
  • Поддержка адаптивного дизайна
  • Поддержка EPUB 3.1
  • Кроссплатформенная поддержка

BlueGriffon — впечатляющий HTML/CSS-редактор WYSIWYG. Вы можете отредактировать коды и проверить дизайн или просто отредактировать его визуально, не возясь с кодами.

Это особенно полезно для тех, кто не знаком с HTML/CSS и только начинает. Он упрощает редактирование и предлагает все необходимые функции для веб-дизайнера.

Как его установить?

Вы можете загрузить пакет deb с официального веб-сайта или выбрать другие установщики и исходный код в зависимости от используемого вами дистрибутива Linux.

Возможно, вы захотите прочитать о различных способах установки файла DEB, если вы используете дистрибутив на базе Ubuntu.

3. Морская Обезьяна

Основные моменты:

  • Редактор WYSIWYG
  • Отдельный браузер
  • Редактирование HTML
  • Кроссплатформенная поддержка

SeaMonkey — это не обычный редактор кода, а набор интернет-приложений, таких как браузер, электронная почта, IRC-чат и HTML-редактор.

Он поддерживает редактирование исходного кода веб-страницы и возможность визуального редактирования без знания HTML.

Вы можете узнать больше об этом, когда установите его.

Как его установить?

Вы можете просто загрузить пакет для Linux, доступный на их официальном сайте, и запустить исполняемый файл приложения SeaMonkey, чтобы начать работу.

4. Скобки

Основные моменты:

  • Предварительный просмотр в реальном времени
  • Разработано специально для веб-дизайна.
  • Автозаполнение
  • Кроссплатформенный

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

Удивительно, но это проект Adobe с открытым исходным кодом, который не очень активно поддерживается, но он есть.

Как его установить?

Для Ubuntu 19.10 или более ранней версии вы можете просто загрузить файл deb с официального веб-сайта. Для Ubuntu 20.04 или любого другого дистрибутива Linux лучше использовать пакет Flatpak или Snap.

Вы также можете изучить их раздел выпусков на GitHub, чтобы найти другие файлы для загрузки.

5. NetBeans

Основные моменты:

Технически NetBean не является готовым редактором HTML-CSS. Но вы можете использовать его как редактор HTML при создании приложения HTML5.

Это не лучшее решение для редактирования HTML, но это вариант для определенной группы программистов. Вы можете попробовать его, чтобы увидеть, делает ли он то, что вы от него ожидаете.

Как его установить?

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

Каким редактором HTML вы пользуетесь?

Есть еще несколько редакторов, которые можно использовать для редактирования HTML и CSS. Некоторые веб-разработчики предпочитают Aloha Editor Community Edition.

Вы, безусловно, можете использовать другие современные редакторы кода, такие как Atom и VS Code, или старый добрый текстовый редактор Geany для редактирования файлов HTML и CSS.

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

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

Вот список лучших приложений, которые могут заменить Dreamweaver. Список содержит как открытое (бесплатное), так и коммерческое (платное) программное обеспечение.

Лучшие альтернативы Adobe Dreamweaver (бесплатные/платные)

< /tr>
Имя Поддерживаемые платформы HTML5 и CSS3 PHP Ссылка
Visual Studio Mac, Windows, Linux Да Да Подробнее
Coffeecup Windows и macOS. Да Да Подробнее
WebStorm Windows, macOS, Linux. Да Да Подробнее

1) Visual Studio

Visual Studio Code — это редактор кода с открытым исходным кодом, разработанный Microsoft. Он обеспечивает встроенную поддержку TypeScript, JavaScript и Node.js. Эта альтернатива Dreamweaver предоставляет функции автозаполнения с IntelliSense, которые предлагают интеллектуальное завершение на основе основных модулей, типов переменных и определений функций.


Возможности:

  • Простая работа с Git и другими средствами SCM (управление конфигурацией программного обеспечения).
  • Поддерживает рефакторинг и отладку кода.
  • Эта бесплатная альтернатива Dreamweaver упрощает отладку и диагностику.
  • Это позволяет часто тестировать и уверенно выпускать сборки.
  • Предлагает расширенные и настраиваемые функции по вашему вкусу.
  • Позволяет эффективно сотрудничать.
  • Поддерживаемые платформы: Mac, Windows, Linux.
  • Цена: бесплатная пробная версия.

2) Кофейная чашка

Coffeecup – это альтернатива Dreamweaver, которая позволяет использовать режим предварительного просмотра с разделением экрана для просмотра веб-страницы. Это один из лучших инструментов HTML-редактора WYSIWYG, который позволяет открывать службу проверки разметки W3C в веб-браузере по умолчанию.


Возможности:

  • Это поможет вам использовать предварительный просмотр вашей веб-страницы на разделенном экране.
  • Он предлагает установщик шаблонов, который импортирует проекты в редактор HTML всего двумя щелчками мыши.
  • Предлагает встроенный инструмент проверки HTML, который открывает службу проверки разметки W3C.
  • Он имеет встроенную загрузку по FTP, что упрощает публикацию веб-сайта.
  • Позволяет просматривать веб-страницу в браузере прямо из редактора визуального кода.
  • Поддерживаемые платформы: Windows и macOS.
  • Цена: бесплатно.

3) Веб-шторм

WebStorm — это альтернатива Dreamweaver, позволяющая легко отлаживать клиентские приложения. Эта бесплатная альтернатива Dreamweaver помогает интегрировать приложения с VCS (Veritas Cluster Server).


Возможности:

  • Вы можете легко протестировать свой код, используя такие инструменты, как Mocha, Karma test runner, Jest и другие.
  • Предлагает широкий выбор подключаемых модулей и шаблонов.
  • Он быстро откатывается к предыдущим версиям или обновляется до следующей версии.
  • Стиль кодирования, шрифты, темы и ярлыки можно настраивать.
  • Он предлагает встроенный терминал.
  • Поддерживаемые платформы: Windows, macOS, Linux.

4) Атом

Atom — сильный конкурент Dreamweaver. Его предпочитают из-за его простого интерфейса по сравнению с другими редакторами. Atom позволяет отправлять пакеты программного обеспечения.


Возможности:

  • Разрешает интеллектуальное автозаполнение.
  • Запись и воспроизведение макросов.
  • Это один из лучших HTML-редакторов со встроенным диспетчером пакетов.
  • Он предоставляет палитру команд, содержащую элементы, которые используются повторно.
  • Он позволяет выполнять поиск, предварительный просмотр и замену текста, введенного в файл, во всем проекте.
  • Поддерживаемые платформы: macOS X, Windows или Linux.

5) Netbeans

NetBeans – это инструмент для редактирования кода с открытым исходным кодом для написания кода на Java, PHP, C++ и других языках программирования. Он также предлагает функции анализа и преобразования кода.


Возможности:

  • Простое и эффективное управление проектами.
  • Эта бесплатная альтернатива Dreamweaver предлагает быстрое и интеллектуальное редактирование кода.
  • Он предлагает быстрый пользовательский интерфейс для простой веб-разработки.
  • Этот инструмент без HTML-редактора WYSIWYG поможет вам писать код без ошибок.
  • Поддерживаемые платформы: Windows, Linux, Mac OSX.

6) Сосна

Pinegrow – это веб-редактор для Mac, Windows и Linux, который позволяет создавать адаптивные веб-сайты. Он предлагает многостраничное редактирование в реальном времени, редактор CSS Grid, поддержку Bootstrap, Foundation и WordPress.


Возможности:

  • Позволяет открывать и редактировать существующие проекты.
  • Вы можете использовать другие инструменты веб-разработки Pinegrow.
  • Позволяет создавать потрясающие взаимодействия и анимацию для веб-проектов.
  • Позволяет создавать веб-сайты в автономном режиме, без подключения к Интернету.
  • С его помощью вы можете создать столько веб-сайтов, сколько захотите.
  • Поддерживаемые платформы: Windows, macOS и Linux.

7) Голубой грифон

BlueGriffon — это веб-редактор с открытым исходным кодом, основанный на Gecko, механизме рендеринга Firefox. Эта альтернатива Dreamweaver предлагает простой интерфейс и хорошие функции, необходимые для создания веб-страниц.


Возможности:

  • Простые операции по изменению цвета шрифта или настройке стиля границы.
  • Вы можете легко открывать вкладки из последнего сеанса.
  • Разрешает использовать быстрые клавиши для редактирования CSS.
  • Несколько тем для просмотра исходного кода.
  • Поддерживаемые платформы: Mac, Windows, Linux.

8) Луфарь

Bluefish – это веб-редактор, который может обрабатывать десятки файлов одновременно. Это программное обеспечение предлагает веб-разработчикам множество возможностей для написания веб-сайтов, сценариев и программного кода.


Возможности:

  • Это одна из лучших IDE для Mac, которая загружает сотни файлов за считанные секунды.
  • Автоматическое восстановление изменений в измененных документах после сбоя, уничтожения или завершения работы.
  • Функция поддержки проектов помогает вам эффективно работать над несколькими проектами.
  • Неограниченное количество функций отмены и повтора загрузки.
  • Bluefish поддерживает настраиваемые языки программирования.
  • Вы можете интегрировать множество внешних программ.
  • Поддерживаемые платформы: Mac, Windows, Linux.

9) Морская обезьяна

SeaMonkey — это мощная альтернатива Dreamweaver, которая помогает пользователям входить в систему через Facebook, eBay или почтовые аккаунты без предупреждения.


Возможности:

  • SeaMonkey совместим с некоторыми сторонними расширениями браузера.
  • Он имеет почтовый клиент, встроенный чат и веб-редактор.
  • Поддерживаемые платформы: Windows, macOS, Linux.

10) Викс

Wix — это простое в использовании программное обеспечение для создания веб-сайтов с помощью функции перетаскивания. Эта бесплатная альтернатива Dreamweaver позволяет перетаскивать элементы в любое место на любой странице. Эта альтернатива Dreamweaver позволяет вам создать личный блог для разработки веб-сайта-портфолио или даже интернет-магазина.


Возможности:

  • Этот инструмент предлагает более 500 тем и шаблонов.
  • Помогает оптимизировать для мобильного использования.
  • Wix предоставляет защищенную корзину покупок.
  • Предлагает функцию отправки и управления счетами в интернет-магазине.
  • Поддерживаемые платформы. Mac и Windows.

11) Макроматы

TextMate от Macromate — это альтернатива Dreamweaver с уникальными и инновационными функциями.Этот инструмент предлагает поддержку многих языков программирования для написания блогов, сценариев и т. д.


Возможности:

  • Предлагает автоматический отступ для обычных действий.
  • Предоставляет CSS-подобные селекторы для определения объема действий и настроек.
  • Эта бесплатная альтернатива Dreamweaver для Mac предлагает динамическую схему для работы с несколькими файлами.
  • Краткий обзор и навигация.
  • Предлагает запуск команд оболочки в документе.
  • Поддерживаемые платформы: macOS.

❓ Dreamweaver устарел?

Dreamweaver не актуален в современном веб-дизайне. Код веб-сайтов (HTML, CSS, JavaScript) очень хорошо структурирован. Это более мощно, чем вы можете легко разработать отличный веб-сайт без кода или с относительно меньшим кодированием.

🏅 Каковы лучшие альтернативы Adobe Dreamweaver?

  • Visual Studio
  • Чашка кофе
  • Веб-шторм
  • Атом
  • NetBeans

⚡ Есть ли бесплатная версия Dreamweaver?

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

🚀 Какие функции Dreamweaver важны?

Вот некоторые важные функции Dreamweaver:

  • Динамические веб-сайты можно быстро разрабатывать с помощью Dreamweaver.
  • Он предоставляет готовые макеты для создания веб-сайта.
  • Вы можете создать веб-сайт, который подходит для экрана любого размера.
  • Этот инструмент поможет вам настроить рабочее пространство так, как вам нравится.
  • Он имеет встроенный валидатор HTML для проверки вашего кода.

❗ Можно ли использовать Dreamweaver без написания кода?

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

👉 Является ли Dreamweaver WYSIWYG-редактором?

Нет, это не так. Dreamweaver — это редактор кода с несколькими функциями WYSIWYG.

⚡ В чем разница между HTML и Dreamweaver?

Dreamweaver — это программное обеспечение, а HTML/CSS — это языки. HTML — это основной скелет веб-страницы. CSS можно рассматривать как «дизайнера интерьера» этой скелетной структуры. Dreamweaver – это редактор WYSIWYG, который можно использовать для кодирования HTML и CSS.

💻 Что такое программное обеспечение для разработки веб-сайтов?

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

Есть ли какой-либо альтернативный инструмент IDE, такой как Adobe Dreamweaver, в Linux для веб-разработки?

_Frank0

Защитите свои конечные точки от киберпреступников

2022-03-24 14:00:00 UTC Веб-семинар Веб-семинар: Cisco — защитите свои конечные точки от кибер-преступников Подробности о событии Просмотреть все события

Оливер Кинн

Этот человек является проверенным специалистом

Оливер Кинн

Вопрос в том, что вам нравится в Dreamweaver? Для чего вы его используете?

Если нужно просто отредактировать исходный код, Notepad++ отлично подойдет. Если вы хотите иметь дело со всеми своими файлами в одном месте, посмотрите на Git. Если вам нужен доступ по SFTP, рассмотрите возможность использования пар открытого и закрытого ключей.

42 ответа

Я рекомендую Adobe Dreamweaver CS5.5, да, для Linux.

Отличная штука в linux под названием wine, я делал это раньше, на самом деле работает очень хорошо.

С.Ли

Этот человек является проверенным специалистом

С.Ли

Почему бы не использовать блокнот++?

Оливер Кинн

Этот человек является проверенным специалистом

Оливер Кинн

Вопрос в том, что вам нравится в Dreamweaver? Для чего вы его используете?

Если нужно просто отредактировать исходный код, Notepad++ отлично подойдет. Если вы хотите иметь дело со всеми своими файлами в одном месте, посмотрите на Git. Если вам нужен доступ по SFTP, рассмотрите возможность использования пар открытого и закрытого ключей.

Bud G .

Этот человек является проверенным специалистом

Бад Г.

Возможны варианты Quanta Plus, Aptana, OpenBEXI, Bluefish, Amaya, Kompozer и BlueGriffon.

f1sz

donges

Этот человек является проверенным специалистом

донги

Раньше я ЛЮБИЛ Quanta Plus, но теперь он заброшен.

Поэтому я протестировал несколько из них и в конце концов остановился на NetBeans. Он не такой замечательный, как Quanta Plus, но я к нему привык, и мне он хорошо помогает.

Bud G .

Этот человек является проверенным специалистом

Бад Г.

Черт, я совсем забыл о Netbeans! Netbeans отличный. Я использовал это, когда мне нужно было взять Java. Облегчил жизнь.

Чак Джоррит

Этот человек является проверенным специалистом

Чак Джоррит

Привет, да, я использую Jetbrains. Не уверен, что он доступен для Linux, но я думаю, что это отличный инструмент IDE.

ZZaffis

Этот человек является проверенным специалистом

ZZaffis

Чтобы повторить то, что было задано. Зачем вам это нужно?

Dream Weaver можно смоделировать с помощью блокнота++ или любого комплекта разработчика в Linux. Вы можете написать это в gedit для всех целей и задач.

tyler. бума

donges

Этот человек является проверенным специалистом

донги

Отлично подходит для быстрого удаленного исправления страниц.

endtimesoldier

Этот человек является проверенным специалистом

солдат последнего времени

Студия Aptana великолепна!Он имеет предварительный просмотр HTML, отладку PHP / Javascript и загрузку по FTP

_Frank0

Я искал его, но, как вы сказали, забросить ПО, я попробую с блокнотом++
спасибо за рекомендацию.

КрисЛесли

Dannon Project — поставщик ИТ-услуг.

Google Chrome или Firefox для веб-разработки, а не Adobe Dreamweaver.

WingCreative

Мне нравится Atom от GitHub как альтернатива классическому Notepad++. Я использовал только версию для Windows, но есть версии для Red Hat и Ubuntu, которые, возможно, стоит изучить, и вы можете делать интересные вещи с пакетами, например запускать сервер разработки в текстовом редакторе.

_Frank0

  • отметить 87 лучших ответов
  • thumb_up – 178 благодарных отзывов

Боб3754

Этот человек является проверенным специалистом

Боб3754

Проверьте NVU. Работает на ПК, Mac и Linux. Я не думаю, что он находится в разработке, но последний релиз работает очень хорошо. Это WYSWYG, и это бесплатно.

КрисЛесли

Dannon Project — поставщик ИТ-услуг.

Не знаю, почему люди избегают браузера. Использование Chrome или Firefox дает вам все возможные современные инструменты веб-разработки, которые могут вам понадобиться. для бесплатной и межсистемной жалобы.

Все инструменты, которые только могут понадобиться в Chrome

Я не пользовался Dreamweaver или подобными ему инструментами более 10 лет (Front Page тоже, лол). Ручное кодирование с минимальной поддержкой текста/кода (не Adobe) захватило веб-пространство. Черт, вы даже можете сделать это онлайн, если вам действительно нужна онлайн-среда IDE снова бесплатно.

КрисЛесли

Dannon Project — поставщик ИТ-услуг.

Да, но зачем беспокоиться, Dreamweaver так и не сделал того, что обещал, — кода жалобы.

102020 написал:

Я рекомендую Adobe Dreamweaver CS5.5, да, для Linux.

Отличная штука в Linux под названием Wine, я делал это раньше, на самом деле работает очень хорошо.

Wine + Dreamweaver

КрисЛесли

Dannon Project — поставщик ИТ-услуг.

Люди, использующие Dreamweaver, застряли в конце 90-х и начале 2000 годов. Ручное кодирование с помощью средства просмотра WYSIWYG по-прежнему актуально, но только не с Dreamweaver. Затем вы скажете мне, что кодирование Cold Fusion по-прежнему необходимо (хлопок ладонью)

Да, но зачем беспокоиться, Dreamweaver так и не сделал того, что обещал, — кода жалобы.

102020 написал:

Я рекомендую Adobe Dreamweaver CS5.5, да, для Linux.

Отличная штука в Linux под названием Wine, я делал это раньше, на самом деле работает очень хорошо.

Wine + Dreamweaver

редактор wysiwyg, хе-хе-хе, это заставило меня улыбнуться. Когда вы программируете так долго, как я, вам больше не нужно даже смотреть на то, что вы делаете. На моем компьютере с Linux я использую Bluefish. Мой Mac, конечно же, я использую Dreamweaver, так как он является частью CS Suite. Единственная полезная часть dreamweaver — это применение исходного форматирования для меня.

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

КрисЛесли

Dannon Project — поставщик ИТ-услуг.

Когда я использовал DW, я возненавидел его примерно через год. Не производит чистый код. Конечно, они исправили его на несколько исправлений позже, чем когда я начал заниматься веб-разработкой, но яблоко не падает далеко от дерева, когда мы думаем об Adobe.

Лично я был бы агностиком, если бы мне больше приходилось вручную кодировать веб-сайт. Я бы предпочел сделать веб-IDE и поддерживать ее в рабочем состоянии. Ничего не нужно устанавливать, и код доступен команде. Ситуация Win-Win :0)

Ищете альтернативу Dreamweaver с открытым исходным кодом или другому проприетарному редактору HTML/CSS? Давайте рассмотрим некоторые из ваших вариантов.

Секретный ингредиент в открытом исходном коде

Примечание редактора. Эта статья была первоначально опубликована в марте 2016 года и обновлена ​​с учетом изменений в некоторых изначально рекомендованных инструментах.

Не так уж и много лет назад практически каждая веб-страница в Интернете на том или ином уровне тщательно создавалась вручную. Это было сложно, и до того, как CSS действительно закрепился и стал хорошо поддерживаться в большинстве распространенных браузеров, он часто включал в себя взлом макета с использованием HTML-таблиц таким образом, который они никогда не предполагали для поддержки.

Больше отличного контента

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

На рынке появились такие продукты, как CoffeeCup, HotDog, FrontPage, GoLive и многие другие, а также появилось множество веб-редакторов WYSIWYG. Среди наиболее успешных была Macromedia (позже Adobe) Dreamweaver, которая много лет была в числе моих любимых.

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

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

Итак, появление системы управления контентом изменило Интернет? Абсолютно. Избавило ли это от необходимости передавать код HTML? Ну, для некоторых людей, да. Но по мере того, как сеть перешла от сбора контента к платформе для приложений, появилось много новых возможностей для разметки. Каждое программное обеспечение как сервисное приложение, каждая социальная сеть и даже многие мобильные приложения полагаются на HTML и CSS для визуализации своего отображения. И эти системы управления контентом? Им по-прежнему нужны шаблоны для работы.

И хотя существует множество полезных библиотек для стандартизации и упрощения процесса веб-разработки, кодирование для Интернета не будет вытеснено в ближайшее время. Проприетарные инструменты по-прежнему распространены, но существует богатая коллекция альтернатив с открытым исходным кодом. Вот некоторые из них, которые вы должны рассмотреть.

1. Синий Грифон

BlueGriffon — это WYSIWYG-редактор с открытым исходным кодом, основанный на Gecko, механизме визуализации, разработанном для Mozilla Firefox. BlueGriffon — одна из немногих производных NVU, HTML-редактора, производство которого сейчас прекращено. Это единственная активно разрабатываемая производная NVU, поддерживающая HTML5, а также современные компоненты CSS. Если ваша цель — писать как можно меньше фактического HTML, то BlueGriffon — это инструмент, который вам нужен. Это настоящий конструктор веб-сайтов WYSIWYG с функцией перетаскивания, который даже включает опцию двойного просмотра, чтобы вы могли видеть код, стоящий за вашим дизайном, на случай, если вы захотите отредактировать его или просто изучить его.

Он также поддерживает формат электронных книг EPUB, поэтому вам не нужно просто публиковать их в Интернете: вы можете предоставить своим читателям загрузку вашего контента, который они смогут взять с собой. Под лицензией MPL, GPL и LGPL доступна версия BlueGriffon для Linux, Windows и Mac.

2. Студия Аптана

Aptana Studio – это "инструмент разработки с открытым исходным кодом для открытого Интернета", что на практике означает скорее продвинутую интегрированную среду разработки, специализирующуюся на веб-разработке. Основанный на проекте Eclipse с открытым исходным кодом, Aptana Studio предлагает инструменты для помощи в разработке HTML и CSS, включая раскрашивание и завершение кода, отладку и наброски документов. Его главным преимуществом является поддержка JavaScript, что делает его мощным инструментом для разработки более сложных веб-приложений.

3. NetBeans

NetBeans — это широко используемая платформа разработки программного обеспечения для создания веб-приложений, мобильных и настольных приложений с использованием Java, JavaScript, HTML5 и т. д. Он поддерживается Oracle (и его предшественником, Sun) с 1999 года, а в октябре 2016 года перешел в Apache Foundation для открытого управления, а также упрощенного и оптимизированного вклада сообщества. Netbeans — это не совсем приложение для веб-дизайна с функцией перетаскивания, но это надежная интегрированная среда разработки с поддержкой веб-приложений. Это отличный выбор, если вы разрабатываете веб-приложения или просто любите программировать для Интернета.

4. Морская Обезьяна

SeaMonkey — это продолжение сообщества того, что когда-то было пакетом интернет-приложений, созданным Mozilla. В то время как Mozilla решила сосредоточить свое внимание на отдельных проектах, SeaMonkey продолжает выпускать регулярные выпуски своего полного пакета, который включает в себя SeaMonkey Composer, простой HTML-редактор WYSIWYG. Вам будет сложно создавать расширенные макеты с помощью Composer (например, вы не можете настроить отображение или свойство CSS для создания пары текста и изображения из двух столбцов, вместо этого вам придется использовать неадаптивную таблицу), но для базовых страниц с нулевым кодом, это реалистичный вариант.

5. Алоха Редактор

Aloha Editor – это HTML5-редактор WYSIWYG на основе JavaScript, который позволяет пользователям редактировать контент в том же макете, в котором его просматривают читатели. Это довольно уникальная модель, так как это не совсем приложение, а встроенный редактор в вашу HTML-страницу. Для этого требуется стек Node.js, поэтому, если вы не являетесь разработчиком, знакомым с Javascript, настроить его может быть сложно. Однако, если вы являетесь администратором сайта и ищете простой интерфейс редактирования, чтобы ваши пользователи могли быстро обновлять свои страницы, вам следует сказать "алоха" Алохе.

6. Вордпресс

7. Попробуйте расширенный текстовый редактор

Хотя некоторые текстовые редакторы не обязательно подходят для начинающих, они предоставляют дополнительные функции, невероятно полезные для тех, кто редактирует документы HTML/CSS. При использовании бок о бок с современным браузером со встроенными инструментами отладки вы можете быть столь же продуктивны с одним из них, как и с более специализированным решением. Вот некоторые из наших любимых:

    описывает себя как «взламываемый текстовый редактор 21 века». Разработанный GitHub, он имеет встроенную поддержку HTML и CSS и множество доступных дополнительных плагинов. — это текстовый редактор на основе JavaScript, разработанный Adobe для веб-дизайна и разработки внешнего интерфейса. Он рекламирует свой встроенный редактор, предварительный просмотр в реальном времени и функции поддержки препроцессора, упрощающие веб-дизайн в браузере. или Эмакс. Не участвуя в священной войне между этими двумя традиционными текстовыми редакторами, я могу с уверенностью сказать, что для обоих доступен ряд улучшений для веб-редактирования. Так что, если вы уже терминальный наркоман, сделайте свой выбор. Или, если они вас не удовлетворяют, попробуйте одну из этих альтернатив Emacs/Vim.

Являются ли какие-либо из этих решений покомпонентным воспроизведением Dreamweaver или другого проприетарного инструмента? Конечно, нет. Они не были созданы для этого. У каждого из них была своя дорожная карта и цели, а также свои сильные и слабые стороны. Веб-дизайн — это большой мир с множеством приложений и подходов. Потратьте время, чтобы найти рабочий процесс, который соответствует вашим потребностям. Попробуйте новый инструмент, посмотрите, что вам в нем нравится и не нравится, и поделитесь своим мнением с более широким сообществом в комментариях.

Хотите ли вы читать другие подобные статьи? Подпишитесь на нашу еженедельную рассылку по электронной почте.

Читайте также: