SIS Lab
>
Blog
>
静的サイトジェネレータ「Hugo」でシンプルブログサイトを構築する

静的サイトジェネレータ「Hugo」でシンプルブログサイトを構築する

更新日:2022.07.02 作成日:2017.01.08

#Hugo #Blog #Jekyll #静的サイトジェネレータ

今、自分でブログ・サイトを構築するとしたら、どんな選択肢があるでしょうか。

さすがにHTMLを自分で手打ちするのは大変です。なんらかのCMS（Content Management System：コンテンツ管理システム）を利用することになりますが、そのCMSにもさまざまな種類があり、どれを選んだらよいのでしょうか。

私自身、CMSとしては Lokka (Ruby), WordPress (PHP), Jekyll (Ruby), Octopress (Ruby)、 Middleman (Ruby)と利用してきました。

どのCMSも一長一短ですが、Ruby, PHPなどの動的スクリプトで構成されるCMSは共通してビルドの遅さを感じます。

そこで、ビルドが高速という噂の Hugo (Golang)に移行したところ、快適でシンプルなブログサイトを構築できましたので、今回はその Hugo の紹介をします。

Hugoとは何か

Hugo とはGolangで書かれている静的サイトジェネレータのひとつです。他の静的サイトジェネレータと比べてビルドが高速であることが特徴です。

静的サイトジェネレータの『静的』って？

静的サイトジェネレータとは、その名の通り「静的」なサイトを作り出すジェネレータです。「静的」なサイトとは、素のHTML, CSSのWebページを想像していただくとその認識に近いと思います。

冒頭でも書きましたが、静的なサイトを作るためにいちいちHTMLタグを手打ちしているのでは効率が悪いです。そこで、サイトの土台となるテンプレートを元にサイトを生成するのが静的サイトジェネレータの仕事です。

一方、「静的」の反対である「動的」なジェネレータとして代表的なものは、 WordPress です。 WordPress はユーザからのリクエストに応じて毎回ページを動的に生成することで、より豊富な情報をユーザに表示させることができます。その反面、デメリットもあり、一般的にサイト表示速度が遅いことが挙げられます。

「静的」と「動的」どちらもメリット、デメリットがあるのですが、ここでは「静的」サイトジェネレータをオススメしています。この静的サイトジェネレータには、どのようなメリットとデメリットがあるのでしょうか。

静的サイトジェネレータのメリット・デメリット

メリット

テキストファイルだけなので、管理が楽
WordPressのように定期的にセキュリティのためのパッチを当てなくても大丈夫
基本的にHTML+CSS+JavaScriptだけなのでサイト全体が軽い

デメリット

ユーザのリクエストに対して、動的に表示を制御できない
関連記事の表示などに苦労する
WebUIの管理画面がないので、外出先から更新できない

ユーザからのリクエストに合わせて動的にサイト（ページ）を生成できないため、関連記事の表示などWordPressではプラグインを入れれば比較的簡単にできることが難しいです。また、記事投稿の管理画面はないので、外出先から気軽に更新できません。

2017/10/7追記
HugoにRelated Contentという関連記事を表示する機能が追加されました。

静的サイトジェネレータの種類

Top Open-Source Static Site Generators - StaticGen に静的サイトジェネレータの一覧があります。いままで使ってみた静的サイトジェネレータを下表にまとめてみました。

Name	Language	Description
Hugo	Go	☆☆☆　おすすめ！
Jekyll	Ruby	☆☆　初めて利用した静的サイトジェネレータ。おすすめ
Octopress	Ruby	☆☆ Jekyllを高機能にしたもの。使ってました
Middleman	Ruby	☆ Jekyllを高機能にしたもの。使ってました
Hexo	JavaScript	? JavaScriptの静的ジェネレータでよく聞くもの

静的サイトジェネレータ「Hugo」の魅力

私が感じるHugoの魅力は以下2点です。

圧倒的にビルド速度が早い（生成時間が短い）
開発が活発である

1つ目のポイントは「ビルド速度」です。

静的サイトジェネレータは、 Jekyll -> Octopress -> Middleman -> Hugo と使ってきましたが、この中でもHugoは圧倒的に生成時間が短いです。

Hugoへの移行前は、 Jekyll 、 Octopress を使っていても、生成速度に不満を持ったことはなく、こんなもんかと思ってました。しかし、Hugoに変えたところ、快適すぎてもう元に戻れません。「速さは、正義」。これこそHugoを使うメリットでしょう。

以下のURLを参考すると、生成時間はやはり Hugo がダントツですね。
静的サイトジェネレータの生成時間比較: 嵐の小舟より

2つ目のポイントは「開発が活発である」ことです。

Hugo Discussion には、Hugoを使うときの質問やTipsが日々飛び交っています。また、 spf13/hugo: A Fast and Flexible Static Site Generator built with love in GoLang [github] を見てもわかるように、日々新機能の更新、メンテナンスのコミットがあります。

この勢いがあれば、使い始めたけれどメンテナンスされなくなるという心配は不要でしょう。