2022/05/17(火) [n年前の日記]
#1 [pc] Webページの見た目をそのまま印刷したい
昨日、某所の方から電話で相談を受けた。「Microsoft Edge でWebページを印刷しようとすると、見た目と全然違う印刷結果になる。どうにかならんか」みたいな。
おそらく、ディスプレイに表示される際の見た目と、印刷される際の見た目が、違う状態になるCSSが指定されているWebページを印刷しようとして、そうなってしまったのだろうけど…。たしかに、どうにかできるならどうにかしたい。
そんなわけで少しググってみたけれど、Webページの見た目を、そのまま一旦画像にして、その画像を印刷する、という拡張機能があるらしい。awesome screenshot という拡張機能らしいけど…。元々は Google Chrome 用の拡張機能として公開されていたけれど、Microsoft Edge用にも移植されている模様。
_素晴らしいスクリーンショットとスクリーンレコーダー - Chrome ウェブストア
_Microsoft Edge アドオン - 仕事効率化
ただ、日本語名が…。「素晴らしいスクリーンショットとスクリーンレコーダー」って…。その拡張名はどうかと…。まあ、自動翻訳がそのまま表示されているのだろうけど。
試しにインストールして試用してみたけれど、たしかにコレを使えば、ブラウザで表示されてる見た目そのままで、ページが印刷できるように見えた。
ちなみに、関連情報をググっていたら、この拡張機能は開いているサイトの情報をどこかに送信している、という話を見かけた。2014/08頃の話。
_Awesome Screenshot が閲覧したサイトのURLを収集している疑い - 秋元@サイボウズラボ・プログラマー・ブログ
使う場合は自己責任で。
おそらく、ディスプレイに表示される際の見た目と、印刷される際の見た目が、違う状態になるCSSが指定されているWebページを印刷しようとして、そうなってしまったのだろうけど…。たしかに、どうにかできるならどうにかしたい。
そんなわけで少しググってみたけれど、Webページの見た目を、そのまま一旦画像にして、その画像を印刷する、という拡張機能があるらしい。awesome screenshot という拡張機能らしいけど…。元々は Google Chrome 用の拡張機能として公開されていたけれど、Microsoft Edge用にも移植されている模様。
_素晴らしいスクリーンショットとスクリーンレコーダー - Chrome ウェブストア
_Microsoft Edge アドオン - 仕事効率化
ただ、日本語名が…。「素晴らしいスクリーンショットとスクリーンレコーダー」って…。その拡張名はどうかと…。まあ、自動翻訳がそのまま表示されているのだろうけど。
試しにインストールして試用してみたけれど、たしかにコレを使えば、ブラウザで表示されてる見た目そのままで、ページが印刷できるように見えた。
ちなみに、関連情報をググっていたら、この拡張機能は開いているサイトの情報をどこかに送信している、という話を見かけた。2014/08頃の話。
_Awesome Screenshot が閲覧したサイトのURLを収集している疑い - 秋元@サイボウズラボ・プログラマー・ブログ
使う場合は自己責任で。
◎ ブラウザの標準機能でキャプチャ。 :
一応、今時のWebブラウザは、標準機能でWebページを画像としてキャプチャすることができる。
Firefox 100.0.1 x64 の場合、ページの中で右クリックしたら、メニューの中に「スクリーンショットを撮影」という項目があった。Ctrl + Shift + S でもキャプチャできるらしい。
_Firefox 上でスクリーンショットを撮る | Firefox ヘルプ
Microsoft Edge 101.0.1210.47 x64 も、ページの中で右クリックして、「Webキャプチャ」を選べばいい。あるいは Ctrl + Shift + S。
_Microsoft Edge - Webページ全体をスクリーンショット撮影する方法 | PC設定のカルマ
ただし、一旦Webページを一番下までスクロールさせないと、途中にある画像が表示されないWebページもあったりするので、そういったページをキャプチャすると、画像部分が空白状態になったりする。上記の解説ページは、まさにそういう例だった…。
Vivaldi 5.2.2623.46 x64 も、キャプチャ機能を持っている。ウインドウ左上のアイコンをクリックしてメニューを出して、ツール → キャプチャー、で色々選べる。あるいは、ステータスバー上のカメラのアイコンを ―― 「ページキャプチャー」アイコンをクリックしてもいい。
_スクリーンキャプチャー | Vivaldi Browser Help
Google Chrome も機能を持っているらしい。
_「Google Chrome」にスクリーンショット機能がこっそり実装 〜さっそく使ってみよう - やじうまの杜 - 窓の杜
_WEBサイトのキャプチャーはChrome実装機能を使うのが安全で簡単！ - おっさんポスト
ただ、隠し機能だから設定のカスタマイズが必要とか、Webページ全体のキャプチャはできないとか、開発ツールモードにしないといかんとか、他のブラウザと比べると…。うーん。
何にせよ、Webブラウザ上に表示されたページの見た目を、そのまま画像としてキャプチャする機能は、多くのWebブラウザが持っているので、そのキャプチャ画像をイイ感じに分割して印刷できるツールさえあれば、「Webページの見た目そのままで印刷したい」という要望は満たせそう。
一応、画像を分割して印刷できる、PosteRazor というツールがあることを知ったのだけど。
_PosteRazor - Make your own poster!
_PosteRazor - Make your own poster! download | SourceForge.net
Webブラウザでキャプチャした画像を、このツールに持っていくまでの流れが、一般の方々(?)にとっては面倒臭いと思われそうな気もする。
ペイント、あるいはExcelを使って画像を複数ページで印刷する方法も見かけた。
_縦に長い画像を分割して印刷する方法（Windows） - ウェブ屋の備忘録
_長い画像を簡単に印刷する方法｜スタッフブログ｜デジタルバンク株式会社
_長い画像を分割して印刷したいときはエクセルが便利 | バシャログ。
ペイントを使うやり方を試してみたけど、たしかにこれでも目的は果たせそう。ただ、これもまた、一般の方々には以下略。
Firefox 100.0.1 x64 の場合、ページの中で右クリックしたら、メニューの中に「スクリーンショットを撮影」という項目があった。Ctrl + Shift + S でもキャプチャできるらしい。
_Firefox 上でスクリーンショットを撮る | Firefox ヘルプ
Microsoft Edge 101.0.1210.47 x64 も、ページの中で右クリックして、「Webキャプチャ」を選べばいい。あるいは Ctrl + Shift + S。
_Microsoft Edge - Webページ全体をスクリーンショット撮影する方法 | PC設定のカルマ
ただし、一旦Webページを一番下までスクロールさせないと、途中にある画像が表示されないWebページもあったりするので、そういったページをキャプチャすると、画像部分が空白状態になったりする。上記の解説ページは、まさにそういう例だった…。
Vivaldi 5.2.2623.46 x64 も、キャプチャ機能を持っている。ウインドウ左上のアイコンをクリックしてメニューを出して、ツール → キャプチャー、で色々選べる。あるいは、ステータスバー上のカメラのアイコンを ―― 「ページキャプチャー」アイコンをクリックしてもいい。
_スクリーンキャプチャー | Vivaldi Browser Help
Google Chrome も機能を持っているらしい。
_「Google Chrome」にスクリーンショット機能がこっそり実装 〜さっそく使ってみよう - やじうまの杜 - 窓の杜
_WEBサイトのキャプチャーはChrome実装機能を使うのが安全で簡単！ - おっさんポスト
ただ、隠し機能だから設定のカスタマイズが必要とか、Webページ全体のキャプチャはできないとか、開発ツールモードにしないといかんとか、他のブラウザと比べると…。うーん。
何にせよ、Webブラウザ上に表示されたページの見た目を、そのまま画像としてキャプチャする機能は、多くのWebブラウザが持っているので、そのキャプチャ画像をイイ感じに分割して印刷できるツールさえあれば、「Webページの見た目そのままで印刷したい」という要望は満たせそう。
一応、画像を分割して印刷できる、PosteRazor というツールがあることを知ったのだけど。
_PosteRazor - Make your own poster!
_PosteRazor - Make your own poster! download | SourceForge.net
Webブラウザでキャプチャした画像を、このツールに持っていくまでの流れが、一般の方々(?)にとっては面倒臭いと思われそうな気もする。
ペイント、あるいはExcelを使って画像を複数ページで印刷する方法も見かけた。
_縦に長い画像を分割して印刷する方法（Windows） - ウェブ屋の備忘録
_長い画像を簡単に印刷する方法｜スタッフブログ｜デジタルバンク株式会社
_長い画像を分割して印刷したいときはエクセルが便利 | バシャログ。
ペイントを使うやり方を試してみたけど、たしかにこれでも目的は果たせそう。ただ、これもまた、一般の方々には以下略。
[ ツッコむ ]
以上です。