僕はデフォルトブラウザにFirefoxを使っています。
ただ、新しいFirefox Quantumになってからというもの、どうしてもアドオンの使用感に納得がいきませんでした。
仕方ないので、レガシーアドオン(古いアドオン)が利用できるPale Moon、Waterfox、Cyberfoxなどを利用することで騙し騙し利用してきました。
最初はそれでもよかったんですが、どうしても古いアドオンを利用しているせいか、時が経つにつれ不具合も目立ってきました。
で、先日重要だったレガシーアドオンが使えなくなったのを契機に、「これダメかも…、もう一度Firefox Quantumに挑戦してみるか…」と試してみることに。
結果、思っていたよりも代替アドオンが出ていて、Firefox Quantumもかなり使えるようになっていました。
そんなわけでレガシーFirefox系からFirefox Quantumに乗り換えたので、移行手順を備忘録用にメモがてら紹介です。
目次
Firefox Quantumで導入したアドオン
新しいFirefoxで導入したアドオンです。
僕の場合、Firefoxの主な利用目的は、Wordpress開発なので、それになるべく最適化できる設定にしているつもりです。
ツリー型タブ (Tree Style Tab)
僕がFirefoxを使う最大の理由は、「タブをツリーで管理したいから」なので、このアドオンは必須です。タブをツリーで管理できるのと出来ないのでは、作業効率が全然違うので。
Glitter Drag
テキストD&Dで検索したり、リンクD&Dで別のタブで開いたりするためのアドオン。
「ツリー型タブ」アドオンとの相性が最も良い(新しくタブをD&D開いたときに子タブとして開かれる)ため、これも手放せません。
設定画面はこんな感じ。
ScrollAnywhere
背景をマウスでつかんでグリグリとスクロールさせることが出来るアドオン。
スマホのスワイプみたいな感じで操作できます。慣性スクロールの設定も可能。
新しいタブでリンクを開く Open Link with New Tab
リンク属性に合わせて.リンクの開き方を設定できるアドオン。
User-Agent Switcher
ユーザーエージェントを切り替えてWEBの動作確認をするためのアドオン。
以下のようなユーザーエージェントを選択できます。
Seerobots
ページのnoindex、nofollow状態をソースコードを見なくても視覚的に分かりやすく表示してくれるアドオン。
NoFollow
こちらもページのnoindex、nofollow状態を分かりやすく表示してくれるアドオンです。
こちらは、nofollowリンクをハイライト表示してくれます。Seerobotsとどちらを使うかは好み。
Open With
Firefoxで現在開いているページを、他のブラウザですぐに開けるようにするためのアドオンです。
WEB制作中のブラウザー間動作チェックに非常に便利。
ただ、Firefox Quantumになったら、Pythonとコマンドプロンプトを使用して初期設定する必要があって少し面倒。
Open in Private Mode
現在開いているページをプライベートモードで一発で開くボタンが追加されます。
プライベートモードは、ブラウザキャッシュを適用したくない動作確認時に便利です。
Format Link
Make Link代替のタグ生成補助アドオン。
使い方にクセがあるのでMake Linkより使いづらい部分もあるけど、今はこれしかないっぽい。
FoxReplace
WEBページの入力ボックス内容などをブラウザから置換できるアドオン。
WordPress記事作成時などにも便利。
Popup ALT Attributes
画像にマウスカーソルを乗せるとAlt属性値をポップアップ表示してくれるアドオン。
画像のAlt属性チェックに便利。
ColorZilla
マウスカーソル部分のカラーコードを取得できるカラーピッカー。
Flagfox
Webサイトのサーバーの場所を表す国旗を表示し、サイトの安全性確認やWHOIS、翻訳、似ているサイト、妥当性の確認、URL短縮といったツール群を提供してくれるアドオン。
フィッシングサイトの判別などにも。
headingsMap
HTML5のアウトライン構造を見やすく表示してくれます。また、セクション構造も視覚的に表示してくれるので分かりやすい。
HTTP/2 Indicator
サイトでHTTP/2通信が行われている場合は、分かりやすくアイコンを表示してくれるアドオン。
Enhancer for YouTube™
YouTubeの装飾をしてくれるアドオン。僕は、動画を自動再生させない設定を行うために利用しています。
Google Translator for Firefox
選択したテキストとページ全体をGoogle翻訳で翻訳します。
SimilarWeb – トラフィックランク & ウェブサイト分析
他サイトの大まかなアクセス情報を見ることが出来る、サイト分析ツール。
Greasemonkey
スクリプト管理マネージャーです。
サイトごとに動作するスクリプトを変更したり、自分でスクリプトを書いて制御したりすることも可能です。
Stylish – ウェブサイト用カスタムテーマ
サイトごとのCSSを制御するためのアドオンです。
文字が小さすぎるサイトの文字を大きくしたり、表示させたくない部分を非表示にするなんてことも可能です。
はてなブックマーク
Firefoxではてブサービスを手軽に使うためのアドオン。
AutocopySelection2Clipboard
選択テキストを自動的にコピーしてくれるアドオン。
テキストリンク (Text Link)
Webページに書かれたURI文字列を、ダブルクリックするだけで開けるようにしてくれるアドオン。
Firefox設定の調整
アドオンで動作を制御できない部分は、Firefoxの詳細設定で行います。
詳細設定を行うには、アドレスバーに”about:config”と打ち込んで開きます。
すると「動作保証対象外になります!」と出るので「危険性を承知の上で使用する」ボタンを押します。
すると以下のような画面が表示されるので、ここから設定を行います。
ブックマークを常に新しいタブで開く
「browser.tabs.loadBookmarksInTabs」で検索し、値を「true」にします。
検索ボックスからの検索結果を新しいタブで開く
「browser.search.openintab」で検索し、値を「true」にします。
外部アプリからリンクを開いた場合Firefoxにフォーカスを移さない
「browser.tabs.loadDivertedInBackground」で検索し、値を「true」にします。
WordPressローカル環境等もSSLエラーを出さずに開く
僕はWordpressローカル環境にLocal by Flywheelを使用しているのですが、SSLで開くときに、サーバー証明書がなくてSSLエラーが出ました。そうなった場合の対処方法(例外設定できない際の対処法)も書いておきます。
「network.stricttransportsecurity.preloadlist」で検索し、値を「false」にします。
その他の設定
Firefoxのプロファイル設定を変更します。
上部のタブを非表示にする
ツリー型タブで「サイドバーにタブを表示しているので上部にタブは必要ない」なんて時の設定です。
この部分のタブを消します。
まずはFirefoxメニューの「ヘルプ」を開きます。
「トラブルシューティング情報」メニューを開きます。
「アプリケーション基本情報」にある「プロファイルフォルダー」項目にある「フォルダーを開く」をクリックします。
するとプロファイルフォルダーがエクスプローラーで開かれます。
プロファイルフォルダー内に「chrome」フォルダーを作成します。
フォルダー内に、「userChrome.css」ファイルを作成してください。
作成したファイルを開いて以下のCSSコードをコピペして保存してください。
/* タブバーを非表示にする */ #tabbrowser-tabs { visibility: collapse !important; } /* サイドバーのヘッダも非表示にする場合はこちらも */ #sidebar-header { visibility: collapse; }
保存したら、Firefoxを再起動してください。
再起動後にタブが消えているかと思います。
参考 Firefox Quantum(57以上)で上部のタブバーを消す – Qiita
Firefox Quantumに変更した感想
Firefox Quantumにして感じた利点と難点。
良かった点
Firefox Quantumをしばらく使ってみて良かった点を挙げるとこんな感じ。
- ページの読み込みが速い
- タブを閉じた後の動作が速い(タブ周り動作が高速)
- 新しいFirefoxを使える安心感(更新的な意味で)
Firefox Quantumを使ってみての一番の利点は、やはり動作の軽快さかと思います。
特に、「タブを閉じた後にメモリの解放のためにしばらく固まる」なんてことはなく、すぐに次の動作に移れるのは、ありがたいです。
レガシーFirefoxでもタブを1つか2つしか開かなければ、そんなに動作も遅くは感じません。けれど、どうしてもWEB制作などをしていると、いくつもタブを開いてしまうので、余計な待ち時間が減ったのは助かります。
難点
古いFirefoxの方が良い点もわずかですがあります。
- デベロッパーツールにFirebugを使えない
- アドオンバー(下段のツールバー)が使えない
- ページを開こうとするとCSSが反映されない不具合が結構ある
- 速いと言っても動作が固まる時はある
- 多くタブを開こうとすると、たまに全く読み込まれないものもある
感じた難点はこんな感じでしょうか。
Firebugを使いたいのは、以下のようにデベロッパーツールをブラウザ幅一杯に使えるからです。
新しいFirefoxだと、ツリー型式タブを利用すると、以下のようにデベロッパーツールの作業領域が狭まります。
ほんのこれだけの作業領域の違いなんだけど、結構一覧性が下がって使いづらくなってしまいます。
この一点だけを除けば、ほぼほぼFirefox搭載のデベロッパーツールに不満はないのだけど、これを何とかする方法は見つからなかった。
あと、新しいFirefoxは、アドオンバー(フッターツールバー)が使えないのも地味に痛いです。
ここに情報を表示できるのは、やっぱりありがたい。
とは言っても、「Firefox Quantumにした難点は、このぐらいで済んだ」と言えるぐらいの範囲で済んだかも。
まとめ
Firefox Quantumが公開されたのが2017年11月です。
当時使用した感想としては「古いアドオンが使えなくてかなりキツイ…」という印象でした。
けれど現在までの間、改善、代替アドオンの公開、代替設定方法の共有、が進んで個人的にはほぼほぼ遜色ないところまで来た感じはします。
レガシーアドオンを使えるFirefoxは、機能面では十分なんだけど、だんだんアドオンも使えなくなるし、何より重い。そういったことを総合的に考えると、Firefox Quantumにした方が良いかなという判断になりました。
何せFirefox Quantumは、今後新たにアドオンも出てくるでしょうし、不具合があってもどんどん改善されていくでしょう。そして何よりも、タブ周りの動作が速いのは、かなりのストレス軽減。
これまでWEB制作の動作確認をするのに、「動作を確認している時間」よりも、「処理待ちをしている時間」の方が遥かに長かったような気がします。
今回Firefox Quantumにしたことにより、それが半々ぐらいにはなったと思います。