WEBデザインとかコーディングとか検品のお供に
Firebug
ステキ度:★★★★★
この子がいなかったら作業効率落ちてます毎日使ってます愛してます結婚したいでs。
これはスーパーひとし君級。WEBデザイン及びコーディングする時には必要不可欠なアドオン。
知りたい箇所で、右クリックをして「要素を調査」を選択すればツリー形式でその部分を中心にソースが出てきます。WEB関係の方には有名なアドオンですね。
ステキ度:★★★★★
サイトをみていて「この色コード知りたいな」ってときに、ColorZillaを使えばその色を簡単にスポイトで拾って色コードをコピーすることが出来ます。昔から愛用してます。アドオンをいれると右下にスポイトのアイコンが出てくると思うので、
右クリック > オプション > 採取した色情報を自動的にコピー
を有効にすると、コピーの仕方がRGB形式だったり16進数形式だったりを選べます。ちなみに僕は「#」なしの16進数形式です。(Photoshopのカラーコードにそのまま貼れるからデス)
Pearl Crescent Page Saver Basic
ステキ度:★★★★★
今見ているサイトをまるっとスクリーンショットしてくれるアドオン。
「ページ全体」か「今見ている範囲(表示部分のみ)」かを選べるし、JPEGかPNGや画像の質やFlashコンテンツの有無なんかも設定できて便利です。最近は、気に入ったページを撮ってEvernoteで保存してたりと大活躍してます。そうです、スーパーひとし君です。
IE Tab Plus
ステキ度:★★★★☆
Internet Explorerをいちいち開かなくても、firefoxでIEの見た目が確認できちゃうアドオン。
IEでしかみれないページやブラウザチェックのときに役立ちますね。
ただ、macユーザの方は使えないのです…シュン…。
脱線しますが、IEのブラウザ検証は僕の場合、VMwareにwindowsをいれて仮想環境で検証しています。(最近はMacばかりでお家のどでかいデスクトップはアダルトビデ○オをみるときに活躍するくらいです)
LinkChecker
ステキ度:★★★★☆
その名の通り、現在開いているページのリンクすべてをチェックしてくれるアドオン。
ちゃんとリンクされているところは背景が緑に、リンク切れのところは赤く表示されてとわざわざクリックしなくてもボタン一発でわかっちゃいます。大量にリンクが貼ってある時なんかは役立ちますね。昔、ある大手の案件を運用していたときによく使っていました。
ステキ度:★★★★☆
FirefoxではALTをポップアップ表示してくれないので、このアドオンをいれとくとIEと同じように実装してくれます。これでALT抜けもある程度は防げるかもわからないですね。
MeasureIt
ステキ度:★★★★☆
ブラウザ上で、メジャーを用いて幅や高さを計ることができるアドオン。
この幅いくつくらいだろう?と思ったときにパパッと手軽に計れるので入れておくと便利。
colorSuckr
ステキ度:★★★☆☆
カラースキームを自動生成してくれるアドオン。
インストール後、画像を右クリックして「Extract Image Colors」をクリックすればカラースキームが出てきます、色コードもわかります。
だいたいこのくらいの色味かな?で変に近似色を多用してしまうよりは、同じ色を使って統一感を持たせたほうがいいですよね。
ステキ度:★★★★☆
現在ブラウザで表示してるページのjavascriptを無効にしたり、CSSを切ったりできるアドオン。
WEB開発者にはうってつけのアドオンですね。
Yet Another Window Resizer
ステキ度:★★★★☆
ウィンドウのサイズを指定の解像度に素早くリサイズ出来るアドオン。
横幅1280px、1440px、1680pxなどユーザによって解像度が違いますので、それらの検証のときに重宝します。好きな解像度を自分で設定することもできますよっ!
ブラウジングの日々をより豊かに
FireGestures
ステキ度:★★★★★
マウスジェスチャーです。進む、戻る、タブを閉じる、タブを複製あたりは全部マウスジェスチャーで操作してます。Sleipnirを使っていた時から、僕の中ではマウスジェスチャーは必須となりました。これもスーパーひとし君級。
SBMカウンタ
ステキ度:★★★★★
これステキ。はてなブックマークやdeliciousブックマークやlivedoorブックマークといったソーシャルブックマークを一括表示してくれるアドオン。
海外記事はdeliciousを、日本の記事ははてブ数を参考にいつも閲覧しています。
AutoPager
ステキ度:★★★★★
googleで検索したときに、いちいち2ページ目3ページ目をクリックして次のページいくのってなにげに面倒じゃないですか?たぶん、コイキングをギャラドスに進化させるくらいまでの手間はありますよね。それを解決してくれるアドオンです。不思議なアメで一気にギャラドスにしちゃいましょうってことです。(解りにくくなってすみません言いたいだけです)アメーバでブログ見たりする人は、トップに1記事しか表示してない芸能人とか結構いるんでかなり重宝するかもですね。
ちなみに、AutoPagerはのちほど紹介するGreasemonkeyでもできますのでお好みのほうでどうぞ。
Tab Mix Plus
ステキ度:★★★★★
Firefoxのタブのサイズ調整や多段表示などを可能にしてくれるアドオンです。
マウスのホイールクリックをした時やダブルクリックした時のアクションなどもカスタマイズできます。
ステキ度:★★★★☆
Webサイトで用いられているフレームワークやJavaScriptライブラリなんかをリストしてくれるアドオンです。wordpressやjoomlaなどのCMSで作られたサイトも、このアドオンが入っていれば一目でわかりますよっ。
僕は、FirefoxからChromeユーザになり、またFirefoxに戻った口なんですが、Chromeを使っているときに「Chrome Sniffer」っていうエクステンションが気に入っててソレに似たアドオンがfirefoxにもないかなと探して見つけたのが、このWappalyzerです。
Quick Translator
ステキ度:★★★★☆
翻訳アドオン。選択部分の翻訳も、ページ全体の翻訳も可能。
デフォルトは言語が英語になってましたっけ?ブラウザ右下に出てくる翻訳パネルをクリックすると日本語にかえられます。あ、あとデフォルトでは、確か選択すると自動的に翻訳されるようになってますが、毎回翻訳したいわけではないのでそれも設定で変更できます。
翻訳パネル右クリック > 設定 > 一般 > テキスト選択の翻訳ボタンを表示 に変更
範囲選択すると、モンスターファームのスエゾーみたいな小柄なアイコンがポインタ下に出てくるのでそれをクリックすれば右下に翻訳された文言が現れます。
All-in-One Sidebar
ステキ度:★★★★☆
サイドバーにブックマークやらアドオンやらダウンロード履歴やらを表示するアドオンです。
サイドでもいろいろと管理できるようになるのでアドレスバーがごちゃごちゃしすぎないようにサイドに配置したりして使い分けてます。
ステキ度:★★★★☆
ユーザーサイドスクリプトを追加することでよく見るサイト(twitterなど)を自分好みにカスタマイズできるアドオン。ぐりもんぐりもん。僕は主にGoogleReaderをはてなブックマーク数の表示や色分けなどカスタマイズして使ってます。二十歳街道まっしぐらさんのブログで詳しく紹介されていますので、こちらを参考にしてみて下さい。多分使いこなしている方にとってこのアドオンは無くてはならない存在、そう、スーパーひとし君なんだと思います。
ステキ度:★★★★☆
例えば、「タイトル名 – URL」とか「<a href="URL" title="タイトル名" target="_blank" class="exLinks">タイトル名</a>
」のように簡単にHTML形式等でリンクを生成してくれます。カスタマイズできますのでお好みに合わせて作成するといいでしょう。ブロガーさんとかtwitterでWEB情報をつぶやく方には必須のアドオンですね。
Make Link
ステキ度:★★★★☆
タイトルとURLを読み取り<a>
リンクを作成してくれるアドオン。
これを使いこなせば少しなりともコーディングがはやくなるかも!?
ソーシャル的なソレとか情報収集とか
Echofon for Twitter
ステキ度:★★★★★
firefox内で使えるtwitterクライアントです。
いろいろとクライアントを使いましたが、メインはこれに落ち着きました。
UIはシンプルでいて、複数のアカウントを簡単に切り替えられることと、公式RTと非公式RT共に対応していることがこのアドオンを使う決め手となっています。
Yoono
ステキ度:★★★★★
Twitter, Facebook, MySpace, YouTube, Flickrなどのソーシャルネットワークを統合して新着情報を知らせてくれるアドオン。これら多数を個々に管理するのに億劫だという方には最適です。UIも直感的に使えてとってもわかりやすい。
また、twitterアカウントも複数管理できますので、Echofonの挙動がちょっとおかしいときのために並行して使っています。
ステキ度:★★★★★
Evernoteはまだそこまで使いこなせていないのですが、WEBサイトの気になった箇所を簡単にクリップして保存出来るのでスゴく便利です。これから、ブログを書いてネタをアウトプットしていこうと思っているので、ネットをみていて目についたネタはすかさずEvernoteにタグ付けして放り込んでいます。音声や動画なんかもクリップできるんですって、Evernoteすごい。
Evernoteの便利な活用方法は、Webクリエイターボックスさんの、WebデザイナーにおすすめのEvernote活用術の記事がすこぶる解りやすかったです。
ステキ度:★★★★☆
僕はブラウザのブックマークで管理しているのであまりはてなブックマークは使用していないのですが、はてブ管理の方には必須(?)のアドオン。一発ポチッとクリックするだけで簡単ブクマ。
セキュリティとかバックアップとか同期とか
ステキ度:★★★★★
WEBでのパスワード管理と言えばこれ。
僕は1passwordとログイン情報をダブル管理してますがLastPassのが使ってる気がします。
ステキ度:★★★★☆
JavaScript や Java アプレットの実行、プラグインの起動を、信頼したサイトのみに許可してクロスサイトスクリプティング (XSS) 攻撃とやらを防いでくれるアドオン。
とりあえずセキュリティ対策のため入れといて損なし。
FEBE
ステキ度:★★★★☆
アドオンやその設定、パスワード、ブックマーク、履歴などをバックアップして、リストアできちゃったりするアドオン。
定期的なバックアップもとれるのでいざという時のためにいれといたほうが良いかもわかりません。
あれば、なにげに便利!
bit.ly preview
ステキ度:★★★☆☆
bit.lyオンマウスすると、リンク元がわかるという優れもの。
ウイルスページの短縮URLを作ったりするいけづな人がいたりするので、クリックせずに一度確認したいなって人は是非いれちゃいましょう。ただ、ポップアップで出てくる元リンク表示によってクリックの妨げになるのが玉に瑕だったりすると個人的に思っている。
XUL/Migemo
ステキ度:★★★★☆
すごいんですよ、ブラウザ検索(Ctrl(またはCommand)+F)のときにアルファベット入力で、「kanji」って入力すると、「感じ」とか「漢字」とか「幹事」が検索できちゃうんです。「全角かな」で入力するはずが、「半角英数」のまま検索しちゃうことってよくあると思うんですが、このアドオンさえ入っていればアルファベットでもちゃんと検索されますので便利です。
ふりがなインジェクター
ステキ度:★★★★☆
ニュース記事とか読んでるときに読み方のわからない漢字ってたまぁにでてきますよね。
そんなとき、このアドオンが入っていればその漢字をドラッグして選択し、右クリックから「ふりがな」→「ふりがなを振る」をクリックすれば漢字の右隣にルビを振ってくれます。いちいち、googleとかで検索して読み方を調べる手間が減りました!
(その漢字の意味まで知りたい場合には、さすがに調べるんですけどね…)
CacheViewer
ステキ度:★★★☆☆
Firefoxのキャッシュってみづらいんですよね、それを一発で解決してくれるアドオン。Flaファイルをキャッシュから覗いたりするときにときどき使います。(最近はあまり使わないかな…)
このへんはノーマルひとし君。
まとめ
いかがでしたか?他にもまだまだ便利なアドオンが多数あります、「やりたいこと アドオン」とかでググってみると意外と見つかったりしますので是非探してみて下さい。
みなさん、快適なネットライフを!!
※ ちなみに、アドオン入れすぎるとかなり重くなりますのでご注意を。
そして、まだ出来て間もないブログですが、これから僕が便利だなと思ったWEBに関する情報や面白ネタ、そしてこのブログ名ともなっています「和み(NAGO)をクリエイト(CRE)する」をコンセプトに命名しましたNAGOCREにちなみ、和の情報を自分の勉強とともに少しずつアウトプットできればと思っていますので、どうぞ温かい目で見守っててやって下さいまし。