Category Archives: What’s New?

サイトの裏側を書き直した

Posted on by

自分のサイトを更新するモチベーションが沸々と約2年半ぶりに湧き上がり、現在業務で使っているツールや知識を使って裏側を書き直した。 今回変えたのは以下のような点。

  • Grunt 導入
  • プロトタイプ環境と本番環境を分けた
  • WordPressシステムファイル以外のソースコードを GitHub で管理するようにした
  • Twitter API version 1.1 への対応（遅っ！）

Twitter API を利用しているのはトップページでリスト表示をしているところだけだが、Twitter API 1.0 が廃止されてから1年近く放置してしまった…。お恥ずかしい限り。

Grunt を導入したことでパッケージ管理をぜんぶ bower に任せられたし、必要なやつだけ grunt-contrib-copy でコピーして deploy 環境に置く、みたいなことができてめちゃくちゃ整理ができた。2年半前と開発環境はえらい違い。

突貫工事だったので JavaScript とか LESS とかは適当。まだ途中のところとかあるし。
あとでやりたいこと↓

  • JavaScript を CoffeeScript で書き直す
  • Bootstrap を始めとしたパッケージ群を最新版にして WordPress テーマを書き直す

サイトをリニューアルした

Posted on by

あけましておめでとうございます、というにはもう遅すぎるけど、2012年初エントリーです。 年末年始の休みに作業していたものをようやくリリースすることができたので、これで安心して新年をスタートできるというものです。

今回のリニューアルでやったこと

  1. 記事をMarkdownで書くことを前提とした
    • GitHubを使い始めてからMarkdownマンセーになったので
  2. デザインはBootstrapをベースにする
    • Mardown前提ならある程度スタイルが最初から用意されているフレームワーク使った方が楽
    • ビジュアル面のデザインをする気力がないだけということもあるが
  3. WordPressのテーマは”Twenty Eleven”を継承した子テーマに
    • これも楽をしたかっただけ
    • 最初はBootstrapに最適化したようなテンプレートを書こうと思ったけど、めんどくさくなって諦めた
    • Twenty ElevenをベースにBootstrap + αをくっつけるだけ、みたいなテーマを書いた
  4. トップページに自分のツイートを表示して人気（ひとけ）を出す
    • ソーシャルサービスのデータを表示すれば、ブログを更新していなくても人気が出て寂しくないお。リアルタイムな雰囲気が出ていいんじゃないかと
    • 今のところTwitter APIをPHPで叩いてるだけ。WordPressのエントリーは普通にテンプレートで出力してる
    • 全部データを書き出した後に日付順にソートしてる。新しいものは上の方に、古いものは下の方に表示される
    • 今後、他サービスのAPIにも挑戦したい。Instagramの写真を展開したりとか。でもそうすると余計ブログを更新していないことがバレバレになるお
  5. トップページのレイアウトにjQuery Masonryを使う
    • 今風にしてみたかっただけ
  6. ソーシャルサービスのアイコンはIconDock.comより拝借
    • awesomeです。ありがとうございます。

追記:

モバイル端末用のビューはWPtouch任せなので、iPhoneなんかで見ると何が変わったかさっぱり分かりませんね…。

今年の目標など

書こうと思ったら長くなりそうだったので別のエントリーにします。

というわけで本年もどうぞよろしくお願いいたします。

WordPressに移行

Posted on by

当サイトのCMSをMTOS4からWordPressに移行しました。

今年は仕事においてMTでサイトを構築する機会に恵まれたおかげもあり、MTはどう使えばいいのか割と勝手がわかってきた、と思っています。それなりにすらすらとテンプレートも書けるようになり、プラグインもこれとこれを使うってやつがある程度決まってきたので、不自由する機会はあまりなくなりました。
# プラグインを自分で書いて云々っていうレベルには遠く及びませんが

MTがバージョン5になってよりCMSとしてよくなった感があるのだけれど、優等生になってしまった気がしてもう仕事で使えさえすればいいや、という気分になってしまった、と。そこでプライベートではWordPressやろうかってことで移行に至りました。

MTOS４からの移行では、MTOS４から「ブログのエクスポート」を行い、新規インストールしたWordPressのインポート機能で「Movable Type と TypePad」を選択し、記事とコメントのインポートを行いました。

ここでいくつか不都合が発生。

まず1点は、記事毎のパーマリンクの設定（WordPressでは「スラッグ」と呼ぶ）にMTでいう「出力ファイル名（MTEntryBasename）」が引き継がれないこと。「出力ファイル名」の情報は飛んでしまい、代わりにスラッグには記事のタイトルと同じテキストが設定されます。なので記事のタイトルに日本語が使われているとスラッグにも日本語が入ってしまうわけで・・・、パーマリンクの設定をカスタマイズして%postname%を使用していると、URLはかなりひどいことになります。

2点目は「タグ」の設定が引き継がれないこと。WordPressにも「タグ」がありますがここにはMTでいう「キーワード」フィールドの値が引き継がれてしまいました。「タグ」も「キーワード」も役割が似通っているとも言えるのでWordPressではこれを一本化しているのには納得が行きますが、かといってなぜ「タグ（MT）」を「タグ（WordPress）」に引き継がないのか・・・。これは納得がいかない！

このブログは幸いにも（？）記事の総数が大した量ではないため、全て手動で入力しなおすことで解決しましたが。その際、記事一覧の「クイック編集」の機能が重宝しました。これがなかったら嫌になっていたかも・・・。

テーマもオリジナルではなく適当なものを拝借していじったやつだし、まだまだWordPressがなんのこっちゃ分からんという感じなので、ちょっとづつ勉強していきたいと思います。でもまぁ、来年の話ですね（笑）

サイトデザインをリニューアルしました

Posted on by

サイト開設から初めてのデザインリニューアルです。
リニューアルのポイントは以下。

紆余曲折あって現在の私の職種はマークアップエンジニアとなったので・・・、エンジニアらしく、自信のないビジュアル面では凝ったことはもうやめよう、と。よってビジュアル的な簡素化を図った反面、コード面ではいろいろ挑戦しています。

script.aculo.usを使って実験的なことをやってますが、パフォーマンス面ではなかなかに難があり・・・IE6では折りたたみエフェクトを連打するとブラウザが落ちたりします。実験室というこのサイトの性格上、ま、いっかということにしましたが＞＜

それから本文の文字をでかくしたのは、自分が見やすいサイズがこれだから。視力が落ちたのかどうかはわかりませんが、近年は小さい文字をじっと読んでいると目が痛くて痛くて・・・。