BEST252014-09-29TweetPocket最近はPhotoshop不要論にも見られるように、Webデザインもブラウザ上でやってしまうことも少なくないようです。そこまでいかなくても、HTMLやCSSの修正程度は普通にブラウザでやっているんですよね。ここではブラウザ上でのWeb開発をさらに便利にするFireFox向けアドオンを紹介します。25本FirebugWeb制作にFireFoxを使うならなくてはならないアドオン。HTMLやCSS、Javascriptの編集をブラウザ上で行う際に便利です。YSlowFirebugと合わせて入れておきたいのがこちら。Webサイトのパフォーマンス解析に使います。FirePHPPHP開発をするならこれも入れておきたいです。Firebugのコンソール画面でPHPのログを見ることができます。FireQueryjQueryを使う方はこちらも入れておきたいアドオン。FirepickerこちらはFirebugにカラーピッカー機能を追加するアドオン。FirebugでCSSのスタイル編集がさらに便利になります。ColorZillaこのFireFoxアドオンを入れることで、Webページのカラーをチェックできます。参考サイトのカラーチェックなどで使うと便利。DeveloperWebブラウザ上でjavascriptのオンオフやCSSの編集などができるアドオン。これ1つ入れておけば様々なことができます。MozページのSEO解析ができるアドオン。ページオーソリティやドメインオーソリティの測定ができて、リンクの解析もやってくれます。SEO調査をしたいときに便利。extensionGoogleRankなどSEOに関する様々な情報を表示してくれるFireFoxアドオン。Webマーケティングをしているなら是非入れておきたいツールです。ValidatorHTMlのバリデーションをしてくれるアドオン。W3Cのサイトに行かなくてもこのツールで簡単にバリデーションできます。MeasureItWebサイトに配置されているコンテンツの幅や高さなどを調べるならこのアドオンが便利。SwitcherPCブラウザでモバイルサイトを見たいときなどに便利なアドオン。ユーザーエージェントを変えることで簡単にスマホサイトのチェックができます。FireFTPFireFoxにFTP機能を追加できる素晴らしいアドオン。リモートサーバーへのアップロードが簡単に行えるようになります。JSONViewJSONコードをブラウザで見ることができるFireFoxアドオン。PhotoshopWeb上に配置している画像をサクッと編集したい。そんな希望を叶えてくれるのがこのアドオン。これを使えばWeb上にある画像をPhotoshopで開くことができます。ChartこちらはWebサイトのソースを見やすいツリー形式で表示してくれるもの。Firebugなどでもソースを見れますが、もうちょっと見やすくしたい・・・というときに便利。Tab)FireFoxでIEの表示を確認したいときはこれを使います。最近はIEでも開発者向けツールが搭載されてるのでそちらと合わせてチェックしておくと良いでしょう。Plusこちらはページのスクリーンショットを撮るときに使うアドオン。範囲指定だけでなく、ページ全体のスクリーンショットもとれるので便利です。Firefoxこちらもスクリーンショットを撮影するためのアドオン。撮影したあとに書き込みなどができます。ManagerPC内のSQLデータベースを閲覧、編集できるアドオン。phpMyAdminのような機能を使うことができます。CSVでエクスポートにも対応。HeadersHTTPヘッダー情報をみることができるFireFoxアドオン。FinderこちらのアドオンはWebページ上のフォント情報を表示してくれるもの。サイトで使用されているフォントを調べたいときにおすすめです。名前の通りQRコードを作成することができるアドオンです。Webサイトではよく、「PC版はこちら」などでQRコードを表示することがありますが、このFireFoxアドオンを使えば簡単に作成可能。GhosteryGhosteryはWeb上の見えない情報をチェックしてくれるツール。GoogleAnalytycsや広告のビーコンなどどんなスクリプトがデータを取得してるかなどを見ることができます。Suiteやっぱりセキュリティも大事!このアドオンなら偽装サイトなどの不正なスクリプトから守ってくれます。SugimoriフリーランスのWebエンジニア。現在はテンプレート職人としてTetraThemesでテンプレートを開発中。ブログや個人に関するお問い合わせはTwitterかFacebookへ。2017-06-26Webに必須の高品質な写真素材を無料でダウンロードできるサイトを10本集めてみました。Web制作に限らずWebライティングでも必ず必要なのが写真素材。2017-06-21カラーミーショップはスマホでもECショップを構築できる手軽さと、HTMLやCSSを編集しオリジナルデザインのショップを作成できる拡張性を両方兼ね備えたECサービス。2017-06-21カラーミーショップは初心者でも簡単にショップを開設できるECサービス。HTMLやCSSの編集も可能なので完全オリジナルデザインのショップを自由に構築することができます。2017-06-19カラーミーショップは初心者でも簡単にショップを開設できるECサービス。HTMLやCSSの編集も可能なので頑張ればオリジナルデザインのショップを構築することも可能です。2017-06-16カラーミーショップはHTMLとCSSの編集ができ、オリジナルデザインのショップを構築することができるECサービスです。USTetraThemesはWordpressやカラーミーショップ、EC-CUBEのテンプレートの販売、CMSのカスタマイズ方法、Bootstrapの使い方などWeb制作に関する記事を書いているサイトです。