FirefoxをアドオンでカスタマイズしてSafariの長所を色々取り入れる

管理人は長いことSafariを使っていたわけですが、デバッグツールやDOMなど、強力な開発系アドオンがFirefoxに比べて極端に少ないため、先日Firefoxへブラウザの乗り換えをしました。
個人的にはSafariの外観と使い勝手は好きなので、その辺を極力引き継がせたカスタムFirefoxの作成です。

FirefoxをSafari化したい事項

  • 外観をSafari風に
  • アドレスバーにプログレスバーを
  • [command] + [F]で検索したときに、グレーアウト・ハイライト機能
  • 更新ボタンと停止ボタンを統合
  • PDFをブラウザ内で直接表示(Acrobatプラグインではなく、Preview並みの軽快さで)
  • 入力フォームのリサイズ機能
  • タブの移動のショートカット
  • [command] + [1](数字)でブックマークバーを直接呼び出し

上記のカスタマイズで、だいぶSafariの使い勝手そのままになりました。加えてFirefoxのプラグインの豊富さ!

外観をSafari風に

使用テーマ:GrApple:http://www.takebacktheweb.org/

まずは見た目をSafari化します。入れるものはテーマです。
DeliciousとYummyの2種類。色はgraphiteとblueがあります。違いはタブの向きと選択したときの縁の色です。OSのアピアランスにあわせると良いと思います。私はYummyのblueを使用。

アドレスバーにプログレスバーを

使用プラグイン:Fission:https://addons.mozilla.org/ja/firefox/addon/1951

Safariでは読み込み中に、アドレスバーに色がつきます。それを再現。
読み込み中かどうか、視覚的にわかりやすくなります。色を変えたり、テクスチャで置き換えることもできます。

Command + Fで検索したときに、グレーアウト・ハイライト機能

使用プラグイン:XUL/Migemo:https://addons.mozilla.org/ja/firefox/addon/5239

もともとは、ローマ字のまま日本語をインクリメンタル検索するためのツールですが、検索結果のハイライト機能も充実しています。これをSafariのハイライト機能の代替えに使用。辞書をインストールしないと機能しません。設定画面も併せて紹介。

グレーアウトした様子。[command] + [F]の後、[command] + [G]で次候補へ送れます。

検索ツールバーの位置を「タブの下」にすると、Safariの検索イメージに近くなります。「上」でも同様ですが、ソースコードを検索する際 [command] + [F]が効かなくなりますので、「タブの下」に設定します。
通常のFirefox検索だと、ハイライトのみで、グレーアウトが効きません。Migenoのモードで検索をする必要がありますので、検索モードのデフォルトを「Migeno」に設定します。
クイックMigemo検索を終了の部分で、デフォルトでショートカットが「ESCAPE」となっています。SafariではESCAPEで終了できましたのでこのままいじらず設定を残します。ちなみに、Firefoxデフォルト動作の[command] + [F]でも検索を終了することができます。

更新ボタンと停止ボタンを統合

使用プラグイン:Stop-or-Reload Button:https://addons.mozilla.org/ja/firefox/addon/313

SafariではStopボタンはReloadと共用です。これをFirefoxにも取り入れます。シンプルになると共にスペースの節約にも繋がります。

PDFファイルをブラウザ内で直接表示

使用プラグイン:Quartz PDF Plugin:http://code.google.com/p/firefox-mac-pdf/

MacのFirefoxでPDFファイルを開く際、プレビューやAdobe Readerなどで別窓で開いてしまいます。Firefoxの中で開けるようにします。余計なツールバー等が出ない分、動作は軽快です。右クリックで設定等は可能なので実用上は問題なし。

入力フォームのリサイズ機能

使用プラグイン:Resizeable Textarea:https://addons.mozilla.org/ja/firefox/addon/3818

Safari3からテキストエリアのリサイズが可能になりました。テキストエリア、サイトによっては狭かったりします。こんな時ドラッグで広げられる機能です。Firefoxはこのアドオンでテキストエリアを広げることが可能になります。

タブ移動のショートカット

使用プラグイン:Keyconfig 20080929:http://forums.mozillazine.org/viewtopic.php?t=72994

Firefoxで、ショートカットを自在にカスタマイズするプラグインです。これでタブ移動のショートカットを置き換えます。
ちなみに、Firefoxデフォルト動作の [command] +[1](数字)はタブ移動なので、このショートカットはSafariデフォルトの「ブックマークバー呼び出し」に置き換えます。

設定の仕方

  1. アドオンをインストール
  2. 「ツール」→「キーボードショートカットのカスタマイズ…」を選択
  3. 上にあるリストから「Keyconfig」を選択
  4. 「新しいキーを追加」をクリック
  5. 任意の名前を入力
  6. 右にある「Global」にチェックを入れる
  7. Codeを記入してOKを押す。
  8. あとはショートカットキーを直接押して「適用」ボタンを押す

こんな流れになります。コードの記述方法は以下に。

◎左のタブへ移動
コードの記述:

gBrowser.mTabContainer.advanceSelectedTab(-1,true);

ショートカット割り当て:[command] + [Shift] + [←] ◎右のタブへ移動
コードの記述:

gBrowser.mTabContainer.advanceSelectedTab(1);

ショートカット割り当て:[Command] + [Shift] + [→]

[command] + [1](数字)でブックマークバーを直接呼び出し

使用プラグイン:Keyconfig 20080929:http://forums.mozillazine.org/viewtopic.php?t=72994
FirefoxでCommand +1(数字)だと、タブの呼び出しになります。これをSafariの挙動「ブックマークバーを呼び出し」に擬似的に変更します。
要は”ショートカットキーで特定のサイトを呼び出す”動作を実現します。コードの記述方法は以下に。

例)Command + 1 でYahoo! Japanを呼び出す場合
コードの記述:

if(window.loadURI) loadURI(getShortcutOrURI('Yahoo',{}));

ショートカット割り当て:[command] + [1] さらに、ブックマークしてあるYahoo! Japanで「情報を見る」を選び、キーワードに「Yahoo」と入力

例)[command] + [2] でGoogleを呼び出す場合
コードの記述:

if(window.loadURI) loadURI(getShortcutOrURI('Google',{}));

ショートカット割り当て:[command] + [2] さらに、ブックマークしてあるYahoo! Japanで「情報を見る」を選び、キーワードに「Google」と入力。

仕組みとしてはキーワードがマッチするものを特定のショートカットキーで呼ぶことができます。
注}デフォルトで [command] + [1] と [command] + [2] はタブ移動なので、それらは消去しておきます。

URIの中身は普通にホームページアドレスでも良いので、応用として[command] + [G] でGmailを呼び出すなんて事も可能です。


Safariの機能を持ったFirefoxのできあがり

Jimdo

オススメ書籍

10日でSEO&アクセスアップ Jimdoデザインブック

かっこいいだけではなく、人が集まるホームページを作る!

「Jimdo」(ジンドゥー)でのホームページの作成方法と運用方法を解説した書籍。解説記事を順番に読み進めて行くことで、Jimdoを使ったホームページの作成・運用・宣伝・集客の基本を、10日間で習得するのが本書のコンセプトです。12章構成の解説の中で、Jimdoの基本操作とホームページの作成、デザインとコンテンツ(内容)のレベルアップ、そしてSEOやリスティング広告を含む宣伝・集客の基本を解説しています。

コメントを残す

メールアドレスが公開されることはありません。

CAPTCHA


ABOUTこの記事をかいた人

株式会社マジカルリミックス 代表取締役CEO/JimdoExpert 宮城県出身。コンピューター系の専門学校を卒業後、仙台のデザイン会社に入社。 Webサイトのデザイン・コーディングをはじめとし、各種デジタルメディアのデザインに従事。2002年退職後すぐにマジカルリミックスを創業。2007年に法人化で株式会社マジカルリミックスを設立。Webサイト運用に関するコンサルティング、社内向けITトレーニング、セミナー出演、執筆など。2005年から仙台の専門学校で、非常勤講師としてWeb制作講義を担当。 主な著書に『10日で作るかっこいいホームページ Jimdo(ジンドゥー)デザインブック』(エムディエヌコーポレーション)『HTML5+CSS3の新しい教科書 基礎から覚える、深く理解できる。』(共著、同)『基礎から覚える、深く理解できる。Webデザインの新しい教科書』(同)。