编者注：本文最初发表于 2016 年 3 月，并已更新以反映最初推荐的几种工具的变化。
就在几年前，互联网上的几乎每个网页在某种程度上都是由手工精心设计的。这很困难，而且在 CSS 真正流行并在大多数常见浏览器中得到良好支持之前，通常需要通过以 HTML 表格的方式拼凑布局，而这些表格的设计初衷并不是为了支持这种用途。
虽然一些设计师开发了完全基于手动编辑原始 HTML 文件的工作流程，但 WYSIWYG（所见即所得）编辑器开始作为一种赋能工具出现，它赋能了数百万不了解或至少不精通超文本标记语言艺术的业余和专业设计师。
CoffeeCup、HotDog、FrontPage、GoLive 等产品充斥市场，许多基于 Web 的 WYSIWYG 编辑器也应运而生。其中最成功的是 Macromedia（后来的 Adobe）Dreamweaver，它多年来一直是我的个人最爱之一。
这些 Web 创作工具不仅仅是关于 WYSIWYG 编辑；即使对于那些熟悉直接创作标记语言的人来说，这些工具在模板控制、文件管理以及简单地减少创建功能代码所需的时间方面也提供了优势。
但正如这些有用的编辑器正在扩大网页创建的访问范围一样，其他事情也在发生。Drupal 和 WordPress 等内容管理系统（以及在此之前的许多其他系统）取代了普通内容生产者编辑原始 HTML 的需求。您可以轻松创建一个功能齐全的网站，甚至无需担心底层的标记。
那么内容管理系统的兴起改变了 Web 吗？当然。它消除了手动编写 HTML 的需求吗？嗯，对于某些人来说，是的。但是，随着 Web 从内容集合转变为应用程序平台，标记语言也出现了许多新的机会。每个软件即服务应用程序、每个社交媒体网络，甚至许多移动应用程序都依赖 HTML 和 CSS 来呈现其显示。那些内容管理系统呢？它们仍然需要模板才能运行。
尽管存在许多有用的库来标准化和简化 Web 开发过程，但 Web 编码在短期内不会被取代。专有工具仍然很常见，但那里有丰富的开源替代品。以下是一些您应该考虑的。
1. BlueGriffon
BlueGriffon 是一款开源 WYSIWYG 编辑器，由为 Mozilla Firefox 开发的渲染引擎 Gecko 提供支持。作为现已停止开发的 HTML 编辑器 NVU 的少数衍生产品之一，BlueGriffon 是唯一一款积极开发的 NVU 衍生产品，它支持 HTML5 以及现代 CSS 组件。如果您的目标是尽可能少地编写实际的 HTML，那么 BlueGriffon 是您想要的工具。它是一款真正的拖放式 WYSIWYG 网站设计器，甚至还包括双视图选项，因此您可以查看设计背后的代码，以防您想对其进行编辑或只是从中学习。
它还支持 EPUB 电子书格式，因此您不必仅仅发布到 Web：您可以为读者提供他们可以随身携带的内容下载。BlueGriffon 在 MPL、GPL 和 LGPL 许可下获得许可，提供适用于 Linux、Windows 和 Mac 的版本。
2. Aptana Studio
Aptana Studio 是一款“面向开放 Web 的开源开发工具”，实际上，它更像是一个专门从事 Web 开发的高级 IDE。Aptana Studio 基于开源 Eclipse 项目，具有辅助 HTML 和 CSS 创作的工具，包括代码着色和完成、调试以及文档大纲。其主要卖点是其 JavaScript 支持，使其成为开发更复杂的 Web 应用程序的强大工具。
3. NetBeans
NetBeans 是一个广泛使用的软件开发平台，用于使用 Java、JavaScript、HTML5 等构建 Web、移动和桌面应用程序。自 1999 年以来，它一直得到 Oracle（及其前身 Sun）的支持，并于 2016 年 10 月转移到 Apache 基金会进行开放治理，并简化和精简了社区贡献。Netbeans 并非完全是拖放式 Web 设计应用程序，但它是一个强大的 Web 感知 IDE。如果您正在开发 Web 应用程序，或者您只是喜欢为 Web 编码，那么它是一个不错的选择。
4. SeaMonkey
SeaMonkey 是曾经是 Mozilla 制作的互联网应用程序套件的社区延续。虽然 Mozilla 决定将其重点缩小到单个项目，但 SeaMonkey 继续定期发布其完整套件，其中包括 SeaMonkey Composer，一个简单的 WYSIWYG HTML 编辑器。您很难使用 Composer 进行高级布局（例如，您无法调整 CSS display 属性来创建两列文本和图像对，而必须使用非响应式表格），但对于基本页面，无需编写任何代码，这是一个可行的选择。
5. Aloha Editor
Aloha Editor 是一款基于 JavaScript 的 WYSIWYG HTML5 编辑器，它 允许 用户在读者查看内容的同一布局中编辑内容。这是一个非常独特的模型，因为它本身不是一个应用程序，而是将编辑器嵌入到您的 HTML 页面中。它需要 Node.js 堆栈，因此如果您不是熟悉 Javascript 的开发人员，则可能难以配置。但是，如果您是一位网站管理员，正在为您的用户寻找一个简单的编辑界面来快速更新他们的页面，那么您应该对 Aloha 说“你好”。
6. Wordpress
开源内容管理服务 (CMS) 和博客平台 Wordpress 具有结构化但灵活的页面布局界面。它允许您创建博客文章和页面，具有足够的灵活性让您的创造力蓬勃发展，并且具有足够的限制来确保您的作品在所有浏览器中正确呈现。使用 Wordpress，您可以在每个步骤选择所需的复杂程度。您可以使用他们的 著名的 5 分钟安装 方法自行托管它，或者您可以从 Wordpress.com 购买托管。您可以使用拖放式设计器创建页面，也可以自己修改 HTML 和 PHP。您可以选择贡献的主题，也可以设计和创建自己的主题。对于任何想要运行网站的人来说，它都是一个很好的资源。
7. 尝试高级文本编辑器
虽然不一定是初学者的最佳选择，但许多文本编辑器提供了额外的功能，这些功能对于编辑 HTML/CSS 文档的人来说非常有用。当与具有内置调试工具的现代浏览器并排使用时，您可能会像使用更专业的解决方案一样高效地使用其中一种编辑器。我们最喜欢的一些包括
- Atom 将自己描述为“21 世纪的可破解文本编辑器”。它由 GitHub 开发，开箱即用地支持 HTML 和 CSS，并提供许多额外的插件。
- Brackets 是由 Adobe 开发的基于 JavaScript 的文本编辑器，用于网页设计 和前端开发。它标榜其内联编辑器、实时预览和预处理器支持功能，使其更容易在浏览器中进行网页设计。
- Vim 或 Emacs。在不参与这两个传统文本编辑器之间的圣战的情况下，我可以安全地说，两者都有许多用于 Web 编辑的增强功能。因此，如果您已经是终端迷，请选择您喜欢的。或者，如果这些不能满足您的需求，请尝试这些 Emacs/Vim 替代品之一。
这些解决方案中有任何一个是 Dreamweaver 或其他专有工具的功能对等复制品吗？当然不是。它们的设计目的不是这样。它们都有自己的路线图和目标，以及自己的优势和劣势。Web 设计是一个广阔的世界，有许多应用程序和许多方法。花时间找到满足您需求的工作流程。试用新工具，看看您喜欢和不喜欢它的哪些方面，并在评论中与更广泛的社区分享您的反馈。
您是否有兴趣阅读更多类似的文章？注册我们的每周电子邮件新闻通讯。
51 条评论