「便利ツール」カテゴリーアーカイブ

HTML、CSS、JavaScriptのデバッガツール「Firebug」のインストール手順

通常ブラウザにはF12押下でブラウザ標準の開発ツールが使用可能となりますが、今回紹介する「Firebug」は高性能なJavaScriptデバッガツールです。JavaScriptだけではなくHTMLやスタイルシートの値をリアルタイムに変更して確認したり、非同期通信状況やDOMの状態などの詳細情報確認も簡単に可能となります。

Firebugの特徴

  • Firefox専用のアドオン
  • JavaScriptのデバッグ
  • 非同期通信の状況確認
  • DOMやスタイルシートの設定状況確認

Firebugのインストール手順

  1. FireFoxを起動し、メニューの「ツール」→「アドオン」を選択します。
  2. アドオンマネージャのメニュー「アドオン入手」画面で検索ボックスへ「firebug」と入力して検索します。
  3. 検索結果に「Firebug x.xx.x」と表示されますので「インストール」ボタンを押下してインストールします。
  4. インストール終了後、デバッグしたい画面を開いてブラウザの右上に追加された「虫アイコン」をクリックすれば虫アイコンに色がついてFirebugが起動します。

WinShotのインストール手順と使用方法

画面キャプチャを1操作で簡単に保存出来るソフト「WinShot」のインストール手順と使用方法をご紹介します。
「WinShot」を起動するとタスクトレイに常駐しますので、事前にホットキーを設定しておけばCtrl+PrintScreen押下だけで画面キャプチャを連番付で自動保存という事も可能となります。開発現場などでテスト証跡を取得する際に重宝されるソフトの一つです。

WinShotの特徴

  • フリーソフト
  • 対応OS:Windows 95/98/Me/NT/2000/XP ※Windows7でも問題なく動作してます。
  • 画面キャプチャーを撮った直後に印刷・保存
  • 撮った直後のキャプチャー画像を専用ビューワーで表示し、印刷/加工処理を行うことも可能

ダウンロード先

    下記サイトへアクセスし、セットアップ版をクリックしてダウンロードします。
    WinShot公式サイト

インストール手順

  1. ダウンロードしたexeファイルをダブルクリックしてインストーラを起動します。
  2. 「次へ」ボタンを押下します。
  3. インストール先を選択して「次へ」ボタンを押下します。
  4. ショートカットを作成するフォルダを指定し「次へ」ボタンを押下します。
  5. 「デスクトップにアイコンを作成する」へチェックし、「次へ」ボタンを押下します。
  6. 「インストール」ボタンを押下しインストールを開始します。
  7. 「終了」ボタンを押下すればインストール完了です。

WinShot設定例

  1. WinShotを起動し、タスクバーのWinShotアイコンを右クリックして「環境設定」を選択します。
  2. 「基本設定」タブを選択し、ファイル自動保存の保存先をデフォルトの保存先を削除し、任意の保存先を追加します。また、保存ファイル名の接頭語、連番の桁数、連番の開始番号もここで指定します。
  3. 「ホットキー」タブを選択し、「JPEGで保存(アクティブウィンドウ)」、ホットキー「Alt + PrintScreen」を選択して「OK」ボタンを押下すれば設定終了です。
  4. 後は何かアクティブウィンドウを表示して「Alt + PrintScreen」を何度か押下すれば指定したフォルダへ画面キャプチャが連番付で保存されます。

WinMergeのインストール手順

テキストベースのファイルやフォルダの相違点を比較出来るソフト「WinMerge」のインストール手順です。
※2014年04月06時点での最新バージョンは「2.14.0+-jp-37」になるようです。

WinMergeのインストール手順

  1. 以下サイトへアクセスし、WinMergeのインストーラ用exeファイルをダウンロードします。
    WinMerge日本語サイト
  2. ダウンロードした「WinMerge-2.14.0+-jp-37-x64-Setup.exe」をダブルクリックしてインストーラを起動します。
  3. セットアップウィザードが表示されたら「次へ」ボタンを選択します。
  4. 「次へ」ボタンを選択します。
  5. インストール先のフォルダを指定して「次へ」ボタンを選択します。
  6. インストールするコンポーネント(今回は「フルインストール」を選択します。)を選択し、「次へ」ボタンを選択します。
  7. プログラムグループを指定(デフォルトのままでOK)し、「次へ」ボタンを選択します。
  8. お好みに応じて追加タスクを選択し、「次へ」ボタンを選択します。
    ※通常は「エクスプローラのコンテキストメニューに追加」と「デスクトップ上にアイコンを作成」にチェックすれば十分です。
  9. 「インストール」ボタンを選択します。
  10. 「次へ」ボタンを選択します。
  11. 「完了」ボタンを選択すればインストール作業は完了となります。

Google検索オプションを利用した各種検索方法

例えば、あなたが訪問したホームページでこの用語でサイト内検索したいけどサイト内検索ボックスが設置されてなくて検索出来ない!と思うことがあると思います。こういう場合はGoogleの検索オプションを使用すると簡単にサイト内検索が実施出来ます。検索オプションは他にも色々と用意されているので覚えておくと便利かも。

No検索オプション用途(概要)使用例
1allintitle:ページのタイトルのみを検索対象とします。allintitle:資格
2allinurl:指定したURLを検索対象とします。allinurl:write-remember.com
3cache:キャッシュされた文書内で検索語を強調表示します。cache:write-remember.com
4define:クエリの先頭に 「define:」 と付けると、
その後に書かれた単語群の定義を検索します。
define:資格
5filetype: 指定した種類のファイルのみ表示します。filetype:pdf
6info:指定したウェブページについてのバックグラウンド情報を
表示します。
info:write-remember.com
7intitle:ウェブページのタイトルでのみ検索します。intitle:資格
8inurl:URLに含まれるべき単語に一致するページを表示します。inurl:write
9site:指定したドメイン内でのみ検索する。(サイト内検索用)site:write-remember.com "資格"
資格 site:write-remember.com
10stocks:株式市場での銘柄略称として検索します。site:google
11related:指定したウェブページに「似ている」ウェブページを
一覧表示します。
related:write-remember.com

エクスプローラをタブ化出来る「QTTabBar」

今回はエクスプローラをタブ化してくれるツール「QTTabBar」をご紹介します。これを導入すれば、ブラウザと同様に一つのウィンドウで複数のフォルダを開く事が可能となります。なお、動作させる為には「.NET Framework 4」が必要となります。

対応OS

  • Windows7(64bit)、Windows8(64bit)、Windows8.1(64bit)

バージョン

最新版:ver.262 ※更新日:2013/12/6

ダウンロード先

「QTTabBar」ダウンロード

インストール手順

  1. ダウンロードしたファイルを任意のフォルダへ解凍します。
  2. 解凍したフォルダ内にある「QTTabBar.exe」をダブルクリックしてインストーラを起動します。
  3. インストーラに従い、QTTabBarをインストールします。


  4. Windowsを再ログイン又は再起動します。
  5. エクスプローラを起動し、メニューの「表示」→「ツールバー」を選択し、「QTボタンバー」と「QTタブバー」を選択すればエクスプローラがタブ化されます。

特徴

  • ブラウザのタブ機能と同レベルの高機能
  • タブグループを作成すると一度に複数のフォルダを開く事が可能
  • プラグインを追加できる多機能ボタンバー
  • ツールバーはカスタマイズ可能

画面上のカラーコードを簡単に取得出来るツール「FE – Color Palette」

FE – Color Palette

Webページを作成していると背景色や文字色を変更する際、画面上のこの色に合わせたいなあと思うことが良くあるかと思います。
こういう場合には「FE – Color Palette」というフリーソフトを使用するとカラーコードが簡単に取得出来るので非常に便利です。

ダウンロード先

FE – Color Palette Ver.1.12 (LZH形式・42.1KB)

使用方法

  1. ダウンロードしたファイルを任意のフォルダへ解凍します。
  2. 解凍したフォルダ内にある「FE – Color Palette.exe」をダブルクリックして起動します。
  3. 「画面の色」ボタンを押下すれば現在ディスプレイに表示されているカラーコードの取得が可能となります。

特徴

  • 画面上でイメージをリアルタイムに確認できる。
  • HSV形式・RGB形式での色指定が可能。
  • 128個のパレットをもち、さらに自由にパレットを作成・保存することができる。
  • 作成した色は、目的に合わせた形(HTML、RGBマクロ、DWORD)で簡単にクリップボードにコピーできる。
  • 画面上の任意の点の色を取得することができる。
  • 使いやすいユーザーインターフェース。
  • ファイルサイズが小さく、動作も軽快。
  • 外部ファイルは一切必要としない。

.icoファイルへの変換ツール「ToYcon」

このサイトのicoファイルを作成しようと探してたら便利なツールを発見。

画像ファイルをドラッグ&ドロップしただけでicoファイルを生成してくれます。

<ソフト名>

「ToYcon」

<ライセンス>

フリーウェア

<ダウンロード先>

https://www.snapfiles.com/downloads/toycon/dltoycon.html

<インストール方法>

ダウンロードしたファイルを解凍するだけでOKです。
※「ToYcon.exe」をダブルクリックすればToYconが起動されます。

<日本語化>

    1. 下記サイトから「日本語ランゲージファイル」をダウンロードします。

      https://www.snapfiles.com/downloads/toycon/dltoycon.html

    1. ダウンロードしたファイルを解凍し、「Japanese.lng」ファイルをToYconの「lang」フォルダ下へ配置します。
    2. ToYconを起動後、左クリックし「Languages」→「Japanese」を選択すればメニューが日本語になります。

<主な機能>

・png、jpgなどの画像ファイルをドラッグ&ドロップだけで.ico形式へ変換してくれるツール。

・複数のファイルをまとめてドロップすることも可能。

・作成するアイコンをマルチプルアイコンにすることも可能。

・対応しているファイル形式:PNG、BMP、JPG、TGA、GIF。

・作成するアイコンのフォーマット

4、8、32bit

128×128、96×96、72×72、64×64、48×48、32×32、24×24、16×16