ウェブページ保存ツール|画像生成と会話するAIの魅力と可能性
https://note.com/chat_gpt777/n/n3739442a1016
ウェブページを単一のHTMLファイルとして保存できるツールを作成しました。主な機能は以下の通りです:
🚀 主要機能
📄 完全なページ保存
HTML、CSS、画像をすべて単一ファイルに統合
外部リソースへの依存なし
🖼️ 画像のインライン化
すべての画像をBase64エンコードしてHTMLに直接埋め込み
JPG、PNG、GIF、SVGなど主要な画像形式に対応
🎨 スタイルの統合
外部CSSファイルを取得してHTMLに直接埋め込み
元のデザインを完全に保持
📱 使いやすいUI
モダンでレスポンシブなデザイン
進捗表示とステータス通知
ワンクリックダウンロード
💡 使用方法
保存したいウェブページのURLを入力
「ページを保存」ボタンをクリック
処理が完了したら「HTMLファイルをダウンロード」をクリック
🔧 技術的特徴
CORS対応: プロキシサーバーを使用してクロスオリジン制限を回避
エラーハンドリング: 個別リソースの取得エラーでも全体の処理が続行
ファイル名自動生成: ドメイン名と日時を含む分かりやすいファイル名
保存されたHTMLファイルは完全に自己完結型で、インターネット接続なしでも正しく表示されます。ローカル保存やアーカイブ用途に最適です。
ウェブページ保存ツール
https://pasopia.velvet.jp/2025/soft/index0037.html
下記のような拡張機能もあります。
ウェブブラウザで閲覧中のウェブサイトをページ中の画像も含めて保存したいと思ったときに、HTMLファイルと画像ファイル・スタイルシートが別フォルダになることなく、単一のHTMLファイルとして保存できる
ブラウザ拡張機能が「SingleFile」です。
HTMLに写真(画像)やCSSなどのリソースをすべて1つのファイルにまとめる方法は、一般的に以下のように呼ばれます:
■ 呼び方:
単一HTMLファイル(Single HTML File)
Self-contained HTML
オールインワンHTML
データURI化されたHTML(特に画像やCSSなどをBase64で埋め込む場合)
方法:
主に以下のような手順で実現します。
1. 画像をBase64で埋め込む(Data URI方式)
2. CSSやJavaScriptも <style> や <script> タグ内に直接書く
3. 外部フォントや動画もBase64にして埋め込めるが、ファイルサイズに注意
自動でまとめるツール:
手作業でもできますが、次のようなツールを使うと便利です。
SingleFile(ブラウザ拡張機能)
→ ChromeやFirefoxで使える。Webページをすべてまとめて保存してくれる。
閲覧中のウェブページ全体を単一のhtmlファイルとしてダウンロード&注釈付けも可能な「SingleFile」レビュー
https://gigazine.net/news/20220306-singlefile/
SingleFile(Chrome)
https://chromewebstore.google.com/detail/singlefile/mpiodijhokgodhhofbcjdecpffjipkle?hl=ja

