Webデザイナー用Firefoxエクステンション

 

Web Developer Toolbar

Webデザインを行うWebデザイナーにはの必須ツールです。CSSオフやブロックの要素を枠で表示するなど、HTMLデータのデバッグには最適のツール。Webのタグ表記を評価するサイトにそのままジャンプすることも可能で、Webを追及する人にはかかせない機能となっています。

HTMLをちょっと触ったことがある人より、XHTMLとCSSで専門的にやっている人にお勧めです。


インストール:
https://addons.mozilla.org/firefox/60/

 

Google Pagerank extension for Firefox

Google PR検索サイトが検索結果を表示する時にページランクというものを重視します。
ページランクとは有名サイトなどからリンクが張られているかなどの様々な条件からサイトの重要度をランクをつけています。これらは検索結果の表示順位などに大きく関わるものでサイト運営者にとっては大変重要なものです。


インストール:
http://turi2.net/cont/firefox/ffp003.html

 

Oprera View

OperaFirefoxの右クリックからOpera画面に表示させることができます。Webデザインレイアウトがブラウザによって崩れていたり、JavaScriptがきちんと動作しているのか確認するために使用します。

また、このエクステンションにはOperaのインストールが必要です。



インストール:
https://addons.mozilla.org/firefox/1190/




 

IE Tab

IE Tab

FirefoxのエンジンをIEに切り替えることによって、Firefox上からIEとして見ることができます。ブラウザ別の表示や、ブラウザ別のレイアウトの確認に必須です。



インストール:
http://turi2.net/cont/firefox/ffp004.html





 

Load Time Analyzer


Webページへのアクセス時間やイベント数を表示してくれます。これによってクライアントの通信時間等を調べることが可能です。負荷が高いとおもったらこのエクステンションで確認しましょう。


インストール:
https://addons.mozilla.org/firefox/3371/

 

その他の有効なエクステンション

  • AspellFox  - スペルチェッカー
  • Total Validator  - HTML Validator
  • SEO for FireFox  - GoogleとYahooの検索結果にSEO的に便利な情報を追加
  • HttpLiveHeaders - ヘッダー情報を表示
  • View Cookies - クッキーを表示
  • ViewSourceWith - 使い慣れたエディタでソースを表示
  • Performancing - ブログ投稿機能をFFに組み込み
  • No-Referrer  -  リファラなしでページを開く機能を追加
  • User Agent Switcher  - UserAgent を便利に切替
  • EditCSS - リアルタイムにCSS編集
  • FireBug  -  DOMインスペクタ、JavaScriptコンソールなど、全てのフロントエンドエンジニア必須のツール
  • MeasureIt  - ブラウザ内で動作する定規。簡単にサイズを測ることが可能。
  • FireFTP  - FTPクライアント機能を組み込む。
  • ColorZilla - ブラウザ表示領域の色を簡単取得。
  • Copy as HTML Link - 表示中ページのHTMLリンクを作成
 

このカテゴリのその他の記事