Latest topics 近況報告
たまに18歳未満の人や心臓の弱い人にはお勧めできない情報が含まれることもあるかもしれない、甘くなくて酸っぱくてしょっぱいチラシの裏。RSSによる簡単な更新情報を利用したりすると、ハッピーになるかも知れませんしそうでないかも知れません。
の動向はもえじら組ブログで。
宣伝。日経LinuxにてLinuxの基礎？を紹介する漫画「シス管系女子」を連載させていただいています。
以下の特設サイトにて、単行本まんがでわかるLinux シス管系女子の試し読みが可能！
The Future of JavaScript - Nov 02, 2007
本日18:30より、USTREAMでコソーリと中継します（予定）。申し込みに間に合わなかった方はよろしければどうぞ。
「戻る」「進む」にサムネイル - Nov 01, 2007
戻る・進むボタンにおけるツールチップを見てサクッと作ってみた。
まだ色々未実装だけどとりあえずソースだけ公開しときます。
大量のタブを管理するための様々なアプローチ - Oct 30, 2007
タブをバカスカ開く人のために、いろんなアドオンが開発されている。とりあえず僕が存在を認識している物を、分類して列挙してみた。
素のFirefoxでは、タブが多くなると画面外に隠れるタブが出てきてしまい、タブを探したりタブを切り替えたりといった操作が非常に面倒になる。大量のタブをいかにして管理するか、という観点から考えられるアプローチはこんな感じだろうか。
- 一つのウィンドウの中で開くタブの数を少なくする。
- ウィンドウを「タブのグループ」と見なして、ウィンドウ単位でタブのグループを使い分ける。
- →Firefox Showcase：すべてのウィンドウを横断してタブのサムネイル一覧を表示する。
- →タブカタログ：すべてのウィンドウを横断してタブのサムネイル一覧を表示する。タブのサムネイルはウィンドウごとにグループ化して表示する。
- ウィンドウを「タブのグループ」と見なして、ウィンドウ単位でタブのグループを使い分ける。
- 一度に大量のタブを一覧できるようにする。
- 一つ一つのタブを小さく表示する。
- →about:configでbrowser.tabs.tabMinWidthの値を変更。
- →FishEyeTabs：ポインタが近づくとタブをリアルタイムに拡大して表示する。
- →FaviconizeTab：タブをアイコンだけの状態に畳めるようにする。
- 一つ一つのタブの大きさは変えない。
- タブ以外の手段で一覧する。
- ポップアップメニューで見る。
- →タブバー端の「すべてのタブ」ボタン。
- サイドバーで見る。
- →Tab Sidebar：サムネイル表示。
- →Tab Tree：ツリー表示。
- サムネイル一覧で見る。
- ポップアップメニューで見る。
- 一つ一つのタブを小さく表示する。
また、素のFirefoxでは、すべてのタブが同じように表示されるので、タブ同士の見分けが付きにくい。沢山のタブの中からいかにして操作したいタブを素早く見つけるか、タブを見分けるか、という観点からだとこうなるだろうか。
- サムネイルで見分ける。
- →Tab Sidebar：タブの代わりに使えるサムネイル付きのボックスをサイドバーの中に表示する。
- →情報化タブ：タブの中に小さなサムネイルを表示する。
- →Firefox Showcase：すべてのタブをサムネイルで一覧する。
- →Ctrl-Tab：すべてのタブをサムネイルで一覧する。
- →タブカタログ：すべてのタブをサムネイルで一覧する。
- 色で見分ける。
- →Colorful Tabs：それぞれのタブにランダムに色を付ける。
- →ChromaTabs：それぞれのタブに、開いているページの背景色を反映させる。
- →Aging Tabs：開いてから時間が経ったタブの色をだんだん変える。
- グループで見分ける。
- 色でグループ分けする。
- →Tab Kit：タブを色分け表示し、リンクから開かれたタブなどについて元のタブと同じ色を付けて、タブ同士の関連性を明示する。
- 形、シルエットでグループ分けする。
- →Tab Groups：タブのセットを丸ごと切り替える、より上位のレベルのタブをFirefoxに加える。
- →Separe：任意の位置にセパレータ用の特殊なタブを置いて、関連するタブ同士を仕切って表示する。
- →Separate tabs：Separeと同様のセパレータを表示し、同時に、開かれたタブを自動的にドメイン単位でグループ化する。
- →ツリー型タブ：タブを上か下に表示する場合、リンクから開かれたタブなどについてグループを形成し、グループ同士の間にスペースを空けて表示する。
- ツリーでグループ分けする。
- 色でグループ分けする。
「これが抜けてるぞ」というのがあったら指摘をよろしく。
僕自身は、以前はTBEで「複数行表示」且つ「グループを色分け」という使い方をしてたけど、TBEにツリー表示機能を加えてからは「ウィンドウ横でツリー表示」で「シルエット（インデント）でグループを判別」という使い方に変わった。
同じ色のタブの「グループ」が途中で改行されると混乱の元だし、そもそも色を判別しにくい環境だと、色での判別自体が困難になる（僕自身は特に色弱とか色盲とかの症状はないと思うけど）。それに比べて、タブのインデントのようにシルエットでのグループの明示は、色の再現性が悪い環境でも影響を受けないし、視認速度の点でも圧倒的に上回ってると思う。元々縦一列にシーケンシャルにタブが並んでいるから、複数行表示のような二次元の配置に比べれば視線の移動は少なく済みそうな気もする。
という事情があったのでツリー型タブではタブの複数行表示機能はオミットしたし、そもそもタブバーを画面の左右以外に置くという設定も設けるつもりは元々なかった（汎用性を高く作ってたら、たまたまできちゃった、という感じだ）。
多分、勘違いしちゃいけないというか固定観念に囚われちゃいけない部分だと思うんだけど。ここまで「タブ」という言葉を軸にして書いてみたけど、実際の所は別に「タブ」が重要なわけではない。たくさんあるWebページを一つの画面に表示しきれないから、現在表示されていない分のWebページへアクセスするための「目印」、「手がかり」だけを見えるいちに表示させておく。その概念を現実に僕らが目に触れる物に当てはめた時に、書類を綴じたファイルの中のあちこちを行ったり来たり、あるいは机の引き出しの中を行ったり来たりするために使っている「タブ」が、一番誰にでも分かるしっくり来るメタファだった、ただそれだけのことなんじゃないかと思う。
Separeのような「セパレータ」の導入やタブの色分け、タブにサムネイルを……というのは、「タブ」という現実のメタファに則って発想された、「多数のタブをより効率よく管理するための工夫」と言えると思う。それに対して、ツリー表示とかサムネイル一覧とかは、そういう「現実世界のメタファのタブ」の制約を超えて別の次元に飛び出している、「沢山のWebページ」というものをタブよりもより的確に視覚的に表現する試みと言えるんじゃないだろうか。Mac OS XのExposeもDockもそれと同じだと思う（どうでもいいけど、Windows Vistaのウィンドウ切り替えのアレは、見た目は派手だけど、前述のような「沢山のものをより効率よく一覧する」「沢山のものの中から目的のものを見つけ出す」という観点からの工夫には欠けていて、だから実用性はイマイチなんじゃないか？）。
「タブ」というメタファに依拠すると、そのUIの使い方を誰でもすんなりと理解できるようになるけれども、しかし同時に「タブ」という現実の存在が持つ色々な制約に発想が囚われてしまう。その制約から離れればツリーとか全サムネイル一覧とか、あるいは検索ベースの一覧のような物も生まれ出てくるけれども、今度は逆に、それが何を意味しているのかというメンタルモデルを構築する手がかりがないために、使い方が分からず戸惑ってしまうリスクが増える。あらゆる人を満足させられる一つの答えは、この世の中のどこかにあるんだろうか？ 誰がそれを最初に見つけ出すんだろう？
Ubuntu 7.10にアップグレードしてみた - Oct 28, 2007
仕事で使っている環境は、ずーっと昔に導入したときの6.06 LTSで、早いとこ新しいバージョンに乗り換えたいなあと思いながら今までずるずるとDapperのまんまでいた。乗り換えずにいた理由の一つに、以前会社で訳もわからんままに使わされていたDebianのWoodyからSargeへのアップグレードの時に色々大変でもうこんなのはたくさんだと痛感させられたから、というのもあったんだけれども、まあ最大の理由はタブブラウザ拡張。
TBEはFirefox 1.5までにしか対応してなくて、そのFirefox 1.5が今年の6月でMozilla側のサポートが終了してしまったのでセキュリティホール放置で激ヤバ極生！ 早いとこFirefox 2に移行しなきゃ！ と考えるのが正常なユーザなんだけれども、名前が「LTS（Long Time Support）」と付いているだけあってUbuntu 6.06のデスクトップ環境は（アプリケーションまで含めて）長期のメンテナンスが約束されていて、コミュニティ（どっちかというとUbuntuよりDebianコミュニティ？）がセキュリティアップデートを提供し続けてくれてたんで、Ubuntuを使ってる限りはFirefox 1.5でもまだ一応安心して使い続けることができる。という状況があったので、Firefox 2に乗り換えないとねという強制力もなかなか働かないし、じゃあTBEも今のまんまで自分は困らないし、という感じでTBEのFirefox 2対応は遅々として進まなかった、というより全然手つかずのまま放置してたと言っていい。
逆の方向から見ても、自分自身のWebの利用が完全にTBEに依存しているので、TBEが使えなくなって不便になるというデメリットとFirefox 2に乗り換えることで得られるメリットとを単純に天秤にかけても前者の方が圧倒的に重い。だから、Firefox 1.5で居続けることが許されるのであればいつまでもFirefox 1.5で居続けたいし、ということはUbuntuのバージョンも上げたくない（Linuxのディストリビューションのアップグレードでは入ってるアプリケーションまで全部ひっくるめてアップグレードされるので、Ubuntuのアップグレード＝Firefox 2への乗り換えとなる）し上げられない。
ちなみに、Operaとか他の奴に乗り換えれば？と思う人もいるかもだけど、Operaにはちょっとした恨みがある（といってもそんな大層なことではなくて、このページを以前のバージョンのOperaで開いたらクラッシュするだの表示が崩れるだのの問題が多発して、CSSの仕様に則って書いたとおりの物をCSSの仕様通りに解釈できないOperaキモス！！ と思ったというだけのことです）し、他の奴にしても、使い勝手等で不満を感じた時に自分でどうにかできる余地が残されていないものを使うのは、なまじっかそれが「できる」環境に一度どっぷり浸かってしまった以上、もう考えられない（ああ、なんかGNU教に嵌ってる気がする……）。
……というのが、2007年も末が近づいてきたこの時期になって未だにFirefox 1.5でUbuntu 6.06という環境を使い続けていた経緯です。
でも最近、やっぱりどーしてもFirefox 2に移行しないといけないという事になってしまいまして。これはもう切羽詰まっててヤバイぞ、いよいよ年貢の納め時だ、ということでツリー型タブをたった4日の超特急突貫工事で作った、と。
自分がTBEで「これだけはなくなると死んでしまう！」と思っていた機能をFirefox 2に持ち込むことができたので、Firefox 2への移行もアッサリ済ませることができて、じゃあせっかくだからUbuntu自体も最新バージョンにアップグレードしてしまおうか、と思ってやってみたわけです。
タブブラウザ拡張3 - Oct 27, 2007
タブブラウザ拡張3を公開しました。
……といっても実際にタブブラウザ拡張のバージョン3を作ったわけではなくて、情報化タブ、マルチプルタブハンドラ、ツリー型タブ、ソース表示タブを以前訳したマルチアイテムパッケージの作り方のまんまで一つにパッケージングしただけですハイ。「TBE3」をインスコすると上記4つのアドオンがアドオンマネージャに普通に並びます。
まあ、色々要望等はあると思うけど、僕にとってはこれだけ揃ってたら「TBE3」と名前を付けてもべつにいっかなーと思えている、僕にとっての「タブブラウザ拡張」の「他では替えが効かないもの」はこういう事かな、という感じです。
僕自身はこれに加えて以下のアドオンを組み合わせて、旧TBEで使ってた操作感をなるべく再現して使ってる。
- Undo Closed Tabs Button：閉じたタブを一覧からすぐに開き直せるように。（複数のセッションの管理は実際の所あんまり使ってなかったんで……セッション管理もしたい人はSession Managerあたりをどうぞ）
- Tab Clicking Options：タブバー上でのダブルクリックで新規タブ、タブバー上での中クリックで閉じたタブを復元、という操作をするため。それ以外の機能は使ってない。
- Adaptiva Referer Remover：127.0.0.1とかlocalhostとかからのリファラ送信をカットするために。
逆に、TBEが持ってた機能で今の環境（他のアドオンとの組み合わせも含めて）に欠けてるのは、タブの複数行表示、タブの色分け、フォーカスの詳細な制御、タブのロック、自動リロード、別サイトへのリンクを常に新規タブで開く（別サイトへのリンクをタブで開く機能はツリー型タブ 0.3.2007102902に実装した）、リファラの送信禁止（Adaptiva Referer Removerで代用可能）、JavaScript・Cookie・Refreshによる自動リロード・プラグイン・画像表示それぞれのタブごとの有効無効の設定、それらの情報をブックマークに保存する、といった機能か。
また後で改めて書くけど、タブブラウザ拡張いっこのためにOSのアップグレードすら半年以上（Firefox 2リリースの時から数えれば1年近く）できずにいたので、ついにここまで来たかぁ、と感無量です。
なお、TBE3に含まれている4つのアドオンはどれも一応最近のMinefieldで動作確認はしてるので、次のFirefoxメジャーアップデートの時には今回よりはすんなり移行できるんじゃないかなと思ってる。まあまだUIまわりが（特にタブが）色々変わる可能性はあるようなので安心はできないけど。
横長のツリー - Oct 25, 2007
公開した後から言うのもナンだけど、横長のタブバーでツリー表示にはやっぱり無理があるよねぇ……横長の時は多段タブバー、縦長の時はツリー、というのが最強のような気がする。縦長で多数列とか横長でツリーとか、逆の組み合わせは正直言って使いにくいことこの上ない。設定UIからは削って隠し機能止まりにしといた方がよかったかも。「できる」というのと「するべき」というのとは別問題だ、ということを痛感した。
タブでソース表示 - Oct 24, 2007
View Source in Tab。その名の通り、ソースの表示をタブで行うようにするだけという物。ツリー型タブの機能として加えようとしてて、よく考えたらこれツリー関係の機能関係なくね？ と思ったので別途リリースすることにした。
作り始める前に「そういえばそんな名前のアドオンがすでにあったような気がするんだが……」と思って「View Source in Tab」で検索してみたけど見あたらなかったのでそれなりに作り込んでさあそろそろ公開するか、と思ったところでふと「Open Source in Tab」で検索してみたらあっさり見つかったし
まあそれでもせっかく作っちゃったから公開しておく。一応、Open Source in TabやView Source Choiceに比べて以下の点でView Source in Tabの方が高機能ではあります。
- 「ページのソース」だけでなく「選択範囲のソース」もタブで開くことができる。
- 通常の「ソースを表示」ウィンドウと同じUIを持った物がタブで開かれる（Open Source in Tab、View Source ChoiceだとUIなし）ので、メニューからハイライトの機能の有効無効を切り替えたり、現在の行数・桁数が表示されたり、といった元々の「ソースを表示」機能の便利なところをそのまま使い続けられる。
- Firefox 2のセッション保存のAPIを利用しているので、タブを閉じた後もう一度開き直しても、選択範囲まで含めてちゃんとタブが復元される。
- ツリー型タブのAPIを利用しているので、一緒に入れとくと現在のタブの子タブとしてソース表示のタブが開かれる。
- Firefox 2（Firefox 1.5からだったか）の隠し機能でソース表示に外部のエディタを使う機能があるけど、実行ファイルまでのパスの中に日本語が入ってるとエラーで起動に失敗するので、独自にパッチを当てて、日本語を含むパスでも問題なく外部エディタを起動できるようにした。（外部エディタを使う場合は選択範囲のソースは今まで通り内部のビューワで表示される）
でも徹底的に探したわけではないので、これで後から「実はすでにView Source in Tabという名前のアドオンがあるんだが」という風に気がついたら、もうどうしようもない。→ありました
25日追記。無難なところで「Source Viewer Tab（ソース表示タブ）」に改名しておきました……
ツリー型タブのAPI（他のアドオンから「子タブ」を開く方法） - Oct 22, 2007
ツリー型タブのAPIと称して3つのメソッドの使い方を公開しました。以下のようにして使ってください。
// 一つだけタブを開く場合
if ('TreeStyleTabService' in window)
TreeStyleTabService.readyToOpenChildTab(gBrowser.selectedTab);
gBrowser.addTab('http://www.example.jp/');
// 複数のタブを開く場合
if ('TreeStyleTabService' in window)
TreeStyleTabService.readyToOpenChildTab(gBrowser.selectedTab, true);
gBrowser.addTab('http://www.example.jp/');
gBrowser.addTab('http://www.example.com/');
gBrowser.addTab('http://www.google.co.jp/');
if ('TreeStyleTabService' in window)
TreeStyleTabService.stopToOpenChildTab(gBrowser.selectedTab);
アドオンとかユーザースクリプトとかで、現在のタブに関連した情報を新規タブで開くような機能を持ってる物は、これを入れておくとユーザ（主に僕）が幸せになれると思います！
Tree Style Tab - ツリー型タブ - Oct 21, 2007
先日から作業してたものの成果がそれなりの形になったので、公開しました。
これだけでも当然使えるけど、僕としては情報化タブとマルチプルタブハンドラの二つと組み合わせて使うのがお勧めだと思ってます。
実際に組み合わせて使ってる様子：
元々、使い勝手のいいツリー表示アドオンが出てきたらそっち使う気でいたんだけど、TabKitが案外期待外れだった（←うわー言っちゃったー）ので一念発起して自分好みの物を作った。インデント幅を自動調整するようにしたとか、ドラッグ＆ドロップでのタブの移動とツリー編集の挙動をIllustratorのレイヤツリー風にしたとか、TBEのタブツリーより完成度は地味に高くなってると思う。
突貫工事で作ったワリには案外ちゃんと動いてくれているなあ、というのが率直な感想。なめらかスクロールの実装やサブツリーの開閉まわりのコードをTBEからコピってきて使った箇所が少しだけあるけど、改めて今TBEのコードを見てみたら、タブのスクロール一つとってもとんでもなく面倒なことをしていたんだなあということに、我ながら改めて驚かされる。だって、普通にボックスの内容をスクロールさせるメソッドがなかったんですよ？ バインディングを使って不可視のスクロールバーを取得して強引にスクロールの制御を行ってたとか根本的にバッドノウハウの塊すぎて、読み解くのも一苦労でした。あの頃から比べたらFirefoxの方でAPIを用意してくれてるところが増えてだいぶ楽になったもんです。
以下、検討事項。
- ウィンドウをまたいだドラッグ&ドロップ……は、要望があれば考えよう。
- ドラッグ中にタブバーの端をポイントしたら自動でスクロールするようにしたい。
- 通常の横置きタブでも動くような設計になってはいるけど、十分テストしてなかったり、うっかり縦置きタブ用に決め打ちしちゃってるとことかあるかもだったりで、その機能は今は封印ということにしておく。ていうか自分じゃもうそんな機能使いそうにないし、やる気の度合いは非常に低い。
- アイコンとかもうちょっとマシな物にしようよ。
- 他の（僕が作った物以外の）タブ系アドオンとの組み合わせでちゃんと動くかどうかは知らない。要望が出てき次第対応していこう。
- 複数リンクを選択してまとめて開く機能もこれに入れるべき？
- Text Linkとの連携もしなきゃなぁ
- iRiderのようにすべてのリンクを常にタブで開くモードを付ける？
タブのツリー表示がだいぶ実用的になってきた - Oct 19, 2007
一昨日から取りかかってる奴だけど、サブツリーの開閉を実装して、やっと実用的なレベルになってきた。ツリーの状態もタブセッションの情報の一部として記憶させているので、セッションをまたいでツリーを維持できるし、クラッシュした後の復帰でもちゃんとツリーが復元される、はず。
フォーカス制御やタブの親子関係の保持・取得についてはほとんど全部新規に書いたけど、ツリーの開閉関係はTBEの実装に基づいている。いやまあ、もちろんコードは新しく書き直してるんだけど、アルゴリズム（と言っていいのか？）の部分ね。
あともう一息だー