HOME > ブラウザ > View Source Chart[Firefox Add-on]

View Source Chart[Firefox Add-on]

View Source ChartはFirefoxのための拡張機能で、ウェブページのソースコードを
HTMLのタグバウンダリー単位で色分けされたチャートにして出力します。


機能紹介

  • ソースコード内のHTMLのタグバウンダリーがグラフィカルに表示されます。
  • ソースコード内のタグのネストや、構造、および階層構造を明確にします。
  • ボックス部分をクリックすると、タグバウンダリー単位でソースコードの折りたたみが可能です。

サンプル

改行のない、以下のソースに対してView Source Chartを実行すると、

<html><head></head><body><div><table><tbody><tr><td><blockquote><span><ul><li><p>
sample</p></li></ul></span></blockquote></td></tr></tbody></table></div></body></html>

以下のように表示されます。

ViewSourceChart

Firefox Add-ons特集に戻る

ダウンロード・インストール

ViewChart」は2008年5月現在、以下のサイトからFirefoxを使用してダウンロード出来ます。

View Source Chart 2.5.03

※有料のView Source Chart 2.6.02も存在します。こちらはjavascriptのコード内部も含めて、
ソースの折りたたみが可能です。

ダウンロードが終了すると、自動的にソフトウェアインストール窓が立ち上がるので、
「今すぐインストール」をクリックし、インストールを開始してください。

アドオンを追加するとFirefoxの再起動が求められます。
再起動後、Firefoxのツールバーの[ツール]をクリックし、[アドオン]を選択します。
アドオン一覧の中に、View Source Chartがあれば、インストールは成功です。


インストール時の設定

チャートを出力するときに、タブとして出力するか、別ウインドウで出力するかを選択します。
初期設定のままだと、別ウインドウで出力します。
インストール後も、Firefoxのツールバーの[ツール]をクリックし、[アドオン]を選択し、
View Source Chartの[設定]をクリックすることにより、いつでも設定が可能です。


起動手順

ページを右クリックして現れるメニュウからView Source Chartをクリックすることによって実行します。
設定によって、別ウインドウ、または別のタブにチャートが出力されます。


停止手順

別ウインドウ、または別のタブを閉じます。



ショートカットキー

  • Ctrl + - (CTRLキーとマイナスーの同時押し)
    テキストサイズを小さくすることにより、チャートをズームアウトします。
    ズームアウトによりドキュメント構造を、より広い範囲で見られるようになります。
  • Ctrl + + (CTRLキーとプラスキーの同時押し)
    テキストサイズを大きくすることにより、チャートにズームインします。
  • Ctrl + 0 (zero) (CTRLキーとゼロキーの同時押し)
    テキストサイズを通常に戻します。
  • Ctrl + F(CTRLキーとFキーの同時押し)
    指定文字列でチャート図内の検索が出来ます。
  • Ctrl + W(CTRLキーとwキーの同時押し)
    ウインドウをクローズします。
  • Ctrl + S (CTRLキーとSキーの同時押し)
    チャート図をディスクに保存します。

Firefox Add-ons特集に戻る


『WEBサイト制作者に役立つメルマガ』発行!