Hexo建站日志(1) - 认识 Static Site Generator

网页格式:静态网页与动态网页

进行网页设计(Web Design),需要确定网页格式。

静态网页

静态网站(Static Website)是指全部由HTML代码格式页面组成的网站,所有的内容包含在网页文件中。网页上也可以出现各种视觉动态效果,如GIF动画、FLASH动画、滚动字幕等,而网站主要是静态化的页面和代码组成,一般文件名均以htm、html、shtml等为后缀。

静态网页(Static Webpage)是指纯粹HTML格式的网页。

特点:

  • 每个静态网页都有一个固定的网址,文件名均以htm、html、shtml等为后缀,而不含“?”;
  • 静态网页一经发布到服务器上,无论是否被访问,都是一个独立存在的文件;
  • 静态网页的内容相对稳定,不含特殊代码,因此容易被搜索引擎检索;html更加适合SEO搜索引擎优化。
  • 由于不需通过数据库工作,所以静态网页的访问速度比较快;
  • 静态网站没有数据库的支持,在网站制作和维护方面工作量较大;
  • 静态网页的交互性较差,在功能方面有较大的限制

动态网页

动态网站(Dynamic Website)是指网站内容可根据不同情况动态变更的网站。一般情况下动态网站通过数据库进行架构。

动态网页(Dynamic/Active Webpage)一个对所有动态生成与动态更新的网页的统称。与传统的静态网页相反,它会因为变量的改变而产生不同的网页。这既可能是服务器端生成的网页,也可能是用户端生成的网页,或是两者的混合。

A Server-side Dynamic Webpage is a web page whose construction is controlled by an application server processing server-side scripts. In server-side scripting, parameters determine how the assembly of every new web page proceeds, including the setting up of more client-side processing.


A Client-side Dynamic Webpage processes the web page using HTML scripting running in the browser as it loads.

值得注意的是,动态网页与视觉上的动态效果无关。动态网页既可以是纯文字内容的,也可以是包含各种动画的内容,这些只是网页具体内容的表现形式。无论网页是否具有动态效果,只要是采用了动态网站技术生成的网页都可以称为动态网页。

特点:

  • 动态网页一般以数据库技术为基础,可以大大降低网站维护的工作量;
  • 采用动态网页技术的网站可以实现交互功能,如用户注册、用户登录、在线调查、用户管理、订单管理等等;
  • 动态网页实际上并不是独立存在于服务器上的网页文件,只有当用户请求时服务器才返回一个完整的网页;
  • 动态网页由于需要数据库处理,所以动态网站的访问速度大大减慢;
  • 动态网页由于存在特殊代码,所以相比较静态网页,其对搜索引擎的友好程度相对要弱一些

开发语言:

  • ASP - Active Server Pages(活跃服务器页)
  • ASP.NET
  • PHP - Hypertext Preprocessor(超文本预处理器)
  • JSP - Java Server Pages(Java服务器页面)

静态网页与动态网页的区别

1.开发语言:

  • 静态网页:超文本标记语言(HTML,标准通用标记语言的一个应用)
  • 动态网页:以超文本标记语言为基础,结合上述脚本语言来编写

2.是否在服务器端运行

  • 静态网页:程序、网页、插件、组件运行于客户端,例如 html 页、Flash、JavaScript、VBScript等等,它们是永远不变的
  • 动态网页:程序、网页、组件在服务器端运行,它们会随不同客户、不同时间,返回不同的网页,例如ASP、PHP、JSP、ASPnet、CGI等

静态网站生成器(Static Site Generator)

What is a static site generator?

A static site generator takes source files and generates an entirely static website.

There are many static site generators available used for all sorts of purposes. Some are for creating photo gallery websites from a folder of photos, others help you create documentation websites. The majority help you manage a typical website with a blog.

Static Site Generator

How does a static site generator work?

参考:静态网站生成器是如何工作的

一个静态网站生成器的工作流程通常有以下几个步骤:

  1. 读取源文件(e.g. 约定 markdown 格式)
  2. 资源预处理
  3. 模板引擎渲染
  4. 生成目标文件

Why use a static site generator?

参考:Why use a static site generator?

  • Less Complexity
  • Speed
  • Security
  • Scalability
  • Version Control

Hexo

Hexo

Hexo 是一个快速、简洁且高效的博客框架,它基于 Node.js

特点:

  • 超快速度
    Node.js 所带来的超快生成速度,让上百个页面在几秒内瞬间完成渲染。
  • 支持Markdown
    Hexo 支持 GitHub Flavored Markdown 的所有功能,甚至可以整合 Octopress 的大多数插件。
  • 一键部署
    只需一条指令即可部署到Github Pages,或其他网站
  • 丰富的插件
    Hexo 拥有强大的插件系统,安装插件可以让 Hexo 支持 Jade, CoffeeScript。

通过 Hexo 可以轻松地使用 Markdown 编写文章,除了 Markdown 本身的语法之外,还可以使用 Hexo 提供的 标签插件 来快速的插入特定形式的内容。