Posted by : Izumikawa Fukumi 2014年1月28日火曜日

Web開発を行う時に特に便利な物でブラウザに標準搭載しているのが開発者向けツールです。
ブラウザごとに開発者向けツールの機能は異なります。

そこで今回はこの開発者向けツールを比較してみたいと思います。



比較対象となるブラウザは、


  1. Internet Explorer9
  2. Google Chrome
  3. Mozilla Firefox

どちらも有名なブラウザですね。この3種類のツールを比較致します。


Internet Explorer

これはWindowsをお持ちの方には馴染みのあるブラウザではないでしょうか?
Microsoftが提供している最悪のブラウザーです。

日々開発者を悩ませ続けているとても有名な物です。


多分[ Internet Explorer9 ]ぐらいから開発者向けツールが搭載されていると思います。
7あたりから私は使っていませんので詳しくは分かりませんが(・・;)





F12キーを押せば出てきます。

日本語表記でとても分かりやすい形になっています。

機能としては、
DOM Explorer コンソール デバッガー ネットワーク UIの応答 プロファイラー メモリ 
エミュレーションこの項目があります。これでも十分使えるとは思いますが、
私のPCのスペックではなかなか重くて動作しません。orz


ただ初心者向けとしては機能は十分です。


Google Chrome

私は基本このGoogle Chromeの開発者向けツールを利用しています。



機能は私が知らない様な機能もまだあるらしく、基本私が日常的に使うとしたら、
要素の幅を測ったり、余白など調べたりしていますね。

JavaScriptでの動作確認も手軽に出来るので私の中では一番いいツールだと思います。


Mozilla Firefox

私は基本このブラウザ自体は表示確認用として使っています。



このブラウザも機能が凄いです。
初めて使った時はビックリしましたね!!

レスポンシブデザインモードと言うのがあり、自由にブラウザの幅を変えて表示確認が出来ます。









各ブラウザの開発者向けツールの機能を知っていればこれから先使う事があるかもしれません。
なので知っていて損はないと私は思います。




- Copyright © I aim to creator. - Hatsune Miku - Powered by Blogger - Designed by Johanes Djogan -