SassとCompassをWindowsにインストール

css

CSSのベンダープリフィックス書くのがだるいとかセレクターの親子関係が分かりにくいとかといった悩みを解決してくれるらしいSass(さす)を使ってみようかと思いたちました。
WindowsでSassを入れる順番は、

  1. Rubyのインストール
  2. Ruby上でgem installを実行してSassをインストール

で終わりらしいです。

Rubyのインストール

てなわけで、最初はRubyをダウンロードしてきます。
http://rubyinstaller.org/
私は1.9.3をインストールしました。Rubyの資産がなければ1.9系で問題ないようです。ファイルはこれを使いました。
http://cdn.rubyinstaller.org/archives/1.9.3-p327/rubyinstaller-1.9.3-p327.exe
Rubyのインストーラでは以下のチェック以外はデフォルトで大丈夫です。

「Add Ruby executables to your Path」にチェックを入れると、ruby.exeやgem.exeのパスが環境変数に追加されます。手動で設定しなくて済むのは楽ちんで良いですね。

Sassのインストール

次はいよいよsassのインストールです。
コマンドプロンプトを立ち上げて

gem install sass

と打つとSassのインストールが始まります。ログがこんな感じに出たら成功です。

C:\>gem install sass
Fetching: sass-3.2.3.gem (100%)
Successfully installed sass-3.2.3
1 gem installed
Installing ri documentation for sass-3.2.3...
Installing RDoc documentation for sass-3.2.3...

拍子抜けする位簡単にインストールできてますね。

Compassのインストール

ついでにCompassもインストールしちゃいましょう。Compassは、Sassで良く使うパターンをひとまとめにしてくれたライブラリみたいなものらしいです。SassとCpmpassはセットで語られることが多いようなので、たぶん入れておいて損はないんだと思います。
Compassはコマンドプロンプト上で

gem install compass

と打てば完了です。いまどきのパッケージ管理は簡単で素敵ですね。

CSSでスプライト画像を指定するときIE8だけ表示されないことがある

css

CSSでスプライト画像（複数の画像を一つの画像ファイルにまとめた画像。HTTPリクエストを減らすのに役立つ）の設定をしていた時、ChromeとかIE9では画像が表示されるのにIE8では表示されないことがありました。なぜだろうと調べてみたところ、

.button-content {
  /* 正常に画像が表示される */
  background: url(../img/sprite.png) no-repeat -35px 0;
}

と、書けば大丈夫だけど、

.button-content {
  /* no-repeatの前に半角スペースがないと、IE8で画像が表示されない。 */
  background: url(../img/sprite.png)no-repeat -35px 0;
}

と、書くとダメなようです。
こういう微妙なバグ？は厄介ですね、ということでメモ。

クラウド時代のユーザ認証についてのメモ

昨今のWebサービスでは自前でユーザ登録することも少なくなって来ており、TwitterとかFacebookとかと連携することが多いよね、ということで、関連記事をメモ。
余談ですが、初見でIdPをアイデンティティプロバイダと読める人は何人いるのでしょうね？

アプリのUIに魔法をかけるデザイナさんってすごい！

Windows Phone 7

去年の冬にWindows Phone Holiday Apps コンテスト向けの百人一種アプリを作った時に、改めて本職のUIデザイナってすげぇぇ、と思いました。というわけで今回は私の作った原案のデザインがデザイナさんの手にかかるとどのように変わるかを紹介させてください。

続きを読む

RIA アーキテクチャー研究会　第3回 セミナーに参加してきた

勉強会

非同期、UIパターンって何？など現在私が興味を持っている分野の発表が多かったので参加してみました。

発表内容はこんな感じでした。

いやー、とても濃い発表ばかりでついてくだけで精一杯でした。ぜひ資料が公開され次第復習したいですね。
以下は自分メモ。

続きを読む

StyleCopで学ぶC#コードスタイル入門

C#

手なりでコーディングしているとコードのスタイルがハチャメチャになりがちです。規約に従って書こうと思っても規約に従ってかけてるかを判断するのは意外と難しいものです。そんならツールを使ってチェックすれば抜けもなくて良いじゃん？ということでMS謹製のC#静的解析ツールStyleCopを使ってみることにします。

StyleCopのチェック内容が意味不明とか思ったら以下のサイトが参考になります。

ちなみに、もっとC#らしいコーディングスタイルを知りたいと思う方は以下の記事が参考になると思います。

続きを読む

Windows 8 Consumer Previewを入れてみた

Windows 8

Windows8の最新β版のConsumer Previewを入れてみました。ISOファイルは以下にあります。

インストール自体はあっけなく終わりました。唯一手間取ったのがProduct Keyを聞かれたことです。上記のサイトにProduct Keyが書いてあるのですが、インストール中に必要と思っていなかったのでうろたえてしまいました。
ちなみに私はISOをDVDに焼く方法をとったのですが、フラッシュメモリからインストールすることもできます。

肝心のWindows 8 Consumer Previewの使い心地ですが、普通に使えてしまう安定感です。メトロUIに関してはタッチパネルがない環境に入れた関係上ノーコメントで。
しかし、一番試したかったエクスプローラとSkydriveとの連携機能の使い方がわからりません。アプリを入れるのだとは思うのですが…。

インパクトはありますが、この壁紙はいかがなものか。