かつて Safari 4 beta という血迷ったバージョンがあった
Safari 4 beta（2009年2月リリース）を覚えておられる方はこの日本には一体どれだけいらっしゃるのでしょうか。ググると Safari 4 beta の痕跡はまだまだ出てくるので、忘れていた方でもすぐに思い出せるかと思います。Safari 4 beta は Safari の歴史の中でも特に印象に残るバージョンの一つでした。なんといってもタブバーが挑戦的だったのです。
不可侵領域であるはずのタイトルバーがタブの侵攻を許した
それまでの Mac OS において、ウインドウのタイトルバーというものは一種の聖域でした。標準スタイルを採用するウインドウならタイトルバーには独自の要素を置いてはならないというのが暗黙的なルールでした。ウインドウはタイトルバーをつかんで移動するものだったから、そこにボタンなんて置いたらドラッグした時にウインドウを移動できなくなってしまいます。ウインドウのどこでもつかむことのできる Metal スタイルというものもありますが、ほぼ何かしらのビューで覆われるウインドウにおいてその効力は限定的です。そもそも NSWindow が提供する API ではタイトルバー領域のカスタマイズは（当時は）難しく、半ばハック的な手法でビューを配置しなければ実現できなかったのです。それをやってのけたのが、Safari 4 beta だったのでした。
下向きタブか、上向きタブか
当時これを初めて見た時にまず抱いた印象は、『Chrome っぽい』というものでした。下向きタブが好きだった私はとても残念な気持ちになりました。
Safari は1.0 Public Beta の頃からタブが他のブラウザとは一線を画す下向きのデザインになっていたので、この上向きタブは初代からの伝統を破るものでもありました。Safari 4 beta を担当した UI デザイナーがどのような意図でこれをデザインしたのか本当のところはわかりませんが、おそらくは Chrome などのライバルが採用している上向きタブに寄せようとしたのではないかということや、タイトルバー領域をうまく利用すればツールバーを圧縮できる分コンテンツ領域を縦方向にわずかに広げることができる、などと考えたのではないかと思います。
Safari のタブが元々下向きなのは、アドレスバーやツールバーとタブが表すドキュメントが対応付くことを表現する意図があったように思う。
Mac OS のドキュメントベースアプリケーションでは通常ドキュメントとウインドウの関係が1対1になりますが、そこにタブを採用することでひとつのウインドウの中に複数のドキュメントをまとめて表現することができるようになります。この構造下ではドキュメントに対してウインドウの代わりにタブとの関係が1対1になります。この構造で一つ厄介なのは、ウインドウが持つタイトルラベルとタブが持つタイトルラベルが全く同じ意味で重複して存在することになってしまいます。Safari 4 beta ではそこを省略したかったのかもしれません。
タイトルバーとタブにそれぞれ同じ意味のタイトル『名称未設定』が配置されるため、情報が散乱することになる。
Why are Safari's tabs upside-down?
http://leancrew.com/all-this/2009/06/why-are-safaris-tabs-upside-down/
猛反発を浴びた『上向きタブ』
当時 の 2ch の Safari スレや Mac 系ブログを色々眺めていていましたが、やはりこの斬新なタブバーに対しては否定的な意見が多く見られました。ウインドウのタイトルバーが狭まってしまったことで『ウインドウをつかみにくく不便』だという声や、『見た目がダサい』『さっさと元に戻せ』という感情的な意見も多かった記憶があります。Apple としてもこれは実験的な試みであったのか、タブバーを以前のスタイルに戻す隠し機能をあらかじめ用意していました。
defaults write com.apple.Safari DebugSafari4TabBarIsOnTop -bool NO
http://macfan.jp/macfan/2009/02/27/post_534.html
com.apple.Safari.plist の DebugSafari4TabBarIsOnTop という Boolean 型のフィールドに NO とすると元に戻すことができました。今となっては懐かしいハックですね。
あまりにも苦情が多かったのか、それともUI的によろしくないと判断されたのか、後に登場したバージョンではこの上向きタブは廃止され、本来の下向きタブに戻りました。そして今ではすっかり忘れ去られた幻の UI となったのでした。しかし今思うと実験的かつ貴重な UI のサンプルであったため、今頃になってとても恋しくなってしまいました。ということで私は Safari 4 beta を復活させるべく、『Safari 4 beta 復活の儀』を執り行うことにしました。
Safari 4 beta 復活の儀
我が家には 10.7 が現役稼働している Mac があるため、それでなんとかならないかと試行錯誤することにしました。肝心の Safari 4 beta ですが、データ保存用 HDD にインストーラー（Safari4.0BetaLeo.dmg）を几帳面に保存しておいたのを発掘できたので、それを利用することにしました。
なお、この Mac では Safari 6 が稼働している状況なので、次のブログ記事を参考にそれぞれを切り分けて起動できるように設定しました。
Safari 4 Betaをなんとかして共存させたい
http://d.hatena.ne.jp/gct/20090310/1236709640
目的も手段もほぼ同じだったので大変参考になりました。
unpkg で .pkg を展開したら、本来システムフォルダにインストールされるはずのフレームワーク類、ライブラリを Safari.app パッケージ内に収めるように改造します。Safari の実行ファイルの代わりに同名のシェルスクリプトを配置し、それを経由して強制的に環境変数を設定するという手法をとるようにします。このシェルスクリプトには実行権限を付与しておきます。（rwxrwxr-x）
#!/bin/sh
APPROOT=${0}/../..
export DYLD_LIBRARY_PATH="$APPROOT/Contents/lib"
export DYLD_FRAMEWORK_PATH="$APPROOT/Contents/Frameworks"
exec "$APPROOT/MacOS/Safari4beta" "$@"
$ chmod 775 Safari
ちなみに記事通りのスクリプトだとうまくいかなかったので、パスの表記を一部変更しています。
今回は利用しませんでしたが、アプリの Info.plist に LSEnvironment というキー名で環境変数を直接記述することもできるようです。
またこれ以外にも、OS が備えるバージョンチェック機構が Safari 4 beta を拒絶してしまうため、Info.plist の CFBundleVersion を 7537.78.2 に書き換えました。
以上で復活の儀は終了です。これにより Safari 4 beta が無事起動するようになりました。
ただ、新規タブを実行すると100%クラッシュしてしまうようでしたので、これは Top Sites 機能を無効化することで対処しました。当時の Top Sites を見られなくて残念です。
Safari 4 beta 復活。ビルド番号は復活の儀の際に 6.1.6 のものに書き換えた
当時はまだアドレスバーと Goole 検索フィールドが分離していました。検索フィールドには NSTextFieldRoundedBezel が設定されていて丸い形状をしています。このような丸形状のものは一般のテキストフィールドと検索フィールドを区別するためのスタイルとして用意されていました。
タブの振る舞い
タブ一つの場合
Safari 4 beta ではまずタブが一つだけのウインドウが起動します。この状態でタブが閉じられる意味はないのでそこにクローズボタンは無く、タブを閉じる代わりにウインドウを直接閉じます。Hide Tab Bar 機能は無効化されていて実行できません。
タブ複数の場合
タブを追加していくとウインドウ幅内に均等に並ぶようにタブ幅が縮んでいきます。これは現在の Safari の挙動に似ていますが、当時としてはこれも画期的な表現であったと記憶しています。元々 Safari 3 までのタブは固定幅で左詰め表示されていました。記憶違いでなければ、当時登場したばかりの iPad 版 Safari が先に取り入れていたこの表現に合わせたのではないかと思います。
タブ数が二つ以上になるとアクティブタブにクローズボタンが表示されるようになります。Chrome と違ってクローズボタンが左側配置なのは Mac OS のウインドウに由来しますが、1番目のタブのクローズボタンはウインドウコントロールにとても近い位置にあるので、一瞬戸惑ってしまうかもしれません。
Safari3: http://leancrew.com/all-this/2009/06/why-are-safaris-tabs-upside-down/
2番目以降のタブがアクティブになると、ウインドウコントロールの背景も含め1番目のタブがグレーアウト状態になります。これだとウインドウコントロールまでが1番目のタブの一部であるかのように見えてしまいますが、かといって見た目が凸凹しすぎるとかえってよくないので、これはこれで分かるような気がします。
インアクティブなタブにマウスカーソルを乗せると隠れていたクローズボタンが浮かび上がります。Safari 3まではすべてのタブにクローズボタンが常時見えるように配置されていましたが、Safari 4 beta ではアクティブなタブのみ常時見える形に変更されています。
インアクティブな1番目のタブでマウスオーバーすると、クローズボタン、タブを掴めることを示すアイコンが浮かび上がる
Safari 9 ではタブのクローズボタンは基本隠れていて、マウスオーバーで表示されるようになっています。
タブの移動・ウインドウ化
タブの右上にあるアイコンをつかんでタブを並び変えることができます。そのまま下方向に持っていくとタブから別ウインドウに分離することもできます。この辺りは現在では当たり前の機能ですね。当時はタブを直接掴んで並び替えるという仕組みはほとんど見られないものだったので、このようにして「掴めること」を示すインジケータを配置していたのだと思われます。実際、タブそのものは掴めず、インジケータ部分のみしかドラッグすることができません。現在ではほとんどのユーザーがタブとはドラッグして並び替えられる、ウインドウ化できると認識しているので、もはやそれを示すアイコン自体が消え去っています。
タブの並べ替え
タブのウインドウ化
ツールバー・ブックマークバー
基本的なバーを隠すと一見標準的なウインドウのようになりますが、タイトルバーはタブバーが同居しているのでよく見ると割とインパクトのある構造であることがわかります。
すべてのバーを隠した状態
ブックマークバーのみ表示した状態
すべてのバーを隠して、複数タブを並べた状態
ブックマークバーのみ表示して、複数タブを並べた状態
ディレクトリー階層の遡上
Cocoa のドキュメントベースアプリケーションでは、ウインドウのタイトルバーを ⌘+クリックまたは右クリックすることで階層を遡ることができます。Finder などに実装されているものですが、Safari ではサイトのディレクトリー階層を遡るための機能として提供されていました。Safari 4 beta では本来のウインドウタイトルバーがなくなってしまったため、この機能が利用できなくなっています。
Safari 4 beta: タイトルを右クリックしても、タブのコンテクストメニューが表示される
Safari 6: タイトルを右クリックすると、Finder のようにディレクトリーを遡ることができる
現在の Safari 9 ではもうこの機能は利用できません。そもそも今の時代では web サイトのアドレスがそのままディレクトリーを表しているとも限らなく、うまく機能しないことの方が多いために削除されたのでしょう。
タブを限界まで並べた場合
タブをウインドウ幅限界まで並べるとタブだらけになります。タブは伸縮するので横幅がとても短くなります。アクティブなタブだけはある程度の幅を保ちます。
マウスオーバーでクローズボタンを表示した様子
限界を超えると右端に『…』ボタンが追加され、ここをクリックするとはみ出たタブをメニューから選ぶことができます。
Safari 4 beta: はみ出たタブを表示するメニュー
Safari 6: はみ出たタブを表示するメニュー
Safari 9: スクロール可能なタブバー
その他見た目の違い
タブのフォント
タブのフォントには当時の Mac OS X のシステムフォントである Lucida Grande が使われていますが、Safari 4 beta では Bold でさらに少し小さいサイズとなっています。タブの根元がカーブしてくっついているような見た目なのでタブの高さは実際の見た目よりも短くなっており、その分クローズボタンやラベルが少しだけ上に移動しているようです。それに合わせてフォントにも調整が加えられているように思えます。
Safari 4 beta: タブ
Safari 6: 標準のウインドウタイトルバー
読み込み中の様子
読み込み中にはリロードボタンがプログレスインジケーターに変化します。
アドレスバー右端にプログレスインジケーターがある
Safari 6 ではアドレスバーそのものにプログレスバーの役割がある
Safari 9 では iOS 風の細いプログレスバーがアドレスバーの下端に敷かれている