新・元地方の中規模印刷会社で苦悩するWebデザイナー改めWebディレクターの日記

自由な20代、窮屈な30代を経て、遂に40代になっちまったWebディレクター&パソコン講師の覚書と思う言(こと)。略称【ちほちゅう】

*

Webサイトのスクリーンショットに最適「Pixlr Grabber」

   

  • このエントリーをはてなブックマークに追加

1年以上前の記事です。内容が古い可能性があります。

Webサイトのリニューアル等のお仕事を頂いた時などに便利なのが現サイトのスクリーンショット付きのサイトマップ。
これをベースにここを変えていくといいですよという話をしていくのだが、実はページボリュームのあるサイトなどだとスクリーンショットを撮るのが結構大変。
というのも、Webサイトの各ページは大概が縦に長く1画面に収まらないから。
で、スクリーンショットを分割してそれをPhotoshop上でつなぎ合わせる作業が必要となってくる。

スポンサーリンク
 

これが意外と大変で、ブログの記事を書くときなどにもやっているのだが結構な時間を取られてしまう。

そこで、ちょっと探してみるとそれを自動でやってくれちゃうアプリがあった。
「Pixlr Grabber」というこのアプリ。ブラウザの機能拡張として配布されていて、FirefoxとGoogleChrome用の2種類がある。
が、それぞれ、基本的な機能は変わらない模様。
■ Grabber

□ Pixlr Grabber :: Add-ons for Firefox (Firefox用アドオン)
□ Chrome ウェブストア – Pixlr Grabber – Screen capture/image grabbing (GoogleChrome用エクステンション)

で、これを使うと、ページ全体のスクリーンショットが簡単に取れる他、通常のスクリーンショット、そしてトリミングしてスクリーンショットを撮ることができるのだ。

それぞれちほちゅうのトップページでやってみるとこんな感じ。
以下、GoogleChrome版を使用。

Pixlr-Grabberメニュー
インストールすると右上に「G」の入ったアイコンが表示される。
こちらのプルダウンメニューからそれぞれメニューを選ぶ。

まずは通常のスクリーンショット。(メニューの一番上「Grab visible part of page」を選択)
Pixlr-Grabberセーブ
保存メニュー(共通)がでるので「SAVE」をクリック。

できたもの。
4fd4b6fbd535cf3f0700000a

次にトリミングしてのスクリーンショット。(メニュー上から2番目「Grab a difind area」を選択)
Pixlr-Grabberトリミング
トリミング後「Crop」をクリックで上記同様保存メニューが出るので「Save」をクリック。

できたもの。
4fd4b735d535cf4316000002

最後にまとめて1ページのスクリーンショット。(メニュー上から3番目「Grab the entire page」を選択)
Pixlr-Grabberページ繋ぎ合せ
長いページだと時間がかかりますが自動でスクリーンショットをつなぎあわせてくれます。
作業後、保存メニューが出るので「Save」。

できたもの。
4fd4b757d535cf4321000001
長くてすみません。
が、これが「Pixlr Grabber」の目玉機能。

といった具合にページ単位でスクリーンショットを撮るときに便利な「Pixlr Grabber」。
これはWebディレクターでなくブロガーとしても是非インストールしておきたいアプリですね。

 - おススメ, 告知・紹介・ニュース

アドセンス広告メイン

Message

メールアドレスが公開されることはありません。

  関連記事

docomo(ドコモ)から子ども向け「ジュニアスマホ(SH-05E)」登場!うちのはもう子どもじゃないからiPhoneで

1年以上前の記事です。内容が古い可能性があります。うちの子も4月から中学生になる …

プロレスラー三沢光晴さん逝く 【今週のトピック】

1年以上前の記事です。内容が古い可能性があります。まずは訃報から。 □プロレスの …

新感覚のWebパズル。「Google Puzzle」に挑戦

1年以上前の記事です。内容が古い可能性があります。以前、自分参加のミュージックビ …

コンプガチャのダメージなし。DeNAはまだまだ伸びている

1年以上前の記事です。内容が古い可能性があります。球団を買い、今年からプロ野球界 …

自動運転の宅急便「ロボネコヤマト」藤沢市の一部でスタート

1年以上前の記事です。内容が古い可能性があります。え、時代はもう、ここまで進んで …

「Adobe Creative Cloud」に新プラン、「Photoshop CC」が月1000円

1年以上前の記事です。内容が古い可能性があります。ホームページ制作に使うツールと …

「うでたて道場」で筋トレ【iPhoneアプリ】

1年以上前の記事です。内容が古い可能性があります。いやぁ。いろいろ考えますねぇ。 …

no image
iPhoneがコントローラ「AR.DRONE」でコンテスト。1位はラスベガス旅行

1年以上前の記事です。内容が古い可能性があります。iPhone(アイフォーン)が …

これは目覚める。スマホを振りまくらないと止まらない目覚ましアプリ「Wake N Shake Alarm Clock」

1年以上前の記事です。内容が古い可能性があります。さて、新年です。明日からは仕事 …

選挙の裏ワザ「支持政党なし」という名前の政党が存在する

1年以上前の記事です。内容が古い可能性があります。裏ワザというのはファミコンだけ …

血液型オヤジ