岩家.net

25日に行われた WCAN mini Markup Vol. 2 に参加してきました．

CSS Nite LP, Disk 3 と併催された コーディングコンテスト Vol. 1 での課題をここでも取り扱う，ということで，遅ればせながら私も挑戦してみました．（コンテストへの提出はしてませんが．）

さらに，各参加者 （のうち課題作成者） によるミニプレゼンを行う，との連絡が 1週間強前に入り，人前で話すのが苦手な私にとっては，急遽心の準備をすることになりました．

課題とその特徴

作成した課題へのリンクを次に張ってみます．（Opera9 と Firefox2 でのみ確認．Safari，IE7 については未確認．IE6 では微妙かと．）

• index.html
• products.html

作成にあたっての特徴といいますか，まぁそのようなものを次に挙げます．

• 実は CGI だったり．
• (X) HTML をテンプレートとして分割管理，再利用．
• コーディングについては，テキストエディタ xyzzy のみ．
• 設計の都合で左に 45px ズレ．

また，作業環境として，OS に Windows と Debian さんを，画像の切り出しに Photoshop CS2 を使用しています．

発表

当日は，だいたい上記の内容について発表しました．（クジ引きで一番手を引いてしまいました．）

このときにネットワークの都合で Safari で表示することになりましたが，ヘンな表示崩れは無かったように見えました．ひと安心．．．

なるほど

以下，他の方の発表やディスカッションの中での個人的な気づきをいくつか．

• 画像の切り出し方もコーディングのうち．
• 急ぎのときは画像の切り出し方も工夫してみよう．
• 印刷時のことも考慮しよう．
• 印刷時，見た目のとおりに出すか，まったく別物にするか．
• Mac - Win 間のデータのやりとりは LZH で．（@ 3次会）

マウスオーバー画像表示 CSS での気づき

あと，ちょっとしたことなんだけど今まで全然気づかなかったのが，マウスオーバー画像を表示させるときの CSS の書き方．

高さが 20px の画像についてマウスオーバーエフェクトをつけるような場合，通常，マウスオーバー画像を順に縦に （私の場合，横でも無問題） くっつけて CSS で制御するのが定番かと思いますが，その CSS を，今までは次のように書いてました．

a.img {
  display: block;
  height: 20px;
  overflow: hidden;
  background: url(…) no-repeat;
}
a.img:hover {
  background-position: 0 -20px;
}

で，この a.img:hover を次のようにすればいいじゃん，ということです．

a.img:hover {
  background-position: 0 bottom;
}

おお，確かに．これなら，読んでわかりやすいし画像のサイズ変更の際の CSS の修正個所も減るし，と，ハッピーになれそうです．

今後は積極的に使ってみますかね．まずはこのサイトのナビゲーションからかな．

その後

2次会，3次会にて談笑し，終わったのは翌 4時頃でした．id:choco-snack さん，ホント感謝です．

おわりに

今回は，皆さんのお仕事のお話なんかも聞けて，今後自分が行動していく上での参考になる部分もありました．最初から最後までがいい勉強になりました．

参考リンク

• WCAN [ Web Creators Association Nagoya ] WCAN mini Markup Vol.2
• WCAN mini Markup vol.2｜まめ蔵
• WCAN mini Markup Vol.2 行ってきました。 | サルブロ

金曜日に行われる WCAN mini Markup Vol.2 に向け，コーディングの宿題と格闘するこの数日． （といっても，昼間は通常のお仕事がたまっているので，夜闘ってます．）

ときどき書いた XHTML の妥当性をチェックするわけですが，毎回 サイト にアクセスして．．．がさすがにメンドくなってきたので，勉強がてらブックマークレットを作ってみました．

• W3C Markup Validator
• W3C CSS Validator

（ウチのサイトはエラー出まくりなのであしからず，です．）

実のところ，サイト管理者、lint厨、W3C信者etc向けブックマークレット - LogJET で 1年以上も前に公開されてたりしますが，個人的にポップアップ （別窓） 式のが欲しかったので．．．

って、JavaScriptをほんの少しかじったら作れるような簡単なスクリプトですので、たぶん既出なブックマークレットです。何を今更な…。
サイト管理者、lint厨、W3C信者etc向けブックマークレット - LogJET

1年遅れのさらに今さらなエントリでした．

デュアルディスプレイ導入してみました．離れてますが．

以前から使っている P1700-BK に揃えるべく同じもの （中古可） を探したのですが見つからず．で，そんな中見つけたのが，展示品限りな M1700-GY でした． スペックも P1700 とほぼ同等 （ M1700 - P1700 == スピーカ + DVI端子？） なので，あまり迷いもなく購入を決めました．

ただ使用時間が，私が P1700 を 1年半使用してきた時間の倍ってのが気になるといえば気になりましたが．．．その辺は展示品ということで割り切る部分ですかね．まぁドット落ちもないようですし．

お仕事上，コーディング等しながらの Webページ確認なんかが主な用途ですが，デュアルならではの使い方をいろいろ見つけて・身につけていきたいものです．

（ブラウザを，非アクティブな状態でもリロードできるように，ホットキー一発で登録したウィンドウクラスに特定のキーシグナルを送る，そんなアプリケーションが欲しいところ．探せばありそう．）

巷では十分ありきたりなネタですが，個人的に復習の意を込めてエントリを．

本日，お仕事用サーバ （データ入れたりテストしたり） を拡張する企画 （？） の一環として，大須にて HDD （160GB） を購入し，そこに Debian 4.0 を入れてみました．

特に GUI は必要ないためコンソールでの使用になるわけですが，気になってしょうがないのが Caps Lock キーと Control キーの位置．（大学入学当初から慣らされたせいか，A の左に Control キーがあるのが好みなんです．） もう，位置を入れ換えずにはいられません．

これらを入れ換える方法として xmodmap がらみの設定をイジるのが定番です （よね？）．しかしこの方法の場合，その名のとおり X が起動するときに反映されるようで，コンソール用途では意味がありません．

で，何かないかと探したところ，次の記事がよさげでした．方法として非常にシンプルですね．

• 猫大好き、ネットワーク大好き。 - KubuntuでCtrlとCapsLockの入れ換え

id:NekoDaisuki さんが試されたのは Debian 系の Kubuntu 7.04．しかし，うまくいかなかったようです．（Ubuntu 6.10 ではイケるとのことです．） 今回私が Debian で試してみたところでは，問題なく反映してくれました．ただし，再起動後のお話ですが．

ちなみに，

# This sed script is run across the dumpkeys output to remap keys on the console

# This turns caps lock into control
#s/keycode  58 = Caps_Lock/keycode  58 = Control/;

4行目の#を削除して
猫大好き、ネットワーク大好き。 - KubuntuでCtrlとCapsLockの入れ換え

の記述の場合，Caps Lock キーを Control キーに換えるだけなので，Caps Lock キーがなくなってしまいます． （まぁ大した実害はほとんどないでしょうが．） ので，次のように 1行加えておけば，いつかはハッピーになれるかも，と思ってみたりみなかったり．

# This sed script is run across the dumpkeys output to remap keys on the console

# This turns caps lock into control
s/keycode  58 = Caps_Lock/keycode  58 = Control/;
s/keycode  29 = Control/keycode  29 = Caps_Lock/;

昨土曜日，一日かけて開発合宿のようなことをしてました，自宅で．

作業環境としてはいつもと変わらないわけですが，まぁなんというか，モチベーションの違い？みたいな．

で，できたのは家計簿アプリです．日付と内容と収支を記録して，それらをタグで管理できるくらいのシンプルなものです．以前からそんなツールが欲しいな，と個人的に思っていたので，この連休を機に勉強がてら作ってみました．

とりあえず次の URL にて公開してますので，よろしければ．何のおもしろみもありませんけど．

• http://www.iwa-ya.net/labs/kkb/

改善の余地ありまくりなので，ご意見や不具合のご指摘なんかもいただければ幸いです．

反省

前日寝る前に仕様をちょこちょこっと考えただけだったため，どう進めるべきかを判断できずに手が止まることが多々ありました．

また，作業中によく 「この部分，ついでにこんな機能も追加しとくか」 と，本来の作業以上のことをしてしまうこともありました．それが原因で時間が余計にかかるのは問題ですね．

事前に山頂と経由地点，そこへ至る道を明確にし，途中，キノコを拾いに寄り道はしない．いったん山頂へ到達した後に途中で見つけたキノコを拾いに戻る．

ヘンな例えになってしまいましたが，次回行うときにぜひ活かしていきたいものです．

おまけ

家計簿でつながるコミュニティサイト 散財.com，作ってから知りました．