既にご存じの方もいらっしゃるかと思いますが、500W という新しいブログを昨年末から書いています。
このブログ(Stocker.jp / diary)は時間をかけてWeb関係の記事を1記事ずつ書いているため、ちょっとした記事や、Web制作と関係のない記事(Blender、3DCG等)を書きづらくなってきたため、そういった記事はブログを分けることにしました。
こんな記事を書いています
Webデザイン・Adobe
コーディング・プログラミング
Blender・3DCG
その他
- BootcampにはインストールできるWindows8とできないWindows8がある
- iTunes 12でリピート再生しやすくする方法
- Apple Storeで購入したものは、ほぼ何でも2週間以内は返品できる
- TweetDeckは今のところ最高のTwitterクライアントかも
WordPressではなくJekyllを使った理由
新ブログは、WordPress ではなく Jekyll という静的サイトジェネレーターを使用して制作しました。
もちろん、使ったことのない技術を使う勉強のためというのもありますが、WordPress は海外から管理画面へのアタックが多すぎて、それを防ぐと今度は xmlpc.php へのアタックが…という感じでキリがないので、いっそ HTML と CSS をローカルで生成し、アップロードしたほうが管理が楽なのでは…ということで静的サイトジェネレーターを検討していました。
その中で、example.com/directory/ のように下層ディレクトリで使用でき、そこそこ有名で開発終了しなさそうなものを…ということで Jekyll を選択しました。
Jekyllを使ったブログ制作
インストール
Jekyll を使用するには、公式サイトのトップページにあるように gem を使ってインストールする必要があります。
gem を使用するには、ターミナルを使って Ruby の開発環境をインストールしておく必要があります。
参考: 【Yosemite】Mac OSX 10.10 Yosemite に Ruby + Rails4 開発環境の構築【初心者必見】 – Qiita
Jekyll のインストールは以下のWebページを参考にしました。
テーマ制作
Jekyll は Ruby でできているため、テーマ制作は Ruby を記述する必要あるかとおもいきや、特に必要ありませんでした。
HTML の中に {% include head.html %} や {{ content }} のようなタグを加えるだけなので、WordPress テーマ制作よりやや敷居が低いかもしれません。
今回はデフォルトのテーマを改造して制作したのですが、デフォルトのテーマは Sass(SCSS)が使われていたので、Sass を使用しました。
ヘッダー部分は、よく見るとグラデーションの色が変化するようになっていますが、これは WebGL を使用しています。
CSS3 でも似たようなことはできるのですが、WebGL のほうが、複雑なグラデーションを美しく描画でき、処理も軽いように感じました。
WebGL 部分は、javascript 4k intro の anpanman のソースを参考に作っています。
更新
記事は MarkDown 形式で書いた後、jekyll serve という Sass でいうコンパイルのような作業を行う必要があります。
ターミナルで
cd /Jekyll/install/dir/
jekyll serve
のように実行した後、Webブラウザーで http://127.0.0.1:4000/ のアドレスを開く必要があるのですが、いちいち毎回これらのコマンドを実行したりブラウザーを開くのは面倒なので、以下のようにエイリアスを設定しました。
alias jk='open http://127.0.0.1:4000/500W/; cd /Jekyll/install/dir/; jekyll serve'
jekyll serve すると、MarkDown で書いていた記事が HTML に変換されます。
あとは、SFTP などでファイルをアップロードすればブログの更新ができます。
Jekyllを使ってみた感想
率直に言うと「ターミナルを使い慣れている方が、1人でブログを更新するのには向いている」というのが正直な感想です。
逆に、複数人でブログを更新する場合や、ターミナルの操作に慣れていない方がインストールや初期設定を行うことは難しいと思います。
WordPress などを使用していて、海外からのアタックに悩まされている方や、シンプルなブログを作りたい方にはよさそうだと思いました。
制作したブログ
RSS もあります。