2021 年的 5 大静态网站生成器 (以及何时使用)

2021 年的 5 大静态网站生成器 (以及何时使用)

2021 年的 5 大静态网站生成器 (以及何时使用)

许多网站页面是动态的。这意味着一个页面的内容可以在不同的会话中改变,这取决于加载它的人,他们是登录还是退出,以及其他一些因素。

如果你的网站不这样做,那么你处理的是静态页面。

静态网站没有任何动态内容。在很多情况下,这可以转化为更快的加载时间和更好的整体网站性能。了解动态站点和页面的优缺点将帮助你决定何时使用它们。

本文将介绍什么是静态站点生成器,以及何时应该使用它们。我们还将讨论静态网站的优点和缺点,并向你介绍 5 个可以使用的顶级生成器。

什么是静态网站生成器?

从技术上讲,你不需要使用 “生成器” 或任何内容管理系统 (CMS) 来创建静态页面。如果你知道如何使用 HTML 和 CSS,你可以使用你最喜欢的文本编辑器来创建一个页面:

文本编辑器中的 HTML 文档

或者,你可以依靠 web 框架,如 Bootstrap 访问高级 HTML, CSS 和 JavaScript 库,你可以使用创建静态和动态网站。

静态网站生成器提供了第三种更精简的选择。它们通常包括各种工具,可以方便地启动网站、设计风格、创建内容、发布内容,以及根据需要更新页面。

如果你不熟悉网站开发,那么你可能需要像静态网站生成器这样的工具来帮助实现你的愿景。

总的来说,最受欢迎的生成器提供了广泛的功能,使你的工作更容易,包括:

  • 对 Markdown 语言的支持:大多数生成器不包括成熟的文本编辑器。相反,它们使用 Markdown 语言,有时甚至包括额外的自定义 Markdown 语法。
  • 内置布局和模板选项:设计和设计一个网站通常是最具挑战性的建设过程。这就是生成器倾向于包含内置模板和布局选项的原因。
  • 支持多种类型的内容:根据你使用的生成器,它应该支持各种类型的内容,如博客文章、页面、图库等。
  • 内置搜索引擎优化功能:没有合适的搜索引擎优化 (SEO) 的现代网站是准备好的。如果你正在考虑 —— 或者已经在使用 —— 一个不提供搜索引擎优化功能或附加功能的生成器,你最好转向一个新的工具。

需要注意的是,大多数静态网站生成器都假设你已经具备基本的网站开发背景。有些选项对初学者比较友好,但它们仍然需要你熟悉命令行、Markdown 语言等概念。

为什么使用静态网站生成器 (优缺点)

你可能想知道,在有 WordPress 这样的工具可用的情况下,为什么还会有人使用复杂的静态站点生成器。

这一切都取决于具体情况的使用、个人偏好和性能。

在绝大多数情况下,静态网站的加载速度要比动态网站快得多。这是因为你的服务器需要处理的请求要少得多,而且不涉及数据库。每个访问者都将看到相同的页面,所有这些数据都包含在静态站点生成器输出的代码中。

一些开发人员也更喜欢处理静态站点生成器,而不是包含太多特性的复杂 cms。站点生成器倾向于精简,在某些情况下,它们是高度模块化的。这意味着需要处理的臃肿和需要掌握的功能更少,特别是如果你只对创建特定的页面感兴趣的话。

静态网站 vs 动态网站

当然,并不是所有的站点都应该是静态的。那么,你如何知道这种方法什么时候适合你的需求呢?

以下是一些不需要动态的网站的例子:

  • 个人博客
  • 文档页面
  • 登陆页面
  • 投资组合页面
  • 宣传册的网站

虽然静态网站的想法可能听起来有局限性,但你可以在不引入任何动态元素的情况下做很多事情。

然而,任何需要数据库的网站都是不可能的。这意味着你不能使用静态网站生成器来创建在线商店、带有评论部分的博客文章、带有用户注册的网站等等。

如果你不需要动态功能,使用静态网站生成器将会给你带来比大多数 CMS 开箱即用的更好的网站性能。

我们说 “开箱即用” 是因为你可以做很多事情来优化 CMS,比如 WordPress。根据我们的经验,优化良好的 WordPress 网站可以和静态网站一样快 (前提是你也有很棒的主机)。

如果你只是出于性能考虑而选择使用静态站点生成器,那么考虑一些 CMS 选项可能是值得的。

另一方面,如果你确信你的网站不需要动态功能,剩下的就是找到正确的工具。

5 个最好的静态网站生成器

在讨论特定的静态站点生成器之前,值得一提的是,所有这些工具都是自托管的。要使用它们,你需要找到一个可以为你设置它们或允许你访问命令行的主机提供商。

考虑到这一点,让我们来看看我们在 2021 年挑选的一些最佳静态网站生成器。

1. Jekyll

Jekyll 是最受欢迎的开源静态网站生成器之一,这是有原因的。GitHub Pages 为静态网站提供免费托管服务。

从本质上讲,Jekyll 是一个博客友好型生成器。这个静态软件支持 Markdown,附带一个全面的分类系统,并支持 Liquid 模板语言。

一些最流行的使用 Jekyll 的网站包括 Ruby on Rails、Sketch 和面向开发者的 Spotify。

如果你正在寻找一个免费的静态网站,Jekyll 和 Github Pages 可能是一个很好的组合。

2. Hugo

Hugo 是一个开源的静态网站生成器,自称是一个 “通用” 框架。这是一种优雅的说法,说明你可以使用 Hugo 建立广泛的网站,远远超出简单的博客和小册子页面。

使用 Hugo,你可以以惊人的速度生成页面,构建时间通常不到一秒钟。当你使用 LiveReload 制作页面时,该软件允许你预览页面的更改,并且它提供了强大的主题功能。

Hugo 使用模块化系统来帮助你建立静态网站。你有几个模块可供选择,包括内容、布局和数据。

一些使用 Jekyll 的流行网站包括 1Password 的文档页面、Linode 的文档部分和 KeyCDN。

使用 Hugo,你可以在任何页面上组合多个模块,以获得你需要的确切功能。

3. Gridsome

Gridsome 是一个强大的静态站点生成器。你可以使用 Vue.js 和 GraphQL 等现代工具来创建页面。

你还可以使用 Gridsome 来设置 CMS 的 “头部”。例如,你可以使用 Gridsome 来生成静态页面,使用从 WordPress 提取的数据,这是一个 “无头” CMS 设置。

无头设置的好处是,你可以获得使用静态页面的所有最佳部分,同时还可以利用 CMS 的全部功能。换句话说,你可以访问数据库、高级分类法,甚至全面的文本编辑器。

值得注意的是,Gridsome 提供了广泛的插件集合,你可以使用这些插件扩展生成器的功能。如果框架没有提供开箱即用的特性,那么很有可能有一个插件可以提供。

Gridsome 仍然是一个相对较新的静态网站生成器。然而,已经使用这种软件的两个很好的例子是亚特兰大智慧城市博览会和 Format。

可以想象,Gridsome 不像这个列表中的其他工具那样适合初学者使用。你将需要一些 web 开发经验,以最大限度地利用该软件。

如果你已经知道使用 Vue.js 的方法,Gridsome 是你可以使用的最好的静态站点生成器之一。

4. Eleventy

Eleventy 是静态网站生成器领域的一个相对新人。这个软件依赖于 JavaScript 和 Node.js。这意味着你需要对 JavaScript 语言有一定程度的熟悉,才能有效地使用它。

如果你习惯使用 JavaScript,那么 Eleventy 将为你提供静态站点生成器中最好的性能。

这个工具支持多种模板语言,但在其核心,Eleventy 依赖于 Liquid,这使得它在这方面与 Jekyll 相似。除了 Liquid, Eleventy 还可以解析静态页面的其他几种语言,包括 Markdown 和 JavaScript。

更重要的是,随着 Chrome 开发者和 Netlify 等网站使用 eleven,它变得越来越受欢迎。

根据我们的经验,开始使用 eleven 可能有点困难,因为它的文档仍在编写中。然而,如果你正在寻找一个精简的静态站点生成器,那么这些努力是值得的。

5. Pelican

Pelican 是一个鲜为人知的关于 Python 的静态网站生成器。如果你熟悉 Python,可以使用该软件使用 Markdown 和 reStructuredText 创建静态页面。

这个软件带有一组你可以自定义的主题,它包括多语言支持。此外,Pelican 还可以从 WordPress、RSS 源和其他第三方来源导入数据,这使它成为无头设置的绝佳选择。

Pelican 提供了一组健壮的插件,你可以设置这些插件来扩展生成器的功能。总的来说,它是我们列表中最简洁的静态站点生成器之一,但如果你已经知道或想学习 Python,那么它是一个极好的选择。

选择静态网站生成器时要考虑什么

静态站点生成器的选择主要取决于三个因素。让我们来分析一下它们是什么:

  • 生成器使用哪种语言:一些静态站点生成器严重依赖 JavaScript 和其他库。根据你使用的生成器的不同,你可能需要熟悉它的编程语言。
  • 易用性:如果你是一个有经验的 web 开发人员,你应该能够相对轻松地使用任何静态网站生成器。然而,如果你正在从事你的第一个项目,你会想要选择一个初学者友好的生成器。
  • 它支持的内容类型:大多数流行的静态网站生成器将使你能够创建各种类型的页面。然而,另一些则专注于特定类型的内容,如博客文章。
  • 现有的软件社区:总的来说,我们建议你使用具有良好用户社区的工具。这样,你将更容易地解决问题和获得问题的答案。

我们在这里看到的大多数静态网站生成器都要求你至少对 web 开发的基本原理有所了解。如果这听起来太多了,那么最好使用用户友好的 CMS,比如 WordPress。

托管的 WordPress 网站可以和静态网站一样快。另外,CMS 使用起来很简单 (即使你正在进行第一个项目)。