[{"data":1,"prerenderedAt":8696},["ShallowReactive",2],{"blog-\u002Fblog\u002Fqr-create-intro":3,"blog-list-ja":264},{"id":4,"title":5,"author":6,"body":7,"category":247,"coverImage":248,"description":249,"draft":250,"extension":251,"locale":252,"meta":253,"navigation":254,"noindex":250,"path":255,"publishedAt":256,"seo":257,"slug":258,"stem":259,"tags":260,"updatedAt":256,"__hash__":263},"blog\u002Fblog\u002Fqr-create-intro.md","QR コードを生成する — \u002Ftools\u002Fqr-create の思想と使い方","Zerosend Editorial",{"type":8,"value":9,"toc":235},"minimark",[10,14,22,26,66,70,84,88,95,98,101,104,126,129,155,158,164,175,178,181,187,198,204,207],[11,12,13],"p",{},"自社サイトの URL を名刺に載せる、Wi-Fi パスワードを会議室の壁に貼る、イベントのアンケート URL をポスターに印刷する。QR コードは、URL や短いテキストを物理空間に橋渡しする便利な手段です。",[11,15,16,21],{},[17,18,20],"a",{"href":19},"\u002Ftools\u002Fqr-create","Zerosend の QR コード生成ツール"," は、QR を作る作業をブラウザ内で完結させます。",[23,24,25],"h2",{"id":25},"主なユースケース",[27,28,29,37,43,49,60],"ul",{},[30,31,32,36],"li",{},[33,34,35],"strong",{},"URL 共有",": ブログ記事やランディングページの URL を QR 化し、チラシ・ポスター・プレゼンスライドに貼り付ける",[30,38,39,42],{},[33,40,41],{},"名刺への掲載",": 個人サイト・SNS プロフィール・連絡先 vCard を QR にして名刺の余白に印刷する",[30,44,45,48],{},[33,46,47],{},"店舗のメニューリンク",": 飲食店やショップがデジタルメニューの URL を QR 化してテーブルに設置する。メニュー変更のたびに紙を刷り直す必要がなくなる",[30,50,51,54,55,59],{},[33,52,53],{},"Wi-Fi 情報の掲示",": SSID とパスワードを ",[56,57,58],"code",{},"WIFI:S:ネットワーク名;T:WPA;P:パスワード;;"," 形式で入力すると、スキャンするだけで接続できる QR が生成できる",[30,61,62,65],{},[33,63,64],{},"社内限定 URL の共有",": 外部に見られたくない社内ポータルや β テストの URL を、外部サーバーに渡さずに QR 化できる",[23,67,69],{"id":68},"png-と-svg-の使い分け","PNG と SVG の使い分け",[27,71,72,78],{},[30,73,74,77],{},[33,75,76],{},"SVG (印刷用)",": ベクタ形式なので拡大しても劣化しない。名刺・ポスター・看板など印刷物には SVG が最適",[30,79,80,83],{},[33,81,82],{},"PNG (Web 掲載用)",": Web ページや SNS への埋め込みには PNG が扱いやすい。サイズ指定のプレビューも確認しやすい",[23,85,87],{"id":86},"なぜブラウザ内で-qr-を作るのか","なぜブラウザ内で QR を作るのか",[11,89,90,91,94],{},"QR 生成サービスの多くは、入力した URL やテキストをサーバーに送って画像を返す形式です。「URL を QR にしただけ」と思いがちですが、",[33,92,93],{},"どの URL を誰がいつ QR にしたかという履歴がサーバーに残り得ます","。",[11,96,97],{},"社内専用 URL、β 版テスト URL、限定公開のアンケート URL などは、外部に知られたくない情報です。Wi-Fi パスワードや連絡先情報をテキストから QR 化する場合、中身がそのまま第三者のサーバーに渡ります。",[11,99,100],{},"Zerosend では QR 生成処理そのものがブラウザ内で完結するため、入力したテキストは一切外に出ません。",[23,102,103],{"id":103},"使い方",[105,106,107,114,117,120,123],"ol",{},[30,108,109,113],{},[17,110,111],{"href":19},[56,112,19],{}," を開く",[30,115,116],{},"テキスト・URL を入力",[30,118,119],{},"出力形式 (PNG \u002F SVG)・サイズ・誤り訂正レベルを選択",[30,121,122],{},"「QR を生成する」をクリック",[30,124,125],{},"画像をダウンロード",[23,127,128],{"id":128},"誤り訂正レベルの選び方",[27,130,131,137,143,149],{},[30,132,133,136],{},[33,134,135],{},"L (Low, 7%)",": 小さい QR にしたいとき。印刷品質が良いなら実用十分",[30,138,139,142],{},[33,140,141],{},"M (Medium, 15%)",": 汎用・標準",[30,144,145,148],{},[33,146,147],{},"Q (Quartile, 25%)",": 名刺・ステッカーなど汚れ・折れが予想される用途",[30,150,151,154],{},[33,152,153],{},"H (High, 30%)",": ロゴ重ね合わせ・屋外掲示で摩耗想定",[23,156,157],{"id":157},"仕組み",[11,159,160,163],{},[56,161,162],{},"qrcode"," という広く使われているブラウザ対応ライブラリを使っています。",[27,165,166,169,172],{},[30,167,168],{},"入力テキストから QR マトリクスを計算",[30,170,171],{},"Canvas に描画 (PNG) または SVG として直接生成",[30,173,174],{},"モジュール数・誤り訂正レベル・色指定に応じて調整",[11,176,177],{},"SVG で生成すれば、拡大縮小しても劣化しないベクタ画像が得られます。印刷用途には SVG がおすすめです。",[23,179,180],{"id":180},"よくある質問",[11,182,183,186],{},[33,184,185],{},"Q. QR に含められるテキスト量は？","\nA. 仕様上は最大 4296 文字 (英数字)、日本語なら 1817 文字程度まで。長くなるほど QR の密度が上がり、スキャン成功率は下がります。URL 短縮サービスの利用も検討してください (ただしサードパーティ依存が増える)。",[11,188,189,192,193,197],{},[33,190,191],{},"Q. ロゴを中央に重ねたい","\nA. 本ツールでは直接対応していませんが、PNG \u002F SVG をダウンロードしたあと ",[17,194,196],{"href":195},"\u002Ftools\u002Fimage-edit","画像編集"," で合成できます。誤り訂正は H にしておくとスキャン成功率が上がります。",[11,199,200,203],{},[33,201,202],{},"Q. 作った QR の履歴は残りますか？","\nA. 残りません。タブを閉じた時点ですべて消えます。",[23,205,206],{"id":206},"関連ツール",[27,208,209,216,221,228],{},[30,210,211,215],{},[17,212,214],{"href":213},"\u002Ftools\u002Fqr-read","QR コード読み取り"," — 生成した QR の検証・他人の QR の中身確認",[30,217,218,220],{},[17,219,196],{"href":195}," — QR にロゴを重ねる合成に",[30,222,223,227],{},[17,224,226],{"href":225},"\u002Ftools\u002Fimage-to-pdf","画像 → PDF"," — 複数 QR を 1 枚にまとめて印刷",[30,229,230,234],{},[17,231,233],{"href":232},"\u002Ftools\u002Ffavicon-generator","ファビコン生成"," — Web サイト向けアイコン素材もブラウザ内で作成",{"title":236,"searchDepth":237,"depth":237,"links":238},"",2,[239,240,241,242,243,244,245,246],{"id":25,"depth":237,"text":25},{"id":68,"depth":237,"text":69},{"id":86,"depth":237,"text":87},{"id":103,"depth":237,"text":103},{"id":128,"depth":237,"text":128},{"id":157,"depth":237,"text":157},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},"tech",null,"Zerosend の QR コード生成ツールは、URL やテキストをサーバーに送らずブラウザ内で QR 画像 (PNG \u002F SVG) に変換します。名刺・ポスター・プレゼン用の QR 作成に。Zerosend 編集部が解説。",false,"md","ja",{},true,"\u002Fblog\u002Fqr-create-intro","2026-04-20",{"title":5,"description":249},"qr-create-intro","blog\u002Fqr-create-intro",[261,262],"QR","ツール","6JpZtRhu832AQp3h_uxIPs5vVv-mxaDe0ZRJBFamLnM",[265,432,628,904,1247,1532,1779,2024,2222,2440,2663,2879,3076,3282,3428,3658,3850,4070,4230,4464,4704,4880,5129,5333,5636,6457,6672,6941,7373,7988,8377,8457],{"id":266,"title":267,"author":6,"body":268,"category":247,"coverImage":248,"description":420,"draft":250,"extension":251,"locale":252,"meta":421,"navigation":254,"noindex":250,"path":422,"publishedAt":423,"seo":424,"slug":425,"stem":426,"tags":427,"updatedAt":423,"__hash__":431},"blog\u002Fblog\u002Fqr-code-business-card.md","QRコード付き名刺を無料で作成する方法｜初心者でも5分で完成",{"type":8,"value":269,"toc":411},[270,274,277,280,283,286,290,293,299,305,311,317,319,322,332,339,343,375,377,381,384,390,396,402,404],[23,271,273],{"id":272},"qrコード付き名刺が今どき求められる理由","QRコード付き名刺が今どき求められる理由",[11,275,276],{},"名刺交換の場面で「URLが長くて打ち込むのが大変」「SNSのプロフィールを伝えたいけど口頭では難しい」と感じたことはないでしょうか。QRコードを名刺に載せておくと、スマートフォンをかざすだけでWebサイト・ポートフォリオ・SNSページへ誘導できます。相手の手間が大幅に減るため、展示会や商談、フリーランスの営業活動など幅広いシーンで活用が広がっています。",[11,278,279],{},"また、QRコードを使うメリットはアクセスのしやすさだけではありません。URLを後から変更したい場合でも、QRコードが指すリンク先（自分のプロフィールページなど）を更新すれば対応できるため、名刺を刷り直す手間を減らせることも見逃せないポイントです。",[11,281,282],{},"一方で「QRコードってどうやって作るの？」「無料でちゃんとしたものが作れるの？」という疑問を持つ方も多いでしょう。結論から言えば、専用ソフトを購入したりデザイン会社に依頼したりしなくても、無料のオンラインツールで十分なクオリティのQRコードが作れます。",[284,285],"hr",{},[23,287,289],{"id":288},"qrコードを無料で作成するときに気をつけたいこと","QRコードを無料で作成するときに気をつけたいこと",[11,291,292],{},"無料ツールは数多く存在しますが、選ぶ際に注意したい点がいくつかあります。",[11,294,295,298],{},[33,296,297],{},"画質・サイズの問題","\n名刺に印刷するQRコードは、画面表示とは異なり一定以上の解像度が必要です。低解像度のPNGしか出力できないツールだと、印刷時にぼやけて読み取りエラーが起きることがあります。SVG形式（拡大しても劣化しないベクター形式）で出力できるツールを選ぶと安心です。",[11,300,301,304],{},[33,302,303],{},"個人情報の取り扱い","\n名刺に載せるURLには、自分のWebサイトや連絡先ページなど、ある程度個人に紐づいた情報が含まれます。ツールによっては入力した文字列をサーバーに送信・ログとして記録しているケースもあるため、プライバシーの観点から確認が必要です。",[11,306,307,310],{},[33,308,309],{},"登録不要かどうか","\nメールアドレス登録やアカウント作成が必須のツールは、手軽さという面でハードルが上がります。すぐに試せる登録不要のツールを選ぶと、作業効率が上がります。",[11,312,313,316],{},[33,314,315],{},"有料機能への誘導","\n「無料で使えると思ったら、ダウンロードだけ有料だった」というパターンも珍しくありません。出力まで完全無料かどうかを事前に確認しましょう。",[284,318],{},[23,320,321],{"id":321},"ブラウザだけで完結する無料ツールを使った作成手順",[11,323,324,325,331],{},"上記の注意点をまとめると、「高解像度出力・プライバシー配慮・登録不要・完全無料」の4条件を満たすツールが理想的です。そのひとつとして紹介したいのが、",[17,326,330],{"href":327,"rel":328},"https:\u002F\u002Fzerosend.site\u002Ftools\u002Fqr-create",[329],"nofollow","QR コード生成ツール","です。",[11,333,334,335,338],{},"このツールの大きな特徴は、",[33,336,337],{},"入力したテキストやURLをサーバーに送信しない","点です。QRコードの生成処理がすべてブラウザ内で完結するため、入力した情報が外部に漏れる心配がありません。名刺に載せるURLや連絡先情報を扱う場合、この「ローカル処理」という仕組みは安心感につながります。",[340,341,342],"h3",{"id":342},"実際の操作手順",[105,344,345,351,357,363,369],{},[30,346,347,350],{},[33,348,349],{},"ツールページを開く","\nブラウザでツールにアクセスします。アカウント登録やインストールは不要です。",[30,352,353,356],{},[33,354,355],{},"テキスト・URLを入力する","\n名刺に載せたいURL（自社サイト、ポートフォリオ、SNSプロフィールなど）を入力欄に貼り付けます。vCard形式のテキストを入力すれば、連絡先情報をまとめてQRコードに埋め込むこともできます。",[30,358,359,362],{},[33,360,361],{},"プレビューを確認する","\n入力と同時にQRコードのプレビューが表示されます。スマートフォンのカメラで試し読みして、正しくリンク先に飛べるか確認しましょう。",[30,364,365,368],{},[33,366,367],{},"ダウンロードする","\n問題がなければダウンロードボタンからQRコード画像を保存します。PNG・SVGなど用途に合わせて形式を選べます。名刺印刷用にはSVGを選ぶと、印刷会社に入稿する際に拡大・縮小しても画質が落ちません。",[30,370,371,374],{},[33,372,373],{},"名刺デザインに配置する","\nダウンロードした画像をIllustratorやCanva、Word、PowerPointなど使い慣れたソフトの名刺テンプレートに貼り付ければ完成です。QRコードのサイズは名刺上で最低でも1.5cm角を確保すると読み取りやすくなります。",[284,376],{},[23,378,380],{"id":379},"名刺qrコードをより効果的に使うための3つのコツ","名刺QRコードをより効果的に使うための3つのコツ",[11,382,383],{},"QRコードを名刺に入れるだけで満足せず、もう一歩工夫すると効果が高まります。",[11,385,386,389],{},[33,387,388],{},"① リンク先をスマートフォン対応ページにする","\nQRコードを読み取るのはスマートフォンがほとんどです。リンク先のページがモバイル非対応だと、せっかくアクセスしてもらっても離脱されてしまいます。リンク前にスマートフォンで表示確認をしておきましょう。",[11,391,392,395],{},[33,393,394],{},"② QRコードの近くに一言添える","\n「詳細はこちらから」「ポートフォリオを見る」など、QRコードの下に小さくテキストを入れると、読み取る動機づけになります。特に年配の方や普段QRコードを使い慣れていない方への配慮として有効です。",[11,397,398,401],{},[33,399,400],{},"③ 定期的にリンク先をチェックする","\nURLが変わった、ページを削除したなどの理由でQRコードが無効になるケースがあります。名刺を大量に印刷する前に、そして印刷後も定期的にリンク先が有効かどうか確認する習慣をつけましょう。",[284,403],{},[11,405,406,407,410],{},"QRコード付き名刺は、紙の名刺とデジタル情報をつなぐシンプルながら強力な手段です。無料ツールを使えば費用をかけずに導入できるので、まだ試していない方はぜひ一度作成してみてください。プライバシーを気にする方には、ブラウザ内処理で安全に使える",[17,408,330],{"href":327,"rel":409},[329],"が選択肢のひとつになるはずです。",{"title":236,"searchDepth":237,"depth":237,"links":412},[413,414,415,419],{"id":272,"depth":237,"text":273},{"id":288,"depth":237,"text":289},{"id":321,"depth":237,"text":321,"children":416},[417],{"id":342,"depth":418,"text":342},3,{"id":379,"depth":237,"text":380},"QRコード付き名刺を無料で作る手順を分かりやすく解説。ブラウザだけで完結するツールを使えば、個人情報をサーバーに送らず安全に作成できます。",{},"\u002Fblog\u002Fqr-code-business-card","2026-05-14",{"title":267,"description":420},"qr-code-business-card","blog\u002Fqr-code-business-card",[428,429,262,430],"業務","プライバシー","Web制作","hrm-tYjDGxrWDI7oF94te57zkkMH6fyHYcsGGqLe9PM",{"id":433,"title":434,"author":6,"body":435,"category":247,"coverImage":248,"description":616,"draft":250,"extension":251,"locale":252,"meta":617,"navigation":254,"noindex":250,"path":618,"publishedAt":619,"seo":620,"slug":621,"stem":622,"tags":623,"updatedAt":619,"__hash__":627},"blog\u002Fblog\u002Fogp-image-size-optimization.md","OGP画像のサイズ最適化ガイド｜SNSでキレイに表示される設定と作り方",{"type":8,"value":436,"toc":610},[437,441,444,451,458,460,464,467,472,486,491,502,507,515,520,525,532,535,537,541,544,549,552,557,560,565,574,579,582,584,588,595,598,601,608],[23,438,440],{"id":439},"ogp画像が崩れる切れる原因はサイズ指定にある","OGP画像が「崩れる」「切れる」原因はサイズ指定にある",[11,442,443],{},"SNSでURLをシェアしたとき、サムネイル画像が途中で切れていたり、極端に小さく表示されたりした経験はないでしょうか。あるいは、自分のサイトをX（旧Twitter）やFacebookに投稿したら、想定と全く違う画像が表示された、というケースもよく聞かれます。",[11,445,446,447,450],{},"こうした問題の多くは、OGP（Open Graph Protocol）画像のサイズが各プラットフォームの仕様と合っていないことが原因です。OGPはHTMLのmetaタグで設定するもので、",[56,448,449],{},"og:image","に指定した画像がSNSカードのサムネイルとして使われます。しかし、画像サイズや縦横比が規定から外れていると、プラットフォーム側でトリミングされたり、表示をスキップされたりします。",[11,452,453,454,457],{},"さらに見落とされがちなのが、",[33,455,456],{},"ファイルサイズ（容量）の上限","です。画像の縦横ピクセル数が正しくても、ファイルが重すぎるとSNSのクローラーが取得に失敗し、画像なしのカードとして表示されることがあります。OGP画像の最適化は「ピクセル寸法」と「ファイル容量」の両方を意識する必要があります。",[284,459],{},[23,461,463],{"id":462},"各snsプラットフォームの推奨サイズ一覧","各SNS・プラットフォームの推奨サイズ一覧",[11,465,466],{},"OGP画像の最適なサイズはプラットフォームによって異なります。主要サービスの推奨値をまとめました。",[11,468,469],{},[33,470,471],{},"X（旧Twitter）",[27,473,474,477,480,483],{},[30,475,476],{},"Summaryカード（小さいサムネイル）：144×144px以上、縦横比1:1",[30,478,479],{},"Summary Card with Large Image（横長サムネイル）：300×157px以上、縦横比2:1",[30,481,482],{},"推奨サイズ：1200×628px",[30,484,485],{},"ファイルサイズ上限：5MB（JPG\u002FPNG\u002FWebP）",[11,487,488],{},[33,489,490],{},"Facebook \u002F Meta",[27,492,493,496,499],{},[30,494,495],{},"最小サイズ：200×200px",[30,497,498],{},"推奨サイズ：1200×630px（縦横比1.91:1）",[30,500,501],{},"推奨ファイルサイズ：1MB以下",[11,503,504],{},[33,505,506],{},"LinkedIn",[27,508,509,512],{},[30,510,511],{},"推奨サイズ：1200×627px",[30,513,514],{},"ファイルサイズ上限：5MB",[11,516,517],{},[33,518,519],{},"Slack \u002F チャットツール",[27,521,522],{},[30,523,524],{},"og:imageを取得してプレビュー表示。1200×630px前後が無難",[11,526,527,528,531],{},"これらを横断的に見ると、",[33,529,530],{},"1200×630px（または1200×628px）"," という解像度がほぼすべてのサービスに対応できる事実上の標準サイズです。縦横比は約1.91:1を維持しつつ、JPEG品質を80〜85程度に抑えてファイルサイズを300KB以内に収めると、どの環境でも安定して表示されます。",[11,533,534],{},"ただし、既存の画像を流用する場合や、デザイン素材が別のアスペクト比で作られている場合は、リサイズ作業が必要になります。",[284,536],{},[23,538,540],{"id":539},"実践ogp画像を正しいサイズにリサイズする手順","実践：OGP画像を正しいサイズにリサイズする手順",[11,542,543],{},"OGP画像のリサイズ自体は難しい作業ではありませんが、いくつか気をつけたいポイントがあります。",[11,545,546],{},[33,547,548],{},"① 元画像の縦横比を確認する",[11,550,551],{},"元画像が正方形（1:1）や縦長の場合、単純にリサイズすると1200×630pxに収まらず、余白が生じたり主要な被写体が切り取られたりします。リサイズ前に、画像をどこを中心にトリミングするかを先に決めておくと作業がスムーズです。",[11,553,554],{},[33,555,556],{},"② 出力形式はJPEGかWebPを選ぶ",[11,558,559],{},"OGP画像には透過（アルファチャンネル）が不要なケースがほとんどです。PNGは品質が高い反面ファイルが重くなりやすいため、JPEGかWebPで書き出すのが現実的です。SNSのクローラーはWebPにも対応していますが、古いクローラーを考慮してJPEGを第一候補にするのが無難です。",[11,561,562],{},[33,563,564],{},"③ ツールを選ぶ：Photoshopがなくても問題ない",[11,566,567,568,573],{},"プロ向けの画像編集ソフトがなくても、ブラウザだけで完結するツールが充実しています。その一つとして ",[17,569,572],{"href":570,"rel":571},"https:\u002F\u002Fzerosend.site\u002Ftools\u002Fimage-resize",[329],"画像リサイズツール"," があります。このツールの特徴は、アップロードした画像がサーバーに送信されない点です。画像データはブラウザ内だけで処理されるため、社内資料や未公開のバナー画像を扱う場合でも、情報漏洩リスクを気にせず使えます。縦横のピクセル数を数値で直接指定できるので、1200×630pxに合わせる作業が直感的に行えます。",[11,575,576],{},[33,577,578],{},"④ リサイズ後にOGPキャッシュをクリアする",[11,580,581],{},"画像を差し替えても、SNS側のキャッシュが残っていると古い画像が表示され続けます。Xであれば「Card Validator」、Facebookであれば「Sharing Debugger」を使ってキャッシュを強制更新してください。ツールにURLを入力して「スクレイプ」または「デバッグ」を実行するだけで、新しい画像が反映されます。",[284,583],{},[23,585,587],{"id":586},"ogp画像の最適化がseoにも影響する理由","OGP画像の最適化がSEOにも影響する理由",[11,589,590,591,594],{},"OGPはSNS表示のための仕様であり、Googleの検索順位に直接影響するわけではありません。しかし、",[33,592,593],{},"間接的にSEOへのプラス効果","が期待できます。",[11,596,597],{},"SNSでシェアされたときに魅力的なサムネイルが表示されれば、クリック率が上がり、リンクが拡散されやすくなります。これがサイトへの流入増加につながり、滞在時間や被リンク獲得に好影響を与えます。また、画像ファイルのサイズを適切に絞ることはページの読み込み速度改善に直結し、Googleが重視するCore Web Vitalsの指標（特にLCPやFID）にも貢献します。",[11,599,600],{},"OGP画像を「SNS用の飾り」として後回しにしがちですが、サイトのパフォーマンスとブランド品質を底上げする実務的な施策として捉えると、優先度が変わってくるはずです。",[11,602,603,604,607],{},"まず手元にあるキービジュアルやアイキャッチ画像を1200×630px・300KB以内に整えるところから始めてみてください。専用ソフトが不要な環境であれば、前述した ",[17,605,572],{"href":570,"rel":606},[329]," のようなブラウザベースのツールを活用すると、余計な手間をかけずに作業を完結できます。",[284,609],{},{"title":236,"searchDepth":237,"depth":237,"links":611},[612,613,614,615],{"id":439,"depth":237,"text":440},{"id":462,"depth":237,"text":463},{"id":539,"depth":237,"text":540},{"id":586,"depth":237,"text":587},"OGP画像の推奨サイズや各SNSの仕様を解説。Twitterやog:imageが正しく表示されない原因と、ブラウザだけで完結する無料ツールを使った具体的な対処法を紹介します。",{},"\u002Fblog\u002Fogp-image-size-optimization","2026-05-12",{"title":434,"description":616},"ogp-image-size-optimization","blog\u002Fogp-image-size-optimization",[624,625,430,626],"画像","リサイズ","SEO","mIit_bdGiULblUiC2FeigxS7qW8uxuS9f-pKvrNhJKM",{"id":629,"title":630,"author":6,"body":631,"category":247,"coverImage":248,"description":893,"draft":250,"extension":251,"locale":252,"meta":894,"navigation":254,"noindex":250,"path":895,"publishedAt":896,"seo":897,"slug":898,"stem":899,"tags":900,"updatedAt":896,"__hash__":903},"blog\u002Fblog\u002Fwebp-convert-seo.md","WebP変換でSEOを改善する方法｜画像最適化の効果と手順を解説",{"type":8,"value":632,"toc":878},[633,637,644,651,658,660,664,667,671,678,681,685,692,696,699,701,705,708,715,728,731,734,736,740,747,750,753,756,763,851,855,858,860,864,867,874],[23,634,636],{"id":635},"画像が重いはseoの大敵見落とされがちなボトルネック","「画像が重い」はSEOの大敵——見落とされがちなボトルネック",[11,638,639,640,643],{},"Webサイトのパフォーマンス改善に取り組む際、JavaScriptの最適化やキャッシュ設定に目が向きがちです。しかし実際には、",[33,641,642],{},"画像ファイルの容量","がページ速度のボトルネックになっているケースが非常に多く見られます。",[11,645,646,647,650],{},"Google Search Consoleや PageSpeed Insights でサイトを計測してみると、「画像を次世代フォーマットで配信してください」という指摘を受けた経験がある方も多いでしょう。ここで言う「次世代フォーマット」とは、主に ",[33,648,649],{},"WebP（ウェブピー）"," のことを指します。",[11,652,653,654,657],{},"JPEGやPNGと比較して、WebPは同等の画質を保ちながらファイルサイズを ",[33,655,656],{},"平均25〜35%程度削減"," できると言われています。この差は、特に画像を多く使うECサイトやブログ、ポートフォリオサイトでは非常に大きなインパクトをもたらします。",[284,659],{},[23,661,663],{"id":662},"webp変換がseoに与える具体的な効果","WebP変換がSEOに与える具体的な効果",[11,665,666],{},"WebPに変換することがSEOにどう効くのか、具体的なポイントを整理してみましょう。",[340,668,670],{"id":669},"core-web-vitalsのスコアが改善する","① Core Web Vitalsのスコアが改善する",[11,672,673,674,677],{},"Googleは2021年からCore Web Vitals（CWV）を検索順位の評価指標に加えています。その中でも特に重要な ",[33,675,676],{},"LCP（Largest Contentful Paint）"," は、ページ内で最も大きな要素が表示されるまでの時間を測るものです。多くの場合、LCPの対象はメインビジュアルや商品画像など、大きな画像要素です。",[11,679,680],{},"WebPへの変換によってこれらの画像ファイルが軽くなれば、ダウンロード時間が短縮され、LCPスコアが改善します。結果として、Googleからの評価が高まりやすくなります。",[340,682,684],{"id":683},"ページの読み込み速度が体感レベルで上がる","② ページの読み込み速度が体感レベルで上がる",[11,686,687,688,691],{},"SEOの指標改善だけでなく、",[33,689,690],{},"ユーザー体験（UX）"," への直接的な効果も見逃せません。ページの表示が速くなれば直帰率が下がり、セッション時間が延びる傾向があります。Googleはこうしたユーザー行動のシグナルも評価に組み込んでいると考えられており、間接的にSEOへも好影響を与えます。",[340,693,695],{"id":694},"モバイル環境での優位性が上がる","③ モバイル環境での優位性が上がる",[11,697,698],{},"スマートフォンからのアクセスが主流となった現在、モバイル環境でのパフォーマンスは特に重要です。モバイル回線はWi-Fiよりも通信速度が不安定なことが多く、画像の軽量化がより体感しやすい差として現れます。WebPはモバイルファーストインデックスへの対応という観点でも有効な施策です。",[284,700],{},[23,702,704],{"id":703},"実際にどうやってwebpへ変換するか","実際にどうやってWebPへ変換するか",[11,706,707],{},"WebPへの変換方法はいくつかあります。サーバー側でImageMagickやlibwebpを使ってバッチ処理する方法、CMSのプラグインを使う方法、そしてブラウザ上で動作する変換ツールを使う方法などです。",[11,709,710,711,714],{},"サーバー環境を持たない方や、手軽に試してみたい方には、",[33,712,713],{},"ブラウザ上で完結する変換ツール","が最も手軽です。",[11,716,717,718,723,724,727],{},"その選択肢の一つとして、",[17,719,722],{"href":720,"rel":721},"https:\u002F\u002Fzerosend.site\u002Ftools\u002Fimage-convert",[329],"画像形式変換ツール"," があります。このツールの特徴は、",[33,725,726],{},"ファイルをサーバーに送信せず、ブラウザ内だけで処理する","という点です。",[11,729,730],{},"業務で扱う画像の中には、公開前の商品写真や社内資料のスクリーンショットなど、外部に送信したくないものも含まれることがあります。クラウド型のサービスでは、アップロード時にファイルがサーバーを経由するため、情報漏えいのリスクをゼロにはできません。一方、ブラウザ内処理であれば、その心配がありません。",[11,732,733],{},"操作はシンプルで、変換したい画像ファイルをドラッグ＆ドロップし、出力形式としてWebPを選択するだけです。JPEGやPNGはもちろん、複数形式に対応しているため、様々な用途で活用できます。",[284,735],{},[23,737,739],{"id":738},"webp変換を運用に組み込むためのポイント","WebP変換を運用に組み込むためのポイント",[11,741,742,743,746],{},"WebPへの変換は一度やれば終わりではなく、",[33,744,745],{},"継続的な運用","として組み込むことが大切です。",[340,748,749],{"id":749},"既存ページと新規ページの両方に対応する",[11,751,752],{},"まず既存の記事や製品ページに使われている画像を洗い出し、ファイルサイズの大きいものから優先的に変換していきましょう。次に、新規コンテンツを作成する際のルールとして「アップロード前にWebP変換を行う」というフローを定めておくと、徐々に全体の最適化が進みます。",[340,754,755],{"id":755},"ブラウザの対応状況を確認する",[11,757,758,759,762],{},"WebPは主要なモダンブラウザではほぼすべて対応していますが、ごく一部の古いブラウザでは表示されない場合があります。HTMLの ",[56,760,761],{},"\u003Cpicture>"," タグを使ってWebPとJPEGをフォールバックとして両方指定する方法が、安全性の高い実装です。",[764,765,769],"pre",{"className":766,"code":767,"language":768,"meta":236,"style":236},"language-html shiki shiki-themes github-light github-dark","\u003Cpicture>\n  \u003Csource srcset=\"image.webp\" type=\"image\u002Fwebp\">\n  \u003Cimg src=\"image.jpg\" alt=\"説明テキスト\">\n\u003C\u002Fpicture>\n","html",[56,770,771,787,816,841],{"__ignoreMap":236},[772,773,776,780,784],"span",{"class":774,"line":775},"line",1,[772,777,779],{"class":778},"sVt8B","\u003C",[772,781,783],{"class":782},"s9eBZ","picture",[772,785,786],{"class":778},">\n",[772,788,789,792,795,799,802,806,809,811,814],{"class":774,"line":237},[772,790,791],{"class":778},"  \u003C",[772,793,794],{"class":782},"source",[772,796,798],{"class":797},"sScJk"," srcset",[772,800,801],{"class":778},"=",[772,803,805],{"class":804},"sZZnC","\"image.webp\"",[772,807,808],{"class":797}," type",[772,810,801],{"class":778},[772,812,813],{"class":804},"\"image\u002Fwebp\"",[772,815,786],{"class":778},[772,817,818,820,823,826,828,831,834,836,839],{"class":774,"line":418},[772,819,791],{"class":778},[772,821,822],{"class":782},"img",[772,824,825],{"class":797}," src",[772,827,801],{"class":778},[772,829,830],{"class":804},"\"image.jpg\"",[772,832,833],{"class":797}," alt",[772,835,801],{"class":778},[772,837,838],{"class":804},"\"説明テキスト\"",[772,840,786],{"class":778},[772,842,844,847,849],{"class":774,"line":843},4,[772,845,846],{"class":778},"\u003C\u002F",[772,848,783],{"class":782},[772,850,786],{"class":778},[340,852,854],{"id":853},"変換後はpagespeed-insightsで効果を確認する","変換後はPageSpeed Insightsで効果を確認する",[11,856,857],{},"変換前後でPageSpeed Insightsのスコアを比較することで、改善の効果を数値として確認できます。特にモバイルのスコアに注目しながら、優先度の高いページから順に対応を進めると効率的です。",[284,859],{},[23,861,863],{"id":862},"まとめ小さな変換が大きな差を生む","まとめ——小さな変換が、大きな差を生む",[11,865,866],{},"WebPへの変換は、特別な技術知識がなくても取り組めるSEO改善施策の一つです。ファイルサイズを削減することで、Core Web Vitalsの改善、ページ速度の向上、そしてユーザー体験の向上につながります。",[11,868,869,870,873],{},"「まずは手元の画像を一枚変換してみる」という小さな一歩から始めることが、継続的な改善への入り口になります。プライバシーを気にしながら手軽に試したい方は、ブラウザ内処理で動作する ",[17,871,722],{"href":720,"rel":872},[329]," を一度使ってみてください。ツールを使った体験を通じて、変換の効果を実感するのが一番の近道です。",[875,876,877],"style",{},"html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":236,"searchDepth":237,"depth":237,"links":879},[880,881,886,887,892],{"id":635,"depth":237,"text":636},{"id":662,"depth":237,"text":663,"children":882},[883,884,885],{"id":669,"depth":418,"text":670},{"id":683,"depth":418,"text":684},{"id":694,"depth":418,"text":695},{"id":703,"depth":237,"text":704},{"id":738,"depth":237,"text":739,"children":888},[889,890,891],{"id":749,"depth":418,"text":749},{"id":755,"depth":418,"text":755},{"id":853,"depth":418,"text":854},{"id":862,"depth":237,"text":863},"WebPへの変換がSEOに与える効果を具体的に解説。ページ速度の改善やCore Web Vitalsへの影響、無料ツールを使った実践的な変換手順まで分かりやすく紹介します。",{},"\u002Fblog\u002Fwebp-convert-seo","2026-05-07",{"title":630,"description":893},"webp-convert-seo","blog\u002Fwebp-convert-seo",[626,901,902,430],"変換","Core Web Vitals","ohRygyiARrZiiJTtMjcj1pIeCMmom8JQlMu5cJV0TS8",{"id":905,"title":906,"author":6,"body":907,"category":247,"coverImage":248,"description":1237,"draft":250,"extension":251,"locale":252,"meta":1238,"navigation":254,"noindex":250,"path":1239,"publishedAt":1240,"seo":1241,"slug":1242,"stem":1243,"tags":1244,"updatedAt":1240,"__hash__":1246},"blog\u002Fblog\u002Fpdf-email-compress.md","PDFがメールで送れない時の圧縮方法｜ファイルサイズを簡単に減らすコツ",{"type":8,"value":908,"toc":1220},[909,913,916,919,963,966,969,982,989,991,995,998,1001,1039,1042,1045,1052,1055,1057,1060,1071,1078,1082,1091,1097,1103,1106,1109,1147,1150,1152,1155,1158,1162,1165,1169,1172,1176,1183,1185,1188,1191,1210],[23,910,912],{"id":911},"pdfがメールで送れない原因はファイルサイズにある","PDFがメールで送れない原因はファイルサイズにある",[11,914,915],{},"仕事でPDFをメール添付しようとしたら「ファイルサイズが大きすぎます」と弾かれてしまった――そんな経験は誰にでもあるはずです。",[11,917,918],{},"一般的なメールサービスの添付ファイル上限はおおむね次のとおりです。",[920,921,922,935],"table",{},[923,924,925],"thead",{},[926,927,928,932],"tr",{},[929,930,931],"th",{},"サービス",[929,933,934],{},"添付上限の目安",[936,937,938,947,955],"tbody",{},[926,939,940,944],{},[941,942,943],"td",{},"Gmail",[941,945,946],{},"25 MB",[926,948,949,952],{},[941,950,951],{},"Outlook \u002F Hotmail",[941,953,954],{},"20 MB",[926,956,957,960],{},[941,958,959],{},"社内メールサーバー",[941,961,962],{},"5〜10 MB が多い",[11,964,965],{},"スキャンした書類や図版を多く含むPDFは、あっという間に数十MBに膨らみます。特に「カラースキャン＋高解像度」で作成したファイルは要注意です。",[11,967,968],{},"上限を超えたときの主な対策は以下の3つです。",[105,970,971,976,979],{},[30,972,973],{},[33,974,975],{},"ファイルを圧縮してサイズを小さくする",[30,977,978],{},"クラウドストレージ（Google Drive など）のリンクで共有する",[30,980,981],{},"ファイル転送サービスを使う",[11,983,984,985,988],{},"このうち「すぐに・安全に・無料で」できる方法が ",[33,986,987],{},"圧縮"," です。本記事では、圧縮の仕組みと具体的な手順を分かりやすく説明します。",[284,990],{},[23,992,994],{"id":993},"pdf圧縮の仕組みとどのくらい軽くなるかの目安","PDF圧縮の仕組みと「どのくらい軽くなるか」の目安",[11,996,997],{},"PDFの圧縮とは、ファイル内の画像データや埋め込みフォントを最適化して、全体のデータ量を減らす処理です。テキスト中心のPDFはそもそもサイズが小さいため効果は限定的ですが、画像を含むPDFは大幅に軽量化できます。",[340,999,1000],{"id":1000},"圧縮率の目安",[920,1002,1003,1013],{},[923,1004,1005],{},[926,1006,1007,1010],{},[929,1008,1009],{},"元のファイルの種類",[929,1011,1012],{},"圧縮後のサイズ感",[936,1014,1015,1023,1031],{},[926,1016,1017,1020],{},[941,1018,1019],{},"カラースキャン（300 dpi以上）",[941,1021,1022],{},"50〜80% 削減も可能",[926,1024,1025,1028],{},[941,1026,1027],{},"図版・グラフを含む資料",[941,1029,1030],{},"30〜60% 削減",[926,1032,1033,1036],{},[941,1034,1035],{},"テキストのみ",[941,1037,1038],{},"5〜15% 程度",[11,1040,1041],{},"ポイントは「画質をどこまで許容するか」です。印刷用の高精細データが不要なら、Web表示に適した解像度（96〜150 dpi）に落とすだけで劇的にサイズが縮みます。メール添付用途であれば、画質の低下はほとんど気にならないレベルに収まることがほとんどです。",[340,1043,1044],{"id":1044},"オンラインツールを使う際に気をつけたいこと",[11,1046,1047,1048,1051],{},"PDFには、契約書・請求書・個人情報など機密性の高い内容が含まれることも少なくありません。一般的なオンライン圧縮ツールは、ファイルをクラウドサーバーへアップロードして処理するため、",[33,1049,1050],{},"「誰かのサーバーにデータが送られている」"," という事実を忘れがちです。",[11,1053,1054],{},"利用規約をよく読まずに使うと、意図せずデータが保存・利用されるリスクがあります。業務で扱うPDFを圧縮するなら、プライバシーへの配慮があるツールを選ぶことを強くおすすめします。",[284,1056],{},[23,1058,1059],{"id":1059},"ブラウザだけで完結する安全な圧縮ツールの使い方",[11,1061,1062,1063,1070],{},"そこで紹介したいのが、",[33,1064,1065],{},[17,1066,1069],{"href":1067,"rel":1068},"https:\u002F\u002Fzerosend.site\u002Ftools\u002Fpdf-compress",[329],"Zerosend の PDF 圧縮ツール"," です。",[11,1072,1073,1074,1077],{},"このツールの最大の特徴は、",[33,1075,1076],{},"ファイルを一切サーバーへ送信しない"," という点です。圧縮処理はすべてブラウザ内（ローカル）で完結するため、外部にデータが漏れる心配がありません。インストール不要で、Windows・Mac・スマートフォンを問わずブラウザさえあれば使えます。",[340,1079,1081],{"id":1080},"実際の使い方3ステップ","実際の使い方（3ステップ）",[11,1083,1084,1087,1090],{},[33,1085,1086],{},"ステップ1：ツールを開く",[17,1088,1067],{"href":1067,"rel":1089},[329]," にアクセスします。",[11,1092,1093,1096],{},[33,1094,1095],{},"ステップ2：PDFをアップロードする","\n画面中央のエリアにPDFファイルをドラッグ＆ドロップするか、「ファイルを選択」ボタンをクリックして対象のファイルを選びます。",[11,1098,1099,1102],{},[33,1100,1101],{},"ステップ3：圧縮してダウンロードする","\n圧縮品質（高・中・低）を選択し、「圧縮する」ボタンを押すと処理が始まります。完了したらそのままダウンロードボタンをクリックするだけです。",[11,1104,1105],{},"操作はこれだけ。アカウント登録もログインも不要で、1分もあれば作業が終わります。",[340,1107,1108],{"id":1108},"圧縮品質の選び方",[920,1110,1111,1121],{},[923,1112,1113],{},[926,1114,1115,1118],{},[929,1116,1117],{},"品質設定",[929,1119,1120],{},"おすすめの用途",[936,1122,1123,1131,1139],{},[926,1124,1125,1128],{},[941,1126,1127],{},"高（Low compression）",[941,1129,1130],{},"印刷や長期保存が必要な場合",[926,1132,1133,1136],{},[941,1134,1135],{},"中（Balanced）",[941,1137,1138],{},"メール添付の標準的な用途",[926,1140,1141,1144],{},[941,1142,1143],{},"低（High compression）",[941,1145,1146],{},"とにかくサイズを小さくしたい場合",[11,1148,1149],{},"メール添付が目的なら「中」から試して、サイズが足りなければ「低」に切り替えるのがおすすめです。",[284,1151],{},[23,1153,1154],{"id":1154},"圧縮してもサイズが減らないときの追加対策",[11,1156,1157],{},"圧縮ツールを使っても思ったほどサイズが小さくならないケースもあります。そのような場合は、以下の方法を組み合わせてみてください。",[340,1159,1161],{"id":1160},"_1-pdfのページを分割して送る","1. PDFのページを分割して送る",[11,1163,1164],{},"複数ページにまたがる大きなPDFは、前半・後半などに分けて2通のメールで送るのがシンプルな回避策です。分割ツールも同様にブラウザ内処理のものを選ぶと安心です。",[340,1166,1168],{"id":1167},"_2-クラウドストレージのリンク共有を活用する","2. クラウドストレージのリンク共有を活用する",[11,1170,1171],{},"Google Drive・OneDrive・Dropbox にアップロードして共有リンクをメール本文に貼る方法です。相手がアカウントを持っていなくても、リンク共有設定を「全員が閲覧可能」にしておけばアクセスできます。ただし、機密文書の場合は共有設定のミスに注意が必要です。",[340,1173,1175],{"id":1174},"_3-スキャン設定を見直す","3. スキャン設定を見直す",[11,1177,1178,1179,1182],{},"そもそもスキャン時の解像度が高すぎる場合は、設定を ",[33,1180,1181],{},"150〜200 dpi・カラーではなくグレースケール"," に変更するだけでファイルサイズが大幅に減ります。次回以降のスキャン時に設定を見直しておくと、圧縮の手間自体が省けます。",[284,1184],{},[23,1186,1187],{"id":1187},"まとめ",[11,1189,1190],{},"PDFがメールで送れないときの解決策をおさらいします。",[27,1192,1193,1199,1205],{},[30,1194,1195,1198],{},[33,1196,1197],{},"まずは圧縮を試す","：画像を含むPDFなら、50〜80%のサイズ削減が期待できる",[30,1200,1201,1204],{},[33,1202,1203],{},"ツール選びはプライバシーを重視する","：業務文書はサーバー送信なしのブラウザ内処理ツールが安心",[30,1206,1207],{},[33,1208,1209],{},"それでも無理なら分割・クラウド共有を検討する",[11,1211,1212,1213,1219],{},"ファイルを外部サーバーに送らずに圧縮できる ",[33,1214,1215],{},[17,1216,1218],{"href":1067,"rel":1217},[329],"PDF 圧縮ツール（Zerosend）"," は、機密情報を扱うビジネスシーンでも安心して使える選択肢です。ブックマークしておくと、次に困ったときにすぐ使えて便利です。",{"title":236,"searchDepth":237,"depth":237,"links":1221},[1222,1223,1227,1231,1236],{"id":911,"depth":237,"text":912},{"id":993,"depth":237,"text":994,"children":1224},[1225,1226],{"id":1000,"depth":418,"text":1000},{"id":1044,"depth":418,"text":1044},{"id":1059,"depth":237,"text":1059,"children":1228},[1229,1230],{"id":1080,"depth":418,"text":1081},{"id":1108,"depth":418,"text":1108},{"id":1154,"depth":237,"text":1154,"children":1232},[1233,1234,1235],{"id":1160,"depth":418,"text":1161},{"id":1167,"depth":418,"text":1168},{"id":1174,"depth":418,"text":1175},{"id":1187,"depth":237,"text":1187},"PDFがメールの添付上限を超えて送れない場合の対処法を解説。ブラウザだけで完結する無料圧縮ツールを使えば、個人情報を守りながら素早くファイルを軽量化できます。",{},"\u002Fblog\u002Fpdf-email-compress","2026-05-06",{"title":906,"description":1237},"pdf-email-compress","blog\u002Fpdf-email-compress",[987,429,428,1245],"ブラウザ","FoSkNrelOsQ46PJjGfMFKkHITo-HD6f-EsEiX74jkhI",{"id":1248,"title":1249,"author":6,"body":1250,"category":247,"coverImage":248,"description":1523,"draft":250,"extension":251,"locale":252,"meta":1524,"navigation":254,"noindex":250,"path":1525,"publishedAt":1526,"seo":1527,"slug":1528,"stem":1529,"tags":1530,"updatedAt":1526,"__hash__":1531},"blog\u002Fblog\u002Fcore-web-vitals-image-compress.md","Core Web Vitals を改善する画像圧縮の方法と実践ステップ",{"type":8,"value":1251,"toc":1517},[1252,1256,1259,1278,1281,1284,1291,1293,1296,1299,1349,1352,1363,1366,1368,1372,1379,1391,1394,1423,1426,1428,1431,1434,1439,1464,1469,1506,1509,1512,1514],[23,1253,1255],{"id":1254},"core-web-vitals-と画像の関係を正しく理解する","Core Web Vitals と画像の関係を正しく理解する",[11,1257,1258],{},"Googleが検索ランキングの評価指標として採用している「Core Web Vitals」は、大きく3つの指標で構成されています。",[27,1260,1261,1266,1272],{},[30,1262,1263,1265],{},[33,1264,676],{},"：ページ内の最も大きなコンテンツが表示されるまでの時間",[30,1267,1268,1271],{},[33,1269,1270],{},"INP（Interaction to Next Paint）","：ユーザー操作に対する応答速度",[30,1273,1274,1277],{},[33,1275,1276],{},"CLS（Cumulative Layout Shift）","：レイアウトのずれ具合",[11,1279,1280],{},"このうち、画像が直接影響するのは主にLCPです。ページを開いたときに最初に目に入る大きな画像（ヒーローイメージやメインビジュアルなど）がLCPの対象になることが多く、その画像ファイルが重いほど表示に時間がかかり、スコアが下がります。",[11,1282,1283],{},"Googleが定めるLCPの合格ラインは「2.5秒以内」。これを超えると「改善が必要」と判定され、検索順位にも悪影響が出る可能性があります。",[11,1285,1286,1287,1290],{},"ブログやコーポレートサイトを運営しているWeb担当者の方から「PageSpeed Insightsで低スコアが出たけど何をすればいいのかわからない」という声をよく聞きます。そのほとんどのケースで、",[33,1288,1289],{},"画像の最適化が最も効果的な改善策","になります。",[284,1292],{},[23,1294,1295],{"id":1295},"画像圧縮で改善できるスコアの目安",[11,1297,1298],{},"画像圧縮の効果は、元のファイルサイズによって大きく変わります。一般的な傾向として以下のような改善が見込めます。",[920,1300,1301,1314],{},[923,1302,1303],{},[926,1304,1305,1308,1311],{},[929,1306,1307],{},"元のファイルサイズ",[929,1309,1310],{},"圧縮後の目安",[929,1312,1313],{},"LCPへの効果",[936,1315,1316,1327,1338],{},[926,1317,1318,1321,1324],{},[941,1319,1320],{},"3MB以上",[941,1322,1323],{},"300KB〜500KB程度",[941,1325,1326],{},"大きく改善",[926,1328,1329,1332,1335],{},[941,1330,1331],{},"1MB前後",[941,1333,1334],{},"100KB〜200KB程度",[941,1336,1337],{},"中程度改善",[926,1339,1340,1343,1346],{},[941,1341,1342],{},"500KB以下",[941,1344,1345],{},"50KB〜100KB程度",[941,1347,1348],{},"微改善〜維持",[11,1350,1351],{},"デジタルカメラやスマートフォンで撮影した画像は、何も処理しないと3〜8MB程度になることがよくあります。そのままWebサイトに掲載すると、モバイル回線のユーザーにとっては表示まで数秒かかることも珍しくありません。",[11,1353,1354,1355,1358,1359,1362],{},"また、画像圧縮はLCPだけでなくCLSにも間接的に効果があります。画像に",[56,1356,1357],{},"width","と",[56,1360,1361],{},"height","属性を設定したうえでファイルサイズを適切に管理すると、読み込み中のレイアウトずれを防ぎやすくなります。",[11,1364,1365],{},"PageSpeed Insightsで「適切なサイズの画像」「次世代フォーマットでの画像の配信」「効率的な画像エンコード」などの警告が出ている場合は、まず画像圧縮から取り組むのが王道です。",[284,1367],{},[23,1369,1371],{"id":1370},"実践ブラウザだけで完結する画像圧縮の手順","実践：ブラウザだけで完結する画像圧縮の手順",[11,1373,1374,1375,1378],{},"画像圧縮ツールは数多くありますが、業務で使う場合に気になるのが",[33,1376,1377],{},"ファイルのプライバシー","です。社内資料の画像や顧客の写真をアップロードする際、そのデータがサーバーに保存・収集されていないかどうかは確認しておきたいポイントです。",[11,1380,1381,1386,1387,1390],{},[17,1382,1385],{"href":1383,"rel":1384},"https:\u002F\u002Fzerosend.site\u002Ftools\u002Fimage-compress",[329],"ZeroSend の画像圧縮ツール","は、ファイルをサーバーに送信せず、",[33,1388,1389],{},"ブラウザ内だけで処理を完結","させる設計になっています。アップロードした画像が外部に送信されることはないため、社内ルールが厳しい職場でも安心して使いやすいのが特徴です。",[11,1392,1393],{},"使い方はシンプルです。",[105,1395,1396,1405,1411,1417],{},[30,1397,1398,1401,1404],{},[33,1399,1400],{},"ツールにアクセスする",[17,1402,1383],{"href":1383,"rel":1403},[329]," をブラウザで開きます。インストール不要です。",[30,1406,1407,1410],{},[33,1408,1409],{},"画像ファイルを選択する","\nJPEG・PNG・WebPなど主要なフォーマットに対応しています。ドラッグ＆ドロップでも選択できます。",[30,1412,1413,1416],{},[33,1414,1415],{},"圧縮品質を調整する","\nスライダーで圧縮率を調整できます。品質を下げすぎると画像が荒くなるため、まずは「品質70〜80%」を目安に試してみてください。多くのケースでこの範囲でもビジュアル上の劣化はほとんど気になりません。",[30,1418,1419,1422],{},[33,1420,1421],{},"ダウンロードして使用する","\n圧縮後のファイルをダウンロードして、そのままWebサイトにアップロードできます。",[11,1424,1425],{},"処理はすべてローカルで行われるため、通信環境に関わらず速く動作し、データが外部に出ることもありません。",[284,1427],{},[23,1429,1430],{"id":1430},"画像圧縮の前後に確認すべきチェックリスト",[11,1432,1433],{},"圧縮するだけで終わりにしてしまうと、せっかくの改善効果が半減することがあります。以下のチェックリストを参考に、一連の対応を整理してみてください。",[11,1435,1436],{},[33,1437,1438],{},"圧縮前に確認すること",[27,1440,1443,1452,1458],{"className":1441},[1442],"contains-task-list",[30,1444,1447,1451],{"className":1445},[1446],"task-list-item",[1448,1449],"input",{"disabled":254,"type":1450},"checkbox"," PageSpeed Insights（またはLighthouse）でLCPの対象要素を特定する",[30,1453,1455,1457],{"className":1454},[1446],[1448,1456],{"disabled":254,"type":1450}," 改善対象の画像ファイルサイズを把握する（100KB以上なら圧縮優先）",[30,1459,1461,1463],{"className":1460},[1446],[1448,1462],{"disabled":254,"type":1450}," 表示サイズに対して必要以上に大きな解像度になっていないか確認する（例：横幅800pxで表示しているのに3000px幅の画像を使っていないか）",[11,1465,1466],{},[33,1467,1468],{},"圧縮後に確認すること",[27,1470,1472,1478,1490,1500],{"className":1471},[1442],[30,1473,1475,1477],{"className":1474},[1446],[1448,1476],{"disabled":254,"type":1450}," 視覚的な品質が許容範囲に収まっているか確認する",[30,1479,1481,1483,1484,1486,1487,1489],{"className":1480},[1446],[1448,1482],{"disabled":254,"type":1450}," 画像タグに",[56,1485,1357],{},"・",[56,1488,1361],{},"属性が設定されているか確認する（CLSの防止）",[30,1491,1493,1495,1496,1499],{"className":1492},[1446],[1448,1494],{"disabled":254,"type":1450}," 可能であれば",[56,1497,1498],{},"loading=\"lazy\"","を設定する（ファーストビュー外の画像に有効）",[30,1501,1503,1505],{"className":1502},[1446],[1448,1504],{"disabled":254,"type":1450}," 再度PageSpeed Insightsでスコアを計測して改善幅を確認する",[11,1507,1508],{},"画像圧縮は一度やれば終わりではありません。新しいページを追加するたびに同じ基準で対応する習慣をつけると、Core Web Vitalsのスコアを継続的に維持できます。",[11,1510,1511],{},"また、今後Webサイトに掲載する画像は、撮影・制作の段階からファイルサイズを意識しておくと後の作業が楽になります。「Web用に書き出す」「解像度は72dpiで十分」といった基準を制作フローに組み込んでおくことをおすすめします。",[284,1513],{},[11,1515,1516],{},"Core Web Vitalsの改善は、一見難しそうに感じますが、画像圧縮という具体的なアクションから着手するのが最も効果を実感しやすい方法です。ツールの導入コストも時間もほとんどかからないため、まずは今のサイトの画像を一度確認してみてください。",{"title":236,"searchDepth":237,"depth":237,"links":1518},[1519,1520,1521,1522],{"id":1254,"depth":237,"text":1255},{"id":1295,"depth":237,"text":1295},{"id":1370,"depth":237,"text":1371},{"id":1430,"depth":237,"text":1430},"Core Web Vitals のスコアを下げる画像の重さを解消する方法を解説。ブラウザだけで完結する無料ツールを使った実践的な改善ステップを紹介します。",{},"\u002Fblog\u002Fcore-web-vitals-image-compress","2026-05-05",{"title":1249,"description":1523},"core-web-vitals-image-compress","blog\u002Fcore-web-vitals-image-compress",[624,987,626,902],"UwuTfke-zayrzyjzA0lR0uobGodScG9hVZstptUy0MI",{"id":1533,"title":1534,"author":6,"body":1535,"category":247,"coverImage":248,"description":1770,"draft":250,"extension":251,"locale":252,"meta":1771,"navigation":254,"noindex":250,"path":1772,"publishedAt":256,"seo":1773,"slug":1774,"stem":1775,"tags":1776,"updatedAt":256,"__hash__":1778},"blog\u002Fblog\u002Faudio-convert-intro.md","音声形式を変換する — \u002Ftools\u002Faudio-convert の思想と使い方",{"type":8,"value":1536,"toc":1759},[1537,1540,1547,1549,1575,1578,1585,1588,1590,1610,1613,1639,1642,1668,1670,1673,1698,1701,1703,1709,1715,1721,1727,1729],[11,1538,1539],{},"取材の録音を MP3 に揃えたい、古い WAV ファイルを容量節約のため M4A に変えたい、ポッドキャスト配信用の形式に統一したい。音声ファイルの形式変換は、取材者・編集者・音楽制作者が日常的に行う作業です。",[11,1541,1542,1546],{},[17,1543,1545],{"href":1544},"\u002Ftools\u002Faudio-convert","Zerosend の音声形式変換ツール"," は、この作業をブラウザ内で完結させます。",[23,1548,25],{"id":25},[27,1550,1551,1557,1563,1569],{},[30,1552,1553,1556],{},[33,1554,1555],{},"MP3 で圧縮配布",": WAV や FLAC などのマスター音源を MP3 に変換して容量を大幅に削減し、メールや共有リンクで配布しやすくする",[30,1558,1559,1562],{},[33,1560,1561],{},"WAV で高音質保存",": 録音した音声インタビューや楽曲を非圧縮の WAV で保存し、後の編集作業に備える",[30,1564,1565,1568],{},[33,1566,1567],{},"動画ファイルから MP3 を抽出",": 講演・ウェビナーの録画動画から音声トラックだけを取り出し、ポッドキャストや音声コンテンツとして再利用する",[30,1570,1571,1574],{},[33,1572,1573],{},"形式の統一",": 複数人から集まった異なる形式の録音ファイルを、編集ソフトに合わせて一括で同一形式に変換する",[23,1576,1577],{"id":1577},"なぜブラウザ内で変換するのか",[11,1579,1580,1581,1584],{},"録音された音声は、",[33,1582,1583],{},"発話の中身そのもの","を情報として持ちます。インタビュー対象者の声、打ち合わせでの発言、取材源の証言。これらを無料のオンライン変換サービスに預けることは、発話内容そのものを第三者のサーバーに預けることと同じです。",[11,1586,1587],{},"Zerosend は変換処理をローカルで行うため、音声ファイルが一切外に出ません。取材ソースの保護や NDA 下の音源加工でも安全に使えます。",[23,1589,103],{"id":103},[105,1591,1592,1598,1601,1604,1607],{},[30,1593,1594,113],{},[17,1595,1596],{"href":1544},[56,1597,1544],{},[30,1599,1600],{},"音声ファイルをドラッグ&ドロップ (複数可)",[30,1602,1603],{},"出力形式 (MP3 \u002F WAV \u002F M4A \u002F OGG) とビットレートを選択",[30,1605,1606],{},"「変換を開始する」をクリック",[30,1608,1609],{},"結果を ZIP でダウンロード",[23,1611,1612],{"id":1612},"形式の選び方",[27,1614,1615,1621,1627,1633],{},[30,1616,1617,1620],{},[33,1618,1619],{},"MP3",": 最も汎用。ポッドキャスト・配信・共有の標準",[30,1622,1623,1626],{},[33,1624,1625],{},"WAV",": 可逆 (ロスレス)。編集中のマスター音源・音楽制作用",[30,1628,1629,1632],{},[33,1630,1631],{},"M4A (AAC)",": MP3 より圧縮効率が良い。iOS 環境で標準",[30,1634,1635,1638],{},[33,1636,1637],{},"OGG (Vorbis)",": オープン形式。ゲーム・一部ブラウザで効率重視",[340,1640,1641],{"id":1641},"ビットレートの目安",[27,1643,1644,1650,1656,1662],{},[30,1645,1646,1649],{},[33,1647,1648],{},"320 kbps",": 音質最優先 (MP3 の実用上限)",[30,1651,1652,1655],{},[33,1653,1654],{},"192 kbps",": 標準品質。一般向け音声の定番",[30,1657,1658,1661],{},[33,1659,1660],{},"128 kbps",": 容量優先。音声解説・ポッドキャスト",[30,1663,1664,1667],{},[33,1665,1666],{},"96 kbps 以下",": 会話のみの録音など、音質より軽さ",[23,1669,157],{"id":157},[11,1671,1672],{},"ffmpeg.wasm を使って再エンコードしています。",[27,1674,1675,1678,1692,1695],{},[30,1676,1677],{},"入力音声を ffmpeg FS に書き込み",[30,1679,1680,1681,1684,1685,1684,1688,1691],{},"出力形式に応じたエンコーダ (",[56,1682,1683],{},"libmp3lame",", ",[56,1686,1687],{},"aac",[56,1689,1690],{},"libvorbis"," など) を指定",[30,1693,1694],{},"ビットレート・チャンネル数・サンプリングレートを設定",[30,1696,1697],{},"出力 Blob を生成してダウンロード",[11,1699,1700],{},"メタデータ (タイトル・アーティスト) は極力引き継ぎます。",[23,1702,180],{"id":180},[11,1704,1705,1708],{},[33,1706,1707],{},"Q. 可逆 → 非可逆 (WAV → MP3) と 非可逆 → 非可逆 (MP3 → M4A) の違いは？","\nA. 非可逆 → 非可逆は二重に圧縮されるため音質がさらに劣化します。マスター音源 (WAV) から目的形式に直接変換するのをお勧めします。",[11,1710,1711,1714],{},[33,1712,1713],{},"Q. 複数ファイルのバッチ変換は？","\nA. 対応しています。10〜20 ファイル程度を 1 バッチで処理するのが現実的です。",[11,1716,1717,1720],{},[33,1718,1719],{},"Q. 動画から音声だけ抜き出したい","\nA. 動画ファイルを入力すれば音声トラックを抽出して指定形式で書き出します。",[11,1722,1723,1726],{},[33,1724,1725],{},"Q. ビットレートを自由に指定できる？","\nA. プリセットから選ぶ方式です。細かい制御が必要なら別途専門ツールを検討してください。",[23,1728,206],{"id":206},[27,1730,1731,1738,1745,1752],{},[30,1732,1733,1737],{},[17,1734,1736],{"href":1735},"\u002Ftools\u002Faudio-trim","音声トリミング"," — 変換前後の区間切り出し",[30,1739,1740,1744],{},[17,1741,1743],{"href":1742},"\u002Ftools\u002Fvideo-convert","動画形式変換"," — 動画側の形式変換",[30,1746,1747,1751],{},[17,1748,1750],{"href":1749},"\u002Ftools\u002Fvideo-trim","動画トリミング"," — 音声抽出前の動画整形",[30,1753,1754,1758],{},[17,1755,1757],{"href":1756},"\u002Ftools\u002Fvideo-compress","動画圧縮"," — 動画から音声を抽出する前に動画サイズを削減する",{"title":236,"searchDepth":237,"depth":237,"links":1760},[1761,1762,1763,1764,1767,1768,1769],{"id":25,"depth":237,"text":25},{"id":1577,"depth":237,"text":1577},{"id":103,"depth":237,"text":103},{"id":1612,"depth":237,"text":1612,"children":1765},[1766],{"id":1641,"depth":418,"text":1641},{"id":157,"depth":237,"text":157},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},"Zerosend の音声形式変換ツールは、MP3 \u002F WAV \u002F M4A \u002F FLAC \u002F OGG などをサーバーに送らずブラウザ内で相互変換します。録音インタビューや音源ファイルの形式統一に。Zerosend 編集部が解説。",{},"\u002Fblog\u002Faudio-convert-intro",{"title":1534,"description":1770},"audio-convert-intro","blog\u002Faudio-convert-intro",[1777,901,262],"音声","OlXJ1MeL-A2cx6TnCW2yQ2e3upQHsBkoPqR_cseAvY8",{"id":1780,"title":1781,"author":6,"body":1782,"category":247,"coverImage":248,"description":2015,"draft":250,"extension":251,"locale":252,"meta":2016,"navigation":254,"noindex":250,"path":2017,"publishedAt":256,"seo":2018,"slug":2019,"stem":2020,"tags":2021,"updatedAt":256,"__hash__":2023},"blog\u002Fblog\u002Faudio-trim-intro.md","音声をトリミング (切り出し) する — \u002Ftools\u002Faudio-trim の思想と使い方",{"type":8,"value":1783,"toc":2005},[1784,1787,1792,1795,1833,1836,1839,1846,1848,1868,1872,1879,1882,1884,1895,1908,1915,1918,1944,1946,1952,1962,1968,1974,1986,1988],[11,1785,1786],{},"60 分のインタビューから引用したい 30 秒を抜き出したい、会議録音の不要な冒頭\u002F末尾をカットしたい、ポッドキャスト素材のつなぎ目を整えたい。音声のトリミングは、録音後の編集で最初に行う作業です。",[11,1788,1789,1546],{},[17,1790,1791],{"href":1735},"Zerosend の音声トリミングツール",[23,1793,1794],{"id":1794},"こんな場面で使える",[27,1796,1797,1803,1809,1815,1821,1827],{},[30,1798,1799,1802],{},[33,1800,1801],{},"ポッドキャスト収録の前後カット",": 収録開始前の雑談や終了後の「切れましたか？」をまるごと除去",[30,1804,1805,1808],{},[33,1806,1807],{},"BGM の切り出し",": 長いオーディオトラックから使いたいサビ部分だけを抽出",[30,1810,1811,1814],{},[33,1812,1813],{},"着信音・通知音の作成",": お気に入りの曲の冒頭 30 秒をトリミングして着信音用ファイルに",[30,1816,1817,1820],{},[33,1818,1819],{},"インタビュー引用",": 60 分音源から 30 秒の発言だけを抜き出してプレゼンや記事に添付",[30,1822,1823,1826],{},[33,1824,1825],{},"会議録音の整理",": 30 分の会議音声から議題ごとに区間を切り出してアーカイブ",[30,1828,1829,1832],{},[33,1830,1831],{},"語学学習素材",": リスニング教材の特定フレーズだけを繰り返し練習するために切り出す",[23,1834,1835],{"id":1835},"なぜブラウザ内でトリミングするのか",[11,1837,1838],{},"音声ファイルには発話内容そのものが記録されています。インタビュー、取材、商談、カウンセリング、医療相談。どれも機密性が高く、当事者以外に聞かれることを想定していない音声です。",[11,1840,1841,1842,1845],{},"「一部だけ切り出したい」という作業でも、オンラインツールに預けると",[33,1843,1844],{},"入力した音声全体","が相手に渡ります。Zerosend はトリミング処理をローカルで行うため、アップロードそのものが発生せず、音源全体の機密が守られます。",[23,1847,103],{"id":103},[105,1849,1850,1856,1859,1862,1865],{},[30,1851,1852,113],{},[17,1853,1854],{"href":1735},[56,1855,1735],{},[30,1857,1858],{},"音声ファイルをドラッグ&ドロップ",[30,1860,1861],{},"開始時刻・終了時刻を指定",[30,1863,1864],{},"「トリミングを開始する」をクリック",[30,1866,1867],{},"切り出された音声をダウンロード",[23,1869,1871],{"id":1870},"ffmpegwasm-によるブラウザ内処理","ffmpeg.wasm によるブラウザ内処理",[11,1873,1874,1875,1878],{},"動画・音声処理の定番ツール ffmpeg は、本来ターミナルから使うソフトウェアです。",[33,1876,1877],{},"ffmpeg.wasm"," はこれを WebAssembly でブラウザ上で動くようにしたもので、インストール不要でネイティブアプリ並みの音声処理が手元で行えます。",[11,1880,1881],{},"Zerosend の音声トリミングも ffmpeg.wasm を通じて動作するため、音声データがサーバーに送られることはありません。機密性の高い音声もブラウザのタブを閉じれば跡形もなく消えます。",[23,1883,157],{"id":157},[11,1885,1886,1887,1890,1891,1894],{},"ffmpeg.wasm の ",[56,1888,1889],{},"-ss"," \u002F ",[56,1892,1893],{},"-to"," オプションで指定区間を抽出します。",[27,1896,1897,1899,1905],{},[30,1898,1677],{},[30,1900,1901,1904],{},[56,1902,1903],{},"-ss \u003Cstart> -i input -to \u003Cend> -c copy output"," でロスレス抽出",[30,1906,1907],{},"再エンコードなしで切り出すため処理が速く音質劣化もない",[11,1909,1910,1911,1914],{},"入力がどの形式であっても、基本的には同じ形式で書き出されます。形式を変えたいときは ",[17,1912,1913],{"href":1544},"音声形式変換"," と組み合わせてください。",[23,1916,1917],{"id":1917},"使いどころ",[27,1919,1920,1926,1932,1938],{},[30,1921,1922,1925],{},[33,1923,1924],{},"インタビューの引用",": 60 分音源から 30 秒の引用箇所を切り出す",[30,1927,1928,1931],{},[33,1929,1930],{},"不要区間の除去",": 録音冒頭の環境音や末尾の雑音をカット",[30,1933,1934,1937],{},[33,1935,1936],{},"ポッドキャスト編集",": 冗長な「えー」「あのー」を含む区間を削除 (1 区間ずつ)",[30,1939,1940,1943],{},[33,1941,1942],{},"会議議事録の根拠音声",": 要旨に関連する数分の根拠区間を抜き出す",[23,1945,180],{"id":180},[11,1947,1948,1951],{},[33,1949,1950],{},"Q. MP3 は正確にカットできますか？","\nA. MP3 はフレーム境界に依存するため、指定した時刻の直前のフレーム境界に揃います。秒単位の切り出しなら実用上問題ありません。WAV や FLAC などのロスレス形式はより正確なカットが可能です。",[11,1953,1954,1957,1958,1961],{},[33,1955,1956],{},"Q. 音質は落ちますか？","\nA. ",[56,1959,1960],{},"-c copy"," によるロスレス抽出のため、再エンコードが発生せず元の音質がそのまま保持されます。MP3 を MP3 のまま切り出しても音質の劣化はありません。",[11,1963,1964,1967],{},[33,1965,1966],{},"Q. 複数区間を切り出して連結できる？","\nA. 現状は 1 区間のみです。複数区間を抽出したい場合は 1 つずつ切り出してから別途連結してください。",[11,1969,1970,1973],{},[33,1971,1972],{},"Q. フェードイン\u002Fフェードアウトを追加できますか？","\nA. 現状は非対応です。必要なら切り出した音声を別の編集ツールで処理してください。",[11,1975,1976,1979,1980,1982,1983,1985],{},[33,1977,1978],{},"Q. 動画ファイルから音声部分だけ切り出したい","\nA. 動画ファイルを入力して ",[17,1981,1913],{"href":1544}," を使うと、動画の音声トラックを指定形式で抽出できます。トリミングしたい区間があるなら、まず ",[17,1984,1750],{"href":1749}," で区間抽出 → 音声形式変換、の順がお勧めです。",[23,1987,206],{"id":206},[27,1989,1990,1995,2000],{},[30,1991,1992,1994],{},[17,1993,1913],{"href":1544}," — トリミング後に形式を変えたいとき",[30,1996,1997,1999],{},[17,1998,1750],{"href":1749}," — 映像付きの区間抽出",[30,2001,2002,2004],{},[17,2003,1743],{"href":1742}," — 動画側の処理",{"title":236,"searchDepth":237,"depth":237,"links":2006},[2007,2008,2009,2010,2011,2012,2013,2014],{"id":1794,"depth":237,"text":1794},{"id":1835,"depth":237,"text":1835},{"id":103,"depth":237,"text":103},{"id":1870,"depth":237,"text":1871},{"id":157,"depth":237,"text":157},{"id":1917,"depth":237,"text":1917},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},"Zerosend の音声トリミングツールは、音声ファイルをサーバーに送らずブラウザ内で任意の区間だけ切り出します。長尺インタビュー・会議録音・ポッドキャスト素材の整形に。Zerosend 編集部が解説。",{},"\u002Fblog\u002Faudio-trim-intro",{"title":1781,"description":2015},"audio-trim-intro","blog\u002Faudio-trim-intro",[1777,2022,262],"トリミング","3lyRp4i_uBJXVcGETt_dsJVycY31Z5iFzImR5G2TGi0",{"id":2025,"title":2026,"author":6,"body":2027,"category":247,"coverImage":248,"description":2212,"draft":250,"extension":251,"locale":252,"meta":2213,"navigation":254,"noindex":250,"path":2214,"publishedAt":256,"seo":2215,"slug":2216,"stem":2217,"tags":2218,"updatedAt":256,"__hash__":2221},"blog\u002Fblog\u002Fheic-to-jpg-intro.md","HEIC を JPG に変換する — \u002Ftools\u002Fheic-to-jpg の思想と使い方",{"type":8,"value":2028,"toc":2203},[2029,2032,2039,2043,2050,2076,2079,2082,2086,2089,2092,2094,2112,2114,2124,2144,2147,2149,2155,2161,2167,2173,2175],[11,2030,2031],{},"iPhone で撮影した写真を PC や同僚に送ったら「開けません」と言われた経験、ありますよね。iPhone の標準形式 HEIC (High Efficiency Image Container) は、Apple エコシステム外では互換性が限定的です。Windows 10 以降はアドオンが必要、画像編集ソフトも対応が遅れがちです。",[11,2033,2034,2038],{},[17,2035,2037],{"href":2036},"\u002Ftools\u002Fheic-to-jpg","Zerosend の HEIC → JPG 変換ツール"," は、この問題をブラウザ内で解決します。",[23,2040,2042],{"id":2041},"heic-とは","HEIC とは",[11,2044,2045,2046,2049],{},"HEIC は Apple が iOS 11 から採用した画像フォーマットです。HEVC (H.265) という映像圧縮技術を静止画に応用したもので、同等画質の JPG と比べてファイルサイズを約半分に抑えられます。iPhone のストレージを節約するうえで有効な形式ですが、",[33,2047,2048],{},"Apple 外のシステムでは素直に開けない","という問題を持っています。",[27,2051,2052,2058,2064,2070],{},[30,2053,2054,2057],{},[33,2055,2056],{},"Windows PC",": 標準では開けず、Microsoft Store から有償の HEVC コーデックをインストールする必要がある",[30,2059,2060,2063],{},[33,2061,2062],{},"古い画像編集ソフト",": Photoshop や Lightroom の古いバージョンは非対応",[30,2065,2066,2069],{},[33,2067,2068],{},"Web サービス",": X (Twitter)・Facebook・note など多くのプラットフォームで HEIC のアップロードが弾かれる",[30,2071,2072,2075],{},[33,2073,2074],{},"Android",": HEIC をネイティブで扱えない機種が多い",[23,2077,2078],{"id":2078},"変換が必要な主な場面",[11,2080,2081],{},"Windows の仕事用 PC で iPhone の写真を開きたいとき、ブログや SNS に iPhone 写真を投稿しようとして弾かれたとき、クライアントへ納品する写真素材のファイル形式を統一するとき——いずれも JPG への変換が最短解です。",[23,2083,2085],{"id":2084},"なぜブラウザ内で-heic-を変換するのか","なぜブラウザ内で HEIC を変換するのか",[11,2087,2088],{},"iPhone で撮った写真は、個人・家族・仕事の私的情景を含みがちです。顔、家の中、位置情報、撮影日時。これらを無料のオンライン変換サービスにアップロードすることは、事実上それらの情報を第三者に預けることを意味します。",[11,2090,2091],{},"Zerosend は、HEIC のデコードから JPG の書き出しまで、すべてブラウザ内で行います。写真自体が外に出ないため、NDA 下の撮影素材や家族の写真でも安心して使えます。",[23,2093,103],{"id":103},[105,2095,2096,2102,2105,2108,2110],{},[30,2097,2098,113],{},[17,2099,2100],{"href":2036},[56,2101,2036],{},[30,2103,2104],{},"HEIC \u002F HEIF 形式の画像をドラッグ&ドロップ (複数可)",[30,2106,2107],{},"品質 (JPG の圧縮率) を選択",[30,2109,1606],{},[30,2111,1609],{},[23,2113,157],{"id":157},[11,2115,2116,2117,2120,2121,2123],{},"HEIC のデコードはブラウザ標準ではまだ実装されていないため、",[56,2118,2119],{},"heic2any"," ライブラリを読み込んで使っています。",[56,2122,2119],{}," は libheif を WebAssembly 化したもので、ブラウザ内で HEIC を Blob として展開できます。",[27,2125,2126,2129,2134,2137],{},[30,2127,2128],{},"HEIC ファイルを ArrayBuffer として読み込み",[30,2130,2131,2133],{},[56,2132,2119],{}," で JPEG Blob に変換 (libheif の WASM が実行される)",[30,2135,2136],{},"必要なら Canvas 経由で品質を再指定",[30,2138,2139,2140,2143],{},"元のファイル名を保持したまま ",[56,2141,2142],{},".jpg"," 拡張子で書き出し",[11,2145,2146],{},"初回のみ libheif の WASM (約 2MB) をダウンロードするため少し待ち時間がありますが、2 回目以降はキャッシュから即時起動します。",[23,2148,180],{"id":180},[11,2150,2151,2154],{},[33,2152,2153],{},"Q. HEIC と HEIF の違いは？","\nA. HEIF がコンテナフォーマットの総称で、HEIC はその中で HEVC (H.265) でエンコードされた静止画を指します。本ツールは両方対応しています。",[11,2156,2157,2160],{},[33,2158,2159],{},"Q. Live Photo はどうなりますか？","\nA. 静止画部分のみが JPG として書き出されます。動画部分は含まれません。動画も抽出したい場合は別途 iPhone 側で「書き出す > 現状のまま」を使ってください。",[11,2162,2163,2166],{},[33,2164,2165],{},"Q. EXIF (撮影日時・位置情報) は引き継がれますか？","\nA. 一部情報は失われます。位置情報のプライバシー観点ではむしろ利点です。",[11,2168,2169,2172],{},[33,2170,2171],{},"Q. 複数ファイルまとめて変換できますか？","\nA. はい。ZIP で一括ダウンロードできます。数十枚程度までは快適に処理できます。",[23,2174,206],{"id":206},[27,2176,2177,2184,2191,2198],{},[30,2178,2179,2183],{},[17,2180,2182],{"href":2181},"\u002Ftools\u002Fimage-compress","画像圧縮"," — JPG 変換後にさらに軽くしたいとき",[30,2185,2186,2190],{},[17,2187,2189],{"href":2188},"\u002Ftools\u002Fimage-resize","画像リサイズ"," — 送信前に寸法も揃える",[30,2192,2193,2197],{},[17,2194,2196],{"href":2195},"\u002Ftools\u002Fimage-convert","画像形式変換"," — JPG \u002F PNG \u002F WebP の相互変換",[30,2199,2200,2202],{},[17,2201,226],{"href":225}," — 変換後の JPG をまとめて PDF 化する",{"title":236,"searchDepth":237,"depth":237,"links":2204},[2205,2206,2207,2208,2209,2210,2211],{"id":2041,"depth":237,"text":2042},{"id":2078,"depth":237,"text":2078},{"id":2084,"depth":237,"text":2085},{"id":103,"depth":237,"text":103},{"id":157,"depth":237,"text":157},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},"iPhone で撮った HEIC 画像を Windows \u002F Android や古いシステムで開けるよう JPG に変換するツール。サーバーに送らずブラウザ内で変換する仕組みと注意点を Zerosend 編集部が解説。",{},"\u002Fblog\u002Fheic-to-jpg-intro",{"title":2026,"description":2212},"heic-to-jpg-intro","blog\u002Fheic-to-jpg-intro",[2219,624,2220,262],"HEIC","iPhone","NbDoeVSgFPWUufoUokX_--BrmUj9tyIBQSEzbnQ7-e4",{"id":2223,"title":2224,"author":6,"body":2225,"category":247,"coverImage":248,"description":2432,"draft":250,"extension":251,"locale":252,"meta":2433,"navigation":254,"noindex":250,"path":2434,"publishedAt":256,"seo":2435,"slug":2436,"stem":2437,"tags":2438,"updatedAt":256,"__hash__":2439},"blog\u002Fblog\u002Fimage-convert-intro.md","画像形式変換をブラウザ内で — \u002Ftools\u002Fimage-convert の思想と使い方",{"type":8,"value":2226,"toc":2423},[2227,2230,2233,2259,2265,2268,2271,2274,2281,2284,2286,2305,2307,2333,2340,2342,2349,2371,2378,2380,2386,2392,2398,2404,2406],[11,2228,2229],{},"「PNG で貰ったロゴを JPEG にしたい」「iPhone で撮った HEIC を JPG で送りたい」「サイト表示を速くするために WebP に揃えたい」。画像の形式変換は地味ですが発生頻度の高い作業です。",[11,2231,2232],{},"よくあるユースケースを整理するとこうなります。",[27,2234,2235,2241,2247,2253],{},[30,2236,2237,2240],{},[33,2238,2239],{},"Web 担当者",": 納品された PNG 素材を WebP に変換してページ表示を高速化したい",[30,2242,2243,2246],{},[33,2244,2245],{},"デザイナー",": 透過 PNG のロゴを、背景色固定の JPEG に変換してメール添付したい",[30,2248,2249,2252],{},[33,2250,2251],{},"一般ユーザー",": Windows で開けない HEIC をとにかく JPG に直したい",[30,2254,2255,2258],{},[33,2256,2257],{},"開発者",": 複数形式が混在した画像フォルダを WebP に一括統一したい",[11,2260,2261,2264],{},[17,2262,2263],{"href":2195},"Zerosend の画像形式変換ツール"," は、この日常作業をブラウザ内で完結させます。一度も外に出さずに、あなたの端末だけで別形式に書き出します。",[23,2266,2267],{"id":2267},"形式を変換したい主な理由",[11,2269,2270],{},"画像形式ごとに得意な用途が異なります。目的に合った形式を選ぶだけで、ファイルサイズが 30〜50% 小さくなったり、透過表現が使えるようになったりします。変換そのものを手軽にできる環境があると、素材管理の自由度が大きく上がります。",[23,2272,2273],{"id":2273},"なぜブラウザ内で形式変換するのか",[11,2275,2276,2277,2280],{},"画像変換サービスの多くは、アップロード → サーバーで変換 → ダウンロード という流れです。社員写真、契約書のスキャン、製品デザイン案。",[33,2278,2279],{},"中身を見られたくない画像ほど、オンライン変換ツールに投げづらい","のが現実です。",[11,2282,2283],{},"Zerosend は、変換処理そのものがブラウザ内で完結するため、機密性の高い素材でもそのまま使えます。DevTools の Network タブを開いたまま変換しても、画像本体がアップロードされていないことを自分で確認できます。",[23,2285,103],{"id":103},[105,2287,2288,2294,2297,2300,2302],{},[30,2289,2290,113],{},[17,2291,2292],{"href":2195},[56,2293,2195],{},[30,2295,2296],{},"画像をドラッグ&ドロップ (複数可)",[30,2298,2299],{},"出力形式 (JPEG \u002F PNG \u002F WebP) と品質を選択",[30,2301,1606],{},[30,2303,2304],{},"結果を ZIP でまとめてダウンロード",[23,2306,1612],{"id":1612},[27,2308,2309,2315,2321,2327],{},[30,2310,2311,2314],{},[33,2312,2313],{},"JPEG",": 写真・背景画像。透過不要。古いブラウザ\u002Fアプリ互換性が最重要なら",[30,2316,2317,2320],{},[33,2318,2319],{},"PNG",": ロゴ・UI パーツ・透過必要なグラフィック。可逆圧縮",[30,2322,2323,2326],{},[33,2324,2325],{},"WebP",": 汎用。JPEG より 25〜35% 小さくなり、透過も扱える。モダン用途の標準",[30,2328,2329,2332],{},[33,2330,2331],{},"AVIF",": 更に小さいが生成コストが高く、ブラウザ対応がまだ揃いきらない",[11,2334,2335,2336,2339],{},"ブログや EC で表示速度を気にするなら ",[33,2337,2338],{},"WebP 一択","と言って差し支えありません。",[23,2341,157],{"id":157},[11,2343,2344,2345,2348],{},"Canvas API の ",[56,2346,2347],{},"canvas.toBlob(callback, 'image\u002Fwebp', quality)"," を使って変換しています。ブラウザ標準のエンコーダなので、外部ライブラリ依存もありません。",[27,2350,2351,2358,2365],{},[30,2352,2353,2354,2357],{},"入力画像を ",[56,2355,2356],{},"\u003Cimg>"," として読み込み",[30,2359,2360,2361,2364],{},"同寸の ",[56,2362,2363],{},"\u003Ccanvas>"," に描画",[30,2366,2367,2370],{},[56,2368,2369],{},"toBlob"," で出力形式と品質を指定して書き出し",[11,2372,2373,2374,2377],{},"HEIC 入力のみ別ツール (",[17,2375,2376],{"href":2036},"HEIC → JPG",") に振り分けています。HEIC デコーダがブラウザ標準にまだ入っていないため、別ライブラリを読み込む必要があるためです。",[23,2379,180],{"id":180},[11,2381,2382,2385],{},[33,2383,2384],{},"Q. WebP に変換するメリットは？","\nA. 同じ視覚品質で JPEG より 25〜35% 小さくなります。透過も扱えるため PNG の代替にもなり、モダンブラウザはすべて対応済みです。ブログや EC では積極的に使う価値があります。",[11,2387,2388,2391],{},[33,2389,2390],{},"Q. 透過 PNG を JPEG にしたらどうなる？","\nA. 透過部分は白で塗られます。意図しない結果になりやすいので注意してください。透過を維持したい場合は WebP か PNG のままにしてください。",[11,2393,2394,2397],{},[33,2395,2396],{},"Q. 元のメタデータ (EXIF) は引き継がれる？","\nA. 落ちます。位置情報漏れの予防としてはむしろ利点です。",[11,2399,2400,2403],{},[33,2401,2402],{},"Q. バッチ処理の上限は？","\nA. 端末のメモリ次第ですが、実用上は 100 枚前後までを推奨します。",[23,2405,206],{"id":206},[27,2407,2408,2413,2418],{},[30,2409,2410,2412],{},[17,2411,2182],{"href":2181}," — 品質指定で再エンコードしてサイズ削減",[30,2414,2415,2417],{},[17,2416,2189],{"href":2188}," — 形式変換と同時に寸法も揃えたいときは先にこちら",[30,2419,2420,2422],{},[17,2421,2376],{"href":2036}," — iPhone 写真専用の変換",{"title":236,"searchDepth":237,"depth":237,"links":2424},[2425,2426,2427,2428,2429,2430,2431],{"id":2267,"depth":237,"text":2267},{"id":2273,"depth":237,"text":2273},{"id":103,"depth":237,"text":103},{"id":1612,"depth":237,"text":1612},{"id":157,"depth":237,"text":157},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},"Zerosend の画像形式変換ツールは、JPEG \u002F PNG \u002F WebP \u002F AVIF をサーバーに送らず相互変換します。用途別の形式選び、透過・圧縮率の違いを Zerosend 編集部が整理します。",{},"\u002Fblog\u002Fimage-convert-intro",{"title":2224,"description":2432},"image-convert-intro","blog\u002Fimage-convert-intro",[624,901,2325,262],"xN0-q4ewAvDZNl6TjIn0v_ArxA8uRFuMBmge7YzSp3k",{"id":2441,"title":2442,"author":6,"body":2443,"category":247,"coverImage":248,"description":2654,"draft":250,"extension":251,"locale":252,"meta":2655,"navigation":254,"noindex":250,"path":2656,"publishedAt":256,"seo":2657,"slug":2658,"stem":2659,"tags":2660,"updatedAt":256,"__hash__":2662},"blog\u002Fblog\u002Fimage-edit-intro.md","画像の切り抜き・回転・反転をブラウザ内で — \u002Ftools\u002Fimage-edit の思想と使い方",{"type":8,"value":2444,"toc":2646},[2445,2448,2454,2456,2494,2497,2500,2506,2509,2511,2548,2550,2586,2589,2591,2597,2607,2613,2619,2625,2627],[11,2446,2447],{},"SNS アイコンの正方形切り出し、履歴書の証明写真の比率合わせ、商品画像の回転、スキャン画像の左右反転。Photoshop を開くほどでもないのに地味に面倒な作業ですよね。",[11,2449,2450,2453],{},[17,2451,2452],{"href":195},"Zerosend の画像編集ツール"," は、この 3 操作を 1 画面に集約してブラウザ内で完結させます。",[23,2455,1794],{"id":1794},[27,2457,2458,2464,2470,2476,2482,2488],{},[30,2459,2460,2463],{},[33,2461,2462],{},"SNS アイコン・プロフィール画像",": Instagram や Twitter は正方形が基本。1:1 プリセットでワンクリック切り抜き",[30,2465,2466,2469],{},[33,2467,2468],{},"証明写真のトリミング",": 就活・パスポート申請用に 3:4 比率で切り抜き。顔が含まれるデータをサーバーに送りたくないときに特に有効",[30,2471,2472,2475],{},[33,2473,2474],{},"スキャン画像の向き修正",": スキャナが横向きで読み込んだ場合、90° 回転で即座に修正",[30,2477,2478,2481],{},[33,2479,2480],{},"商品画像の整形",": EC サイト用に余白をカットして正方形化",[30,2483,2484,2487],{},[33,2485,2486],{},"鏡像反転",": 文字が逆に写り込んだ画像を水平反転で修正",[30,2489,2490,2493],{},[33,2491,2492],{},"ブログ・資料のサムネイル",": 16:9 プリセットで統一感のある横長画像を作成",[23,2495,2496],{"id":2496},"なぜブラウザ内で編集するのか",[11,2498,2499],{},"トリミングは個人情報と密接です。証明写真を切り出すなら顔、名刺をスキャンするなら氏名・連絡先、社内資料の一部を切り出すなら機密情報が含まれます。",[11,2501,2502,2503,94],{},"これらを「画像を切り抜くだけ」のオンラインツールにアップロードすると、切り抜き前の原版が相手のサーバーに残る可能性があります。オンラインツールはビジネスモデル上、アップロード済みのファイルをログ・解析・AI 学習に回しても契約上問題にならないケースが多く、",[33,2504,2505],{},"利用者側からはその境界が見えません",[11,2507,2508],{},"Zerosend は編集処理そのものをローカルで行うことで、この不透明性を取り除きます。",[23,2510,103],{"id":103},[105,2512,2513,2519,2522,2545],{},[30,2514,2515,113],{},[17,2516,2517],{"href":195},[56,2518,195],{},[30,2520,2521],{},"画像をドラッグ&ドロップ",[30,2523,2524,2525],{},"3 つの操作から選ぶ:\n",[27,2526,2527,2533,2539],{},[30,2528,2529,2532],{},[33,2530,2531],{},"切り抜き",": 矩形を選択範囲として指定",[30,2534,2535,2538],{},[33,2536,2537],{},"回転",": 90° \u002F 180° \u002F 270° の 3 ステップ",[30,2540,2541,2544],{},[33,2542,2543],{},"反転",": 水平 \u002F 垂直",[30,2546,2547],{},"プレビューで結果を確認してダウンロード",[23,2549,157],{"id":157},[27,2551,2552,2564,2573],{},[30,2553,2554,2556,2557,2559,2560,2563],{},[33,2555,2531],{},": 選択した矩形の寸法の ",[56,2558,2363],{}," を作り、",[56,2561,2562],{},"drawImage"," で元画像の該当領域を切り出し",[30,2565,2566,2568,2569,2572],{},[33,2567,2537],{},": 回転行列を ",[56,2570,2571],{},"ctx.transform"," で適用してから描画",[30,2574,2575,2577,2578,2581,2582,2585],{},[33,2576,2543],{},": ",[56,2579,2580],{},"ctx.scale(-1, 1)"," で水平、",[56,2583,2584],{},"ctx.scale(1, -1)"," で垂直",[11,2587,2588],{},"いずれも Canvas API の基本操作の組み合わせで、追加ライブラリは使っていません。処理は数十ミリ秒で完了します。",[23,2590,180],{"id":180},[11,2592,2593,2596],{},[33,2594,2595],{},"Q. 元の画像ファイルは変更されますか？","\nA. いいえ。処理はブラウザのメモリ上で行われ、ダウンロードするまで何も書き変わりません。元ファイルはそのまま手元に残ります。",[11,2598,2599,2602,2603,2606],{},[33,2600,2601],{},"Q. 対応している画像形式は？","\nA. JPEG・PNG・WebP・GIF (静止画) に対応しています。HEIC 形式の場合は先に ",[17,2604,2605],{"href":2036},"HEIC → JPG 変換"," を使ってから編集してください。",[11,2608,2609,2612],{},[33,2610,2611],{},"Q. 比率指定 (1:1, 4:3, 16:9) で切り抜けますか？","\nA. はい。プリセットボタンで一発切り替えできます。SNS アイコンは 1:1、YouTube サムネは 16:9 など。",[11,2614,2615,2618],{},[33,2616,2617],{},"Q. 複数画像をまとめて同じ比率で切り抜けますか？","\nA. 現状は 1 枚ずつです。バッチ処理は要望を見ながら検討します。",[11,2620,2621,2624],{},[33,2622,2623],{},"Q. 編集後に再度編集したい場合は？","\nA. ダウンロードしたファイルを再度ドロップすれば、何度でも編集できます。",[23,2626,206],{"id":206},[27,2628,2629,2634,2639],{},[30,2630,2631,2633],{},[17,2632,2189],{"href":2188}," — 切り抜き後に寸法を揃えたいとき",[30,2635,2636,2638],{},[17,2637,2182],{"href":2181}," — 編集後の軽量化",[30,2640,2641,2645],{},[17,2642,2644],{"href":2643},"\u002Ftools\u002Fimage-merge","画像結合"," — 複数画像を 1 枚にまとめたいとき",{"title":236,"searchDepth":237,"depth":237,"links":2647},[2648,2649,2650,2651,2652,2653],{"id":1794,"depth":237,"text":1794},{"id":2496,"depth":237,"text":2496},{"id":103,"depth":237,"text":103},{"id":157,"depth":237,"text":157},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},"Zerosend の画像編集ツールは、切り抜き・回転・反転をサーバーに送らず端末内で処理します。証明写真・SNS アイコン・商品画像のトリミングで使える基本操作を Zerosend 編集部が解説。",{},"\u002Fblog\u002Fimage-edit-intro",{"title":2442,"description":2654},"image-edit-intro","blog\u002Fimage-edit-intro",[624,2661,262],"編集","RrpC6EauzaWkAgWFfR06-Hve3OSQ4XqwZn5wmKjcYTw",{"id":2664,"title":2665,"author":6,"body":2666,"category":247,"coverImage":248,"description":2870,"draft":250,"extension":251,"locale":252,"meta":2871,"navigation":254,"noindex":250,"path":2872,"publishedAt":256,"seo":2873,"slug":2874,"stem":2875,"tags":2876,"updatedAt":256,"__hash__":2878},"blog\u002Fblog\u002Fimage-merge-intro.md","複数画像を 1 枚にまとめる — \u002Ftools\u002Fimage-merge の思想と使い方",{"type":8,"value":2667,"toc":2861},[2668,2671,2677,2680,2687,2690,2692,2715,2717,2743,2746,2750,2770,2776,2778,2804,2806,2815,2821,2830,2836,2842,2844],[11,2669,2670],{},"スマホのスクリーンショットを複数枚まとめて 1 枚の縦長画像にしたい。商品のビフォーアフター画像を横並びで 1 枚にしたい。操作マニュアルの手順画像を縦に並べて 1 ファイルにまとめたい。比較画像や before\u002Fafter の資料作りで、画像を並べたいシーンは日常的に発生します。",[11,2672,2673,2676],{},[17,2674,2675],{"href":2643},"Zerosend の画像結合ツール"," は、こうした「複数画像を 1 枚にまとめる」需要をブラウザ内で完結させます。",[23,2678,2679],{"id":2679},"なぜブラウザ内で結合するのか",[11,2681,2682,2683,2686],{},"結合対象の画像には、アプリの画面キャプチャ、社内ドキュメントのスクショ、顧客の LINE 履歴など機密性の高いものが混ざりがちです。",[33,2684,2685],{},"結合対象を全部まとめてサーバーに上げる","ということは、それだけの量の機密情報を一度に外に出すことと同じです。",[11,2688,2689],{},"Zerosend は結合処理そのものがローカルで動くため、何枚投入しても 1 枚のファイルも外に出ません。",[23,2691,103],{"id":103},[105,2693,2694,2700,2703,2706,2709,2712],{},[30,2695,2696,113],{},[17,2697,2698],{"href":2643},[56,2699,2643],{},[30,2701,2702],{},"画像を複数枚ドラッグ&ドロップ",[30,2704,2705],{},"結合方向を選ぶ (縦に連結 \u002F 横に連結 \u002F グリッド)",[30,2707,2708],{},"順序が違う場合はドラッグで並べ替え",[30,2710,2711],{},"「結合を開始する」をクリック",[30,2713,2714],{},"1 枚の画像としてダウンロード",[23,2716,157],{"id":157},[27,2718,2719,2722,2728,2734,2737],{},[30,2720,2721],{},"各入力画像の寸法を計測",[30,2723,2724,2725,2727],{},"結合後の ",[56,2726,2363],{}," サイズを計算 (縦連結なら幅は最大・高さは合計)",[30,2729,2730,2731,2733],{},"画像を順に ",[56,2732,2562],{}," で配置",[30,2735,2736],{},"幅\u002F高さが揃わない場合は縦横比を保って自動センタリング",[30,2738,2739,2742],{},[56,2740,2741],{},"canvas.toBlob()"," で PNG \u002F JPEG として書き出し",[11,2744,2745],{},"全処理は Canvas API の組み合わせで完結します。100 枚程度の結合まで現実的です。",[23,2747,2749],{"id":2748},"縦結合横結合の使い分け","縦結合・横結合の使い分け",[27,2751,2752,2758,2764],{},[30,2753,2754,2757],{},[33,2755,2756],{},"縦に連結",": スマホのスクロールスクリーンショットをつなぐ、手順説明の連番画像をまとめる",[30,2759,2760,2763],{},[33,2761,2762],{},"横に連結",": ビフォー\u002Fアフターを並べる、比較検討資料を 1 枚にする",[30,2765,2766,2769],{},[33,2767,2768],{},"グリッド",": 複数カットを整然と並べて SNS 投稿やカタログ素材にする",[11,2771,2772,2773,2775],{},"サイズが異なる画像は、余白を自動で埋めて揃えます。事前に ",[17,2774,2189],{"href":2188}," で寸法を統一しておくと、余白なしにきれいに仕上がります。",[23,2777,1917],{"id":1917},[27,2779,2780,2786,2792,2798],{},[30,2781,2782,2785],{},[33,2783,2784],{},"スクショ集約",": アプリのフロー解説で、複数画面を 1 枚にまとめて Slack に貼る",[30,2787,2788,2791],{},[33,2789,2790],{},"比較画像",": ビフォー\u002Fアフターを横並びで 1 枚に",[30,2793,2794,2797],{},[33,2795,2796],{},"SNS 投稿",": Instagram の 1 枚投稿でも複数カットを見せる",[30,2799,2800,2803],{},[33,2801,2802],{},"申請書類",": 表紙と本文を 1 画像にまとめて提出",[23,2805,180],{"id":180},[11,2807,2808,2811,2812,2814],{},[33,2809,2810],{},"Q. 結合後のファイルサイズはどのくらいになりますか？","\nA. 入力枚数と解像度に比例して大きくなります。多数枚を結合した場合は ",[17,2813,2182],{"href":2181}," で軽量化するのがおすすめです。",[11,2816,2817,2820],{},[33,2818,2819],{},"Q. 何枚まで結合できますか？","\nA. ツールに上限は設けていませんが、ブラウザのメモリに依存します。100 枚程度までは現実的に動作します。",[11,2822,2823,2826,2827,2829],{},[33,2824,2825],{},"Q. 画像サイズが違うものを結合するとどうなる？","\nA. 縦連結では幅を最大に合わせ、余白部分は透明 (PNG) または白 (JPEG) になります。事前に ",[17,2828,2189],{"href":2188}," で揃えておくときれいに仕上がります。",[11,2831,2832,2835],{},[33,2833,2834],{},"Q. 間に余白を入れられる？","\nA. はい。境界の色と幅を指定できます。",[11,2837,2838,2841],{},[33,2839,2840],{},"Q. グリッドの行数・列数は指定できる？","\nA. はい。例えば 4 枚を 2×2 のグリッドに配置できます。",[23,2843,206],{"id":206},[27,2845,2846,2851,2856],{},[30,2847,2848,2850],{},[17,2849,2189],{"href":2188}," — 結合前にサイズを揃える",[30,2852,2853,2855],{},[17,2854,2182],{"href":2181}," — 結合後の巨大ファイルを軽くする",[30,2857,2858,2860],{},[17,2859,226],{"href":225}," — 結合の代わりに PDF 1 枚にまとめる選択肢も",{"title":236,"searchDepth":237,"depth":237,"links":2862},[2863,2864,2865,2866,2867,2868,2869],{"id":2679,"depth":237,"text":2679},{"id":103,"depth":237,"text":103},{"id":157,"depth":237,"text":157},{"id":2748,"depth":237,"text":2749},{"id":1917,"depth":237,"text":1917},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},"Zerosend の画像結合ツールは、複数の画像をサーバーに送らずブラウザ内で縦\u002F横に連結します。比較画像・ビフォーアフター・スマホのスクリーンショット集約に。Zerosend 編集部が解説。",{},"\u002Fblog\u002Fimage-merge-intro",{"title":2665,"description":2870},"image-merge-intro","blog\u002Fimage-merge-intro",[624,2877,262],"結合","BdOzeJZQnsoFfwi5pz3V87puNcR5EgH2JaJgn9GjCok",{"id":2880,"title":2881,"author":6,"body":2882,"category":247,"coverImage":248,"description":3068,"draft":250,"extension":251,"locale":252,"meta":3069,"navigation":254,"noindex":250,"path":3070,"publishedAt":256,"seo":3071,"slug":3072,"stem":3073,"tags":3074,"updatedAt":256,"__hash__":3075},"blog\u002Fblog\u002Fimage-resize-intro.md","画像リサイズをブラウザ内で — \u002Ftools\u002Fimage-resize の思想と使い方",{"type":8,"value":2883,"toc":3058},[2884,2887,2893,2896,2902,2909,2911,2930,2933,2971,2973,2979,3004,3007,3010,3013,3015,3021,3027,3033,3039,3041],[11,2885,2886],{},"SNS に投稿したい、社内 Wiki に貼りたい、EC サイトの商品画像に使いたい、メールに添付したい。用途ごとに必要な画像サイズは違います。スマホで撮った 4000×3000 ピクセルの写真をそのままアップすると、受け側サーバーで勝手に縮小されたり、表示が重くなったりします。",[11,2888,2889,2892],{},[17,2890,2891],{"href":2188},"Zerosend の画像リサイズツール"," は、この「用途に合う寸法に先に揃えておきたい」需要をブラウザ内で完結させます。",[23,2894,2895],{"id":2895},"なぜブラウザ内でリサイズするのか",[11,2897,2898,2899,94],{},"画像は、送信前に必要な解像度まで落としておくのが基本です。受け側サーバーの自動縮小に任せると、圧縮アルゴリズムを自分で選べず、結果も見えません。何より、",[33,2900,2901],{},"元の高解像度がサーバー側に残ります",[11,2903,2904,2905,2908],{},"顔写真、社員証、内装写真、診断書のスキャン。個人情報が含まれる画像を、ブラウザの「縮小してアップロード」機能付きサービスに投げることは、結果的に",[33,2906,2907],{},"原寸画像をそのままアップロードしている","のと同じです。Zerosend では、リサイズ処理そのものをあなたの端末で行うことで、アップロードする画像が本当に縮小済みであることを保証します。",[23,2910,103],{"id":103},[105,2912,2913,2919,2922,2925,2928],{},[30,2914,2915,113],{},[17,2916,2917],{"href":2188},[56,2918,2188],{},[30,2920,2921],{},"画像をドラッグ&ドロップ (複数ファイル対応)",[30,2923,2924],{},"目標サイズを指定 — 「幅」「高さ」「長辺」「短辺」のいずれかを固定",[30,2926,2927],{},"「リサイズを開始する」をクリック",[30,2929,2304],{},[340,2931,2932],{"id":2932},"用途別の推奨サイズ",[27,2934,2935,2941,2947,2953,2959,2965],{},[30,2936,2937,2940],{},[33,2938,2939],{},"X \u002F Twitter",": 長辺 1600px",[30,2942,2943,2946],{},[33,2944,2945],{},"Instagram",": 正方形 1080px",[30,2948,2949,2952],{},[33,2950,2951],{},"LinkedIn \u002F Facebook",": 長辺 1200px",[30,2954,2955,2958],{},[33,2956,2957],{},"ブログ本文",": 幅 800〜1200px",[30,2960,2961,2964],{},[33,2962,2963],{},"メールの添付",": 長辺 1024px 程度 (画質維持しつつ 500KB 以下に収まりやすい)",[30,2966,2967,2970],{},[33,2968,2969],{},"ECサイトのサムネ",": 幅 400〜600px",[23,2972,157],{"id":157},[11,2974,2975,2976,2978],{},"画像リサイズは、Canvas API の ",[56,2977,2562],{}," を使ったブラウザ標準のバイキュービック補間で行っています。外部ライブラリの呼び出しも、サーバーへの問い合わせもありません。",[27,2980,2981,2987,2993,2999],{},[30,2982,2983,2984,2986],{},"画像を ",[56,2985,2356],{}," 要素として読み込む",[30,2988,2989,2990,2992],{},"目標サイズの ",[56,2991,2363],{}," を作成",[30,2994,2995,2998],{},[56,2996,2997],{},"ctx.drawImage(img, 0, 0, targetW, targetH)"," で描画",[30,3000,3001,3003],{},[56,3002,2741],{}," で出力形式 (JPEG \u002F PNG \u002F WebP) を指定して Blob に",[11,3005,3006],{},"一括処理は Promise.all ではなく順次実行しているため、数十枚でもメモリを圧迫しません。",[23,3008,3009],{"id":3009},"縦横比の維持について",[11,3011,3012],{},"リサイズで気をつけるべき最大のポイントは「アスペクト比の崩れ」です。幅だけを変えて高さはそのままにすると、人物が横に伸びたり商品が歪んだりします。本ツールでは既定で縦横比を維持するため、「幅を指定する」だけで高さは自動計算されます。強制的にトリミングするモードも選べるので、SNS の正方形サムネイルを作る際にも対応できます。",[23,3014,180],{"id":180},[11,3016,3017,3020],{},[33,3018,3019],{},"Q. 縦横比は保持されますか？","\nA. 既定で保持されます。「幅を合わせる」を選べば高さは自動で計算されます。",[11,3022,3023,3026],{},[33,3024,3025],{},"Q. EXIF (撮影情報) は？","\nA. リサイズ時に落ちます。プライバシー保護の観点ではむしろ利点です。",[11,3028,3029,3032],{},[33,3030,3031],{},"Q. 拡大もできますか？","\nA. できますが推奨しません。拡大は情報を増やせないため、AI 超解像を使わない限り画質は改善しません。",[11,3034,3035,3038],{},[33,3036,3037],{},"Q. 複数ファイルを一括処理できますか？","\nA. はい。ドラッグ&ドロップで複数ファイルを投入すると、同じ設定で一括リサイズして ZIP でまとめてダウンロードできます。",[23,3040,206],{"id":206},[27,3042,3043,3048,3053],{},[30,3044,3045,3047],{},[17,3046,2182],{"href":2181}," — リサイズ後にさらに軽くしたいときに",[30,3049,3050,3052],{},[17,3051,2196],{"href":2195}," — WebP \u002F JPEG \u002F PNG の変換",[30,3054,3055,3057],{},[17,3056,196],{"href":195}," — 切り抜き・回転・反転",{"title":236,"searchDepth":237,"depth":237,"links":3059},[3060,3061,3064,3065,3066,3067],{"id":2895,"depth":237,"text":2895},{"id":103,"depth":237,"text":103,"children":3062},[3063],{"id":2932,"depth":418,"text":2932},{"id":157,"depth":237,"text":157},{"id":3009,"depth":237,"text":3009},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},"Zerosend の画像リサイズツールは、画像をサーバーに送らず端末内で寸法変更します。用途別の推奨サイズ、一括処理、品質を落とさないリサイズのコツを Zerosend 編集部が解説。",{},"\u002Fblog\u002Fimage-resize-intro",{"title":2881,"description":3068},"image-resize-intro","blog\u002Fimage-resize-intro",[624,625,262],"_Uhop01N2UVvIiAaq5jlsmlRm_wNoZwYVJzFkekar6Y",{"id":3077,"title":3078,"author":6,"body":3079,"category":247,"coverImage":248,"description":3273,"draft":250,"extension":251,"locale":252,"meta":3274,"navigation":254,"noindex":250,"path":3275,"publishedAt":256,"seo":3276,"slug":3277,"stem":3278,"tags":3279,"updatedAt":256,"__hash__":3281},"blog\u002Fblog\u002Fimage-to-pdf-intro.md","画像を 1 つの PDF にまとめる — \u002Ftools\u002Fimage-to-pdf の思想と使い方",{"type":8,"value":3080,"toc":3265},[3081,3084,3089,3091,3117,3120,3122,3129,3136,3138,3161,3163,3169,3200,3203,3205,3211,3220,3226,3235,3237],[11,3082,3083],{},"スマホで撮ったレシート 10 枚を経費精算で PDF にまとめる、スキャンした書類 15 枚を 1 つの PDF にまとめて申請する、商品写真を PDF カタログにする。「画像 → PDF」の変換は、個人から業務まで頻繁に発生する作業です。",[11,3085,3086,1546],{},[17,3087,3088],{"href":225},"Zerosend の画像 → PDF 変換ツール",[23,3090,25],{"id":25},[27,3092,3093,3099,3105,3111],{},[30,3094,3095,3098],{},[33,3096,3097],{},"写真をポートフォリオ PDF に",": デザイナーや写真家が作品画像を選択して 1 ファイルにまとめ、クライアントへの提案や審査用に配布する",[30,3100,3101,3104],{},[33,3102,3103],{},"スキャン画像を 1 ファイルに集約",": 複数ページにわたる契約書・申請書をスキャンした画像を 1 つの PDF にまとめて提出する",[30,3106,3107,3110],{},[33,3108,3109],{},"レシート・領収書の経費精算",": スマホで撮影したレシートをまとめて月次経費書類として提出する",[30,3112,3113,3116],{},[33,3114,3115],{},"複数画像を順番管理して配布",": ドラッグ&ドロップで並び順を調整しながら、説明資料やマニュアルを PDF にまとめる",[11,3118,3119],{},"複数の画像ファイルを 1 回の操作で 1 つの PDF に変換できるため、枚数が多いほど手作業との差が際立ちます。",[23,3121,1577],{"id":1577},[11,3123,3124,3125,3128],{},"画像 → PDF 変換の入力は、写真・スキャン・スクリーンショットです。つまり",[33,3126,3127],{},"画像 1 枚ずつが個別の機密情報","を持ちます。レシートなら店名・金額・日時・クレカ下 4 桁、スキャン書類なら本文全体、スクショなら画面に写っているすべて。",[11,3130,3131,3132,3135],{},"それらをまとめてオンライン PDF 化サービスに投げるのは、",[33,3133,3134],{},"機密情報セットをまとめて外に出す","ことに他なりません。Zerosend ではローカルで PDF 組み立てまで行うため、アップロードは発生しません。",[23,3137,103],{"id":103},[105,3139,3140,3146,3149,3152,3155,3158],{},[30,3141,3142,113],{},[17,3143,3144],{"href":225},[56,3145,225],{},[30,3147,3148],{},"画像を複数枚ドラッグ&ドロップ (JPEG \u002F PNG \u002F WebP)",[30,3150,3151],{},"ページサイズ (A4 \u002F レター \u002F 画像原寸) と向きを選ぶ",[30,3153,3154],{},"並び順をドラッグで調整",[30,3156,3157],{},"「PDF 化を開始する」をクリック",[30,3159,3160],{},"1 つの PDF ファイルとしてダウンロード",[23,3162,157],{"id":157},[11,3164,3165,3168],{},[56,3166,3167],{},"pdf-lib"," を使って PDF を組み立てています。",[27,3170,3171,3174,3180,3191,3194],{},[30,3172,3173],{},"各画像を ArrayBuffer で読み込み",[30,3175,3176,3179],{},[56,3177,3178],{},"PDFDocument.create()"," で新規ドキュメントを作成",[30,3181,3182,3183,3186,3187,3190],{},"ページごとに ",[56,3184,3185],{},"pdfDoc.embedJpg()"," または ",[56,3188,3189],{},"embedPng()"," で画像を埋め込み",[30,3192,3193],{},"ページサイズに合わせて自動で縮小・センタリング",[30,3195,3196,3199],{},[56,3197,3198],{},".save()"," で最終的な PDF バイト列に",[11,3201,3202],{},"画像のサイズ指定は縦横比を保持したまま、指定ページサイズに収まるよう計算されます。",[23,3204,180],{"id":180},[11,3206,3207,3210],{},[33,3208,3209],{},"Q. 画像の順序は変えられますか？","\nA. はい。追加した順に並びますが、ドラッグで並べ替えできます。",[11,3212,3213,3216,3217,3219],{},[33,3214,3215],{},"Q. 画像の向き (縦\u002F横) を個別に変えられますか？","\nA. ページ単位の向きは全体で統一されます。個別に回転したい場合は ",[17,3218,196],{"href":195}," で先に回転してから PDF 化してください。",[11,3221,3222,3225],{},[33,3223,3224],{},"Q. OCR (文字認識) はかかる？","\nA. かかりません。画像はそのまま PDF に埋め込まれます。検索可能 PDF にしたい場合は別途 OCR ツールを通してください (プライバシー観点では、OCR もローカルで完結するツールを選ぶべきです)。",[11,3227,3228,3231,3232,3234],{},[33,3229,3230],{},"Q. 圧縮は？","\nA. 元画像がそのまま埋め込まれるため、PDF が大きくなりがちです。事前に ",[17,3233,2182],{"href":2181}," してから投入すると、最終 PDF が軽くなります。",[23,3236,206],{"id":206},[27,3238,3239,3244,3251,3258],{},[30,3240,3241,3243],{},[17,3242,2182],{"href":2181}," — PDF 化前に画像を軽くする",[30,3245,3246,3250],{},[17,3247,3249],{"href":3248},"\u002Ftools\u002Fpdf-compress","PDF 圧縮"," — 生成した PDF をさらに軽くする",[30,3252,3253,3257],{},[17,3254,3256],{"href":3255},"\u002Ftools\u002Fpdf-merge","PDF 結合"," — 既存 PDF と結合する",[30,3259,3260,3264],{},[17,3261,3263],{"href":3262},"\u002Ftools\u002Fpdf-to-image","PDF → 画像"," — 逆変換",{"title":236,"searchDepth":237,"depth":237,"links":3266},[3267,3268,3269,3270,3271,3272],{"id":25,"depth":237,"text":25},{"id":1577,"depth":237,"text":1577},{"id":103,"depth":237,"text":103},{"id":157,"depth":237,"text":157},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},"Zerosend の画像 → PDF 変換ツールは、複数画像をサーバーに送らず 1 つの PDF にまとめます。スキャン画像の PDF 化・レシートまとめ・申請書類の体裁整え。Zerosend 編集部が解説。",{},"\u002Fblog\u002Fimage-to-pdf-intro",{"title":3078,"description":3273},"image-to-pdf-intro","blog\u002Fimage-to-pdf-intro",[3280,624,901,262],"PDF","W4LB1AnTY2syLdRrdjvKSLPfsnRiA8kspm8q42K-X9g",{"id":3283,"title":3284,"author":6,"body":3285,"category":247,"coverImage":248,"description":3420,"draft":250,"extension":251,"locale":252,"meta":3421,"navigation":254,"noindex":250,"path":3422,"publishedAt":256,"seo":3423,"slug":3424,"stem":3425,"tags":3426,"updatedAt":256,"__hash__":3427},"blog\u002Fblog\u002Fpdf-compress-intro.md","PDF を圧縮する — \u002Ftools\u002Fpdf-compress の思想と使い方",{"type":8,"value":3286,"toc":3413},[3287,3290,3294,3297,3304,3307,3309,3329,3332,3336,3339,3359,3366,3368,3374,3380,3386,3392,3394],[11,3288,3289],{},"メールで PDF を送ろうとしたら「ファイルサイズが大きすぎます」と弾かれた、Slack の無料枠を食い潰す、見積書 PDF が 30MB あって顧客にストレスを与えている。PDF のサイズ圧縮は、業務の摩擦を減らすのに効く小さな改善です。",[11,3291,3292,1546],{},[17,3293,1069],{"href":3248},[23,3295,3296],{"id":3296},"なぜブラウザ内で圧縮するのか",[11,3298,3299,3300,3303],{},"PDF 圧縮サービスの大半はアップロード型です。つまり",[33,3301,3302],{},"契約書・見積書・健康診断・給与明細を他社サーバーに預ける","ことになります。「削除します」と書かれていても、その履行をユーザーが確認する術はありません。",[11,3305,3306],{},"Zerosend は圧縮処理をローカルで行うため、機密性の高い PDF をそのまま投入できます。DevTools で本当にアップロードされていないことを確認してから使ってください。",[23,3308,103],{"id":103},[105,3310,3311,3317,3320,3323,3326],{},[30,3312,3313,113],{},[17,3314,3315],{"href":3248},[56,3316,3248],{},[30,3318,3319],{},"PDF をドラッグ&ドロップ",[30,3321,3322],{},"画質レベルを選択 (高品質 \u002F 標準 \u002F 低品質)",[30,3324,3325],{},"「圧縮を開始する」をクリック",[30,3327,3328],{},"軽量化された PDF をダウンロード",[11,3330,3331],{},"スキャン由来の画像 PDF に特に効果があります。ベクタ主体のテキスト PDF はもともと軽いので削減率は控えめです。",[23,3333,3335],{"id":3334},"仕組み-ラスタライズによる再構築","仕組み — ラスタライズによる再構築",[11,3337,3338],{},"Zerosend の PDF 圧縮は、ページを一度画像化して再構築する方式です。",[27,3340,3341,3348,3351,3356],{},[30,3342,3343,3344,3347],{},"元 PDF を ",[56,3345,3346],{},"pdfjs-dist"," で各ページをキャンバスに描画",[30,3349,3350],{},"描画結果を指定品質で JPEG にエンコード",[30,3352,3353,3355],{},[56,3354,3167],{}," で新しい PDF を組み立て、JPEG ページを埋め込み",[30,3357,3358],{},"元 PDF の metadata (タイトル・作成者など) は引き継ぐ",[11,3360,3361,3362,3365],{},"このアプローチの強みはサイズ削減率の高さ、弱みは",[33,3363,3364],{},"ベクタ情報が失われること"," (テキスト選択・検索不可になる) です。テキスト検索性を維持したい場合は、元 PDF のまま送るか、軽量化の必要性を再検討してください。",[23,3367,180],{"id":180},[11,3369,3370,3373],{},[33,3371,3372],{},"Q. 削減率はどのくらい？","\nA. 画像主体のスキャン PDF なら 50〜80% 減ることもあります。テキスト主体の PDF は 10〜30% 程度です。",[11,3375,3376,3379],{},[33,3377,3378],{},"Q. 圧縮後にテキスト検索できなくなった","\nA. ラスタライズ方式の副作用です。「標準」設定では解像度を維持するため読みやすさは保ちますが、テキストとしては検索できません。",[11,3381,3382,3385],{},[33,3383,3384],{},"Q. OCR は含まれますか？","\nA. 非対応です。圧縮後の PDF を検索可能にしたい場合は、別途 OCR ツールが必要です。",[11,3387,3388,3391],{},[33,3389,3390],{},"Q. 元の PDF が暗号化されている場合は？","\nA. パスワード保護された PDF は処理できません。先にロック解除が必要です。",[23,3393,206],{"id":206},[27,3395,3396,3401,3408],{},[30,3397,3398,3400],{},[17,3399,3256],{"href":3255}," — 圧縮前に結合しておく",[30,3402,3403,3407],{},[17,3404,3406],{"href":3405},"\u002Ftools\u002Fpdf-split","PDF 分割"," — 必要なページだけ抽出すれば圧縮も不要なことが多い",[30,3409,3410,3412],{},[17,3411,2182],{"href":2181}," — スキャン前の個別画像を軽くしておく選択肢",{"title":236,"searchDepth":237,"depth":237,"links":3414},[3415,3416,3417,3418,3419],{"id":3296,"depth":237,"text":3296},{"id":103,"depth":237,"text":103},{"id":3334,"depth":237,"text":3335},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},"Zerosend の PDF 圧縮ツールは、PDF をサーバーに送らずブラウザ内でページをラスタライズして再構築し、サイズを削減します。メール添付上限に引っかかる PDF を軽くしたいときに。",{},"\u002Fblog\u002Fpdf-compress-intro",{"title":3284,"description":3420},"pdf-compress-intro","blog\u002Fpdf-compress-intro",[3280,987,262],"VvJ1WqvmAb_Nlcrf3hFnpj4_JU9LgW9Mc6y4cTGier0",{"id":3429,"title":3430,"author":6,"body":3431,"category":247,"coverImage":248,"description":3650,"draft":250,"extension":251,"locale":252,"meta":3651,"navigation":254,"noindex":250,"path":3652,"publishedAt":256,"seo":3653,"slug":3654,"stem":3655,"tags":3656,"updatedAt":256,"__hash__":3657},"blog\u002Fblog\u002Fpdf-edit-intro.md","PDF のページを並べ替え・削除・回転 — \u002Ftools\u002Fpdf-edit の思想と使い方",{"type":8,"value":3432,"toc":3641},[3433,3436,3443,3445,3483,3485,3491,3494,3496,3534,3538,3544,3550,3552,3581,3590,3592,3598,3604,3610,3616,3622,3624],[11,3434,3435],{},"スキャンしたら逆向きになっていた、最終ページが白紙だから削除したい、契約書の章を入れ替えたい。PDF 編集の 9 割は「ページの並べ替え・削除・回転」で済みます。",[11,3437,3438,3442],{},[17,3439,3441],{"href":3440},"\u002Ftools\u002Fpdf-edit","Zerosend の PDF ページ編集ツール"," は、この基本 3 操作をブラウザ内で完結させます。",[23,3444,1794],{"id":1794},[27,3446,3447,3453,3459,3465,3471,3477],{},[30,3448,3449,3452],{},[33,3450,3451],{},"スキャン結果の向き修正",": スキャナが横向きで読み込んだページを 90° 回転して正しい向きに",[30,3454,3455,3458],{},[33,3456,3457],{},"白紙ページの削除",": スキャン時に混入した白紙ページや意図しない空白ページをまとめて削除",[30,3460,3461,3464],{},[33,3462,3463],{},"報告書の章順修正",": 後から追加した付録を適切な位置に移動。ドラッグ操作でページを並べ直す",[30,3466,3467,3470],{},[33,3468,3469],{},"配布用 PDF の整形",": 社内向けの全ページを含む PDF から、共有しても問題ないページだけを残す",[30,3472,3473,3476],{},[33,3474,3475],{},"製本・印刷準備",": 両面印刷や製本に合わせてページ順を並べ替える",[30,3478,3479,3482],{},[33,3480,3481],{},"プレゼン資料の調整",": 不要なスライドを削除して提出用スリム版を作成",[23,3484,2496],{"id":2496},[11,3486,3487,3488,94],{},"PDF 編集の対象は、ほぼ例外なく機密文書です。業務委託契約、秘密保持契約、顧客カルテ、社内規程、給与明細。これらを「ページを入れ替えるだけ」のオンラインサービスに預けると、",[33,3489,3490],{},"元の全ページが相手のサーバーに渡ります",[11,3492,3493],{},"「処理後にすぐ削除」と書かれていても、保存の痕跡や解析ログをユーザーが検証する手段はありません。Zerosend ではページ編集もローカル処理のため、この透明性の問題を構造的に回避できます。",[23,3495,103],{"id":103},[105,3497,3498,3504,3506,3509,3531],{},[30,3499,3500,113],{},[17,3501,3502],{"href":3440},[56,3503,3440],{},[30,3505,3319],{},[30,3507,3508],{},"ページサムネイル一覧が表示される",[30,3510,3511,3512],{},"操作:\n",[27,3513,3514,3520,3526],{},[30,3515,3516,3519],{},[33,3517,3518],{},"並べ替え",": ドラッグでページを入れ替え",[30,3521,3522,3525],{},[33,3523,3524],{},"削除",": 不要なページのゴミ箱アイコンをクリック",[30,3527,3528,3530],{},[33,3529,2537],{},": 各ページの回転アイコンで 90° 単位回転",[30,3532,3533],{},"「編集を完了する」をクリックして新しい PDF を出力",[23,3535,3537],{"id":3536},"pdf-lib-によるブラウザ内-pdf-処理","pdf-lib によるブラウザ内 PDF 処理",[11,3539,3540,3541,3543],{},"Zerosend の PDF ページ編集は ",[33,3542,3167],{}," というオープンソースライブラリで実装しています。pdf-lib はブラウザ上で PDF の読み込み・書き出しができる純粋な JavaScript ライブラリで、サーバーサイドの処理は一切不要です。",[11,3545,3546,3547,3549],{},"サムネイル表示には ",[33,3548,3346],{}," (PDF.js) を使い、各ページを Canvas に描画。並べ替え・削除・回転の操作を UI 上で決めてから、最後に pdf-lib で新しい PDF として書き出します。契約書や機密文書も、データが端末から出ることなく安全に編集できます。",[23,3551,157],{"id":157},[27,3553,3554,3560,3563,3569,3576],{},[30,3555,3556,3557,3559],{},"PDF を ",[56,3558,3346],{}," でレンダリングしてサムネイル一覧を表示",[30,3561,3562],{},"ページの並び・削除・回転情報を UI 上で管理",[30,3564,3565,3566,3568],{},"「完了」操作時に ",[56,3567,3167],{}," を呼び出し、元 PDF から必要なページを順にコピー",[30,3570,3571,3572,3575],{},"回転は ",[56,3573,3574],{},"page.setRotation()"," で書き込み",[30,3577,3578,3579],{},"最終 PDF として ",[56,3580,3198],{},[11,3582,3583,3584,3586,3587,3589],{},"サムネ描画 (",[56,3585,3346],{},") と PDF 組み立て (",[56,3588,3167],{},") の 2 ライブラリで役割分担しています。",[23,3591,180],{"id":180},[11,3593,3594,3597],{},[33,3595,3596],{},"Q. テキストの編集はできますか？","\nA. 本ツールはページ単位の操作 (並べ替え・削除・回転) に特化しています。文章の書き換えや署名追加、注釈入力には対応していません。",[11,3599,3600,3603],{},[33,3601,3602],{},"Q. パスワード付き PDF は使えますか？","\nA. パスワードで保護された PDF の編集には対応していません。事前にパスワードを解除してください。",[11,3605,3606,3609],{},[33,3607,3608],{},"Q. 編集履歴は残りますか？","\nA. 新しい PDF として書き出すため、元ファイルは変更されません。必要なら元ファイルを別途保存しておいてください。",[11,3611,3612,3615],{},[33,3613,3614],{},"Q. ページを複製 (同じページを 2 回入れる) できますか？","\nA. 現状は非対応です。需要があれば追加します。",[11,3617,3618,3621],{},[33,3619,3620],{},"Q. 回転の粒度は？","\nA. 90° 単位のみです。PDF の仕様上、自由角度回転は本来のページ情報を損ねる可能性があるため非対応です。",[23,3623,206],{"id":206},[27,3625,3626,3631,3636],{},[30,3627,3628,3630],{},[17,3629,3406],{"href":3405}," — 編集ではなく切り分けたいとき",[30,3632,3633,3635],{},[17,3634,3256],{"href":3255}," — 複数 PDF を結合",[30,3637,3638,3640],{},[17,3639,3249],{"href":3248}," — 編集後のサイズ削減",{"title":236,"searchDepth":237,"depth":237,"links":3642},[3643,3644,3645,3646,3647,3648,3649],{"id":1794,"depth":237,"text":1794},{"id":2496,"depth":237,"text":2496},{"id":103,"depth":237,"text":103},{"id":3536,"depth":237,"text":3537},{"id":157,"depth":237,"text":157},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},"Zerosend の PDF ページ編集ツールは、PDF のページ順序変更・削除・回転をサーバーに送らず端末内で行います。スキャン時の向きミス修正や不要ページ削除に。Zerosend 編集部が解説。",{},"\u002Fblog\u002Fpdf-edit-intro",{"title":3430,"description":3650},"pdf-edit-intro","blog\u002Fpdf-edit-intro",[3280,2661,262],"Yze0vH4wa57jdSYGGpMOWoCe3g9kWI080CC7vD4rqMI",{"id":3659,"title":3660,"author":6,"body":3661,"category":247,"coverImage":248,"description":3841,"draft":250,"extension":251,"locale":252,"meta":3842,"navigation":254,"noindex":250,"path":3843,"publishedAt":256,"seo":3844,"slug":3845,"stem":3846,"tags":3847,"updatedAt":256,"__hash__":3849},"blog\u002Fblog\u002Fpdf-split-intro.md","PDF を分割する — \u002Ftools\u002Fpdf-split の思想と使い方",{"type":8,"value":3662,"toc":3833},[3663,3666,3671,3675,3681,3684,3687,3689,3726,3730,3736,3738,3743,3771,3774,3776,3782,3788,3794,3800,3813,3815],[11,3664,3665],{},"契約書の 2〜5 ページだけ取引先に送りたい、100 ページの報告書を章ごとに分けて関係者に配りたい、スキャン時に 1 ファイルにまとめてしまった複数書類を切り分けたい。PDF の分割は業務で頻繁に発生するにもかかわらず、一般的なツールが少ない作業です。",[11,3667,3668,1546],{},[17,3669,3670],{"href":3405},"Zerosend の PDF 分割ツール",[23,3672,3674],{"id":3673},"なぜブラウザ内で-pdf-を分割するのか","なぜブラウザ内で PDF を分割するのか",[11,3676,3677,3678,94],{},"PDF の中身は、契約書・見積書・健康診断結果・給与明細・設計資料など、ほぼすべてが機密性を持ちます。これを「PDF 分割できるオンラインサービス」にアップロードすると、",[33,3679,3680],{},"元の全ページが一旦そのサービスのサーバーに渡ります",[11,3682,3683],{},"ユーザー側が「2〜5 ページだけ必要」と思っていても、サービス側は全ページにアクセスできます。無料で提供されている以上、何らかの対価 (ログ・解析・AI 学習素材) としてファイルが使われている可能性は否定できません。",[11,3685,3686],{},"Zerosend は分割処理そのものがローカルで動くため、この構造的な問題を回避できます。",[23,3688,103],{"id":103},[105,3690,3691,3697,3700,3721,3724],{},[30,3692,3693,113],{},[17,3694,3695],{"href":3405},[56,3696,3405],{},[30,3698,3699],{},"PDF ファイルをドラッグ&ドロップ",[30,3701,3702,3703],{},"分割方法を選ぶ:\n",[27,3704,3705,3711],{},[30,3706,3707,3710],{},[33,3708,3709],{},"全ページを 1 ページずつ分割"," — 100 ページなら 100 ファイル",[30,3712,3713,3716,3717,3720],{},[33,3714,3715],{},"範囲指定"," — 例: ",[56,3718,3719],{},"1-3, 5, 7-10"," で複数範囲を抽出",[30,3722,3723],{},"「分割を開始する」をクリック",[30,3725,1609],{},[23,3727,3729],{"id":3728},"pdf-lib-によるブラウザ内処理","pdf-lib によるブラウザ内処理",[11,3731,3732,3733,3735],{},"本ツールは ",[33,3734,3167],{}," というブラウザで完全動作する PDF 編集ライブラリを使っています。pdf-lib はサーバーへの問い合わせなしに PDF の読み込み・生成・ページ操作を行える純粋な JavaScript ライブラリです。元の PDF ファイルは変更されず、指定したページのみを新しい PDF として書き出します。",[23,3737,157],{"id":157},[11,3739,3740,3742],{},[56,3741,3167],{}," というブラウザで動く PDF 編集ライブラリを使っています。",[27,3744,3745,3748,3754,3760,3766],{},[30,3746,3747],{},"入力 PDF を ArrayBuffer として読み込み",[30,3749,3750,3753],{},[56,3751,3752],{},"PDFDocument.load()"," で解析",[30,3755,3756,3757,2992],{},"範囲指定に応じた新しい ",[56,3758,3759],{},"PDFDocument",[30,3761,3762,3765],{},[56,3763,3764],{},"copyPages()"," で必要なページだけコピー",[30,3767,3768,3770],{},[56,3769,3198],{}," で新しい PDF バイト列を生成",[11,3772,3773],{},"すべてメモリ上で処理し、ネットワークには一切送りません。",[23,3775,180],{"id":180},[11,3777,3778,3781],{},[33,3779,3780],{},"Q. 1 ページずつ個別のファイルに分割できますか？","\nA. できます。「全ページを 1 ページずつ分割」を選ぶと、100 ページなら 100 ファイルが生成されて ZIP でまとめてダウンロードできます。",[11,3783,3784,3787],{},[33,3785,3786],{},"Q. 元の PDF ファイルは変更されますか？","\nA. 変更されません。ブラウザのメモリ上で新しい PDF を生成するだけで、元ファイルへの書き込みは一切行いません。",[11,3789,3790,3793],{},[33,3791,3792],{},"Q. 暗号化された PDF (パスワード保護) も分割できる？","\nA. パスワードなしの PDF のみ対応。暗号化 PDF は先にロック解除が必要です。",[11,3795,3796,3799],{},[33,3797,3798],{},"Q. ページ数が非常に多い PDF (500 ページなど) は？","\nA. 処理はできますが、ブラウザのメモリ次第で時間がかかります。数百 MB 規模の PDF は端末スペック次第で詰まることがあります。",[11,3801,3802,3805,3806,1684,3809,3812],{},[33,3803,3804],{},"Q. 分割後のファイル名は？","\nA. 元ファイル名に ",[56,3807,3808],{},"-p1",[56,3810,3811],{},"-p2-5"," のようなサフィックスを付けます。",[23,3814,206],{"id":206},[27,3816,3817,3822,3828],{},[30,3818,3819,3821],{},[17,3820,3256],{"href":3255}," — 分割とは逆に、複数 PDF を 1 つに",[30,3823,3824,3827],{},[17,3825,3826],{"href":3440},"PDF ページ編集"," — ページの並べ替え・削除・回転",[30,3829,3830,3832],{},[17,3831,3249],{"href":3248}," — 分割後のファイルを軽くする",{"title":236,"searchDepth":237,"depth":237,"links":3834},[3835,3836,3837,3838,3839,3840],{"id":3673,"depth":237,"text":3674},{"id":103,"depth":237,"text":103},{"id":3728,"depth":237,"text":3729},{"id":157,"depth":237,"text":157},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},"Zerosend の PDF 分割ツールは、PDF をサーバーに送らずブラウザ内でページ単位\u002F範囲指定で分割します。機密文書の特定ページだけ共有したいときに。Zerosend 編集部が解説。",{},"\u002Fblog\u002Fpdf-split-intro",{"title":3660,"description":3841},"pdf-split-intro","blog\u002Fpdf-split-intro",[3280,3848,262],"分割","XPJKIzDxfGixIoHq5VkY0twuwi6ez2lMZK2tzEN3Q-Y",{"id":3851,"title":3852,"author":6,"body":3853,"category":247,"coverImage":248,"description":4062,"draft":250,"extension":251,"locale":252,"meta":4063,"navigation":254,"noindex":250,"path":4064,"publishedAt":256,"seo":4065,"slug":4066,"stem":4067,"tags":4068,"updatedAt":256,"__hash__":4069},"blog\u002Fblog\u002Fpdf-to-image-intro.md","PDF を画像に変換する — \u002Ftools\u002Fpdf-to-image の思想と使い方",{"type":8,"value":3854,"toc":4052},[3855,3858,3863,3866,3892,3894,3900,3903,3905,3923,3926,3946,3948,3953,3981,3984,3986,3995,4001,4007,4016,4028,4030],[11,3856,3857],{},"プレゼン資料の 1 ページだけスクリーンショット的に使いたい、PDF の一部を SNS 投稿したい、PDF を見れない環境向けに画像で送りたい。「PDF → 画像」の変換は地味に需要があります。",[11,3859,3860,1546],{},[17,3861,3862],{"href":3262},"Zerosend の PDF → 画像変換ツール",[23,3864,3865],{"id":3865},"どんな場面で役立つか",[27,3867,3868,3874,3880,3886],{},[30,3869,3870,3873],{},[33,3871,3872],{},"SNS・ブログへの資料引用",": 講演スライドや報告書の特定ページを画像として切り出し、X や Instagram にそのまま投稿できます",[30,3875,3876,3879],{},[33,3877,3878],{},"サムネイル作成",": PDF ドキュメントの表紙ページを高解像度 PNG に変換し、ウェブサイトのカバー画像として使えます",[30,3881,3882,3885],{},[33,3883,3884],{},"PDF 非対応の環境に送る",": チャットツールや古い CMS が PDF に対応していなくても、画像なら貼れます",[30,3887,3888,3891],{},[33,3889,3890],{},"PDF の内容をすばやく確認・共有",": 受け取った PDF の一部だけを画像にして、コメント付きで関係者に送る用途にも便利です",[23,3893,1577],{"id":1577},[11,3895,3896,3897,331],{},"PDF から画像を切り出したい場面は、社内資料・顧客提案書・設計図・契約書スナップショットなど、機密度が高いケースが多いものです。「PDF の特定ページを画像にしたいだけ」とオンラインツールに上げるときも、",[33,3898,3899],{},"アップロードされるのは PDF の全ページ",[11,3901,3902],{},"Zerosend は変換処理をローカルで行うため、そもそも PDF が外に出ません。",[23,3904,103],{"id":103},[105,3906,3907,3913,3915,3918,3920],{},[30,3908,3909,113],{},[17,3910,3911],{"href":3262},[56,3912,3262],{},[30,3914,3319],{},[30,3916,3917],{},"出力形式 (PNG \u002F JPEG) と解像度を選ぶ",[30,3919,1606],{},[30,3921,3922],{},"全ページの画像が ZIP で生成される",[340,3924,3925],{"id":3925},"解像度の目安",[27,3927,3928,3934,3940],{},[30,3929,3930,3933],{},[33,3931,3932],{},"72 DPI",": ウェブ掲載・SNS 投稿用。画質より軽さ優先",[30,3935,3936,3939],{},[33,3937,3938],{},"150 DPI",": 画面で読む標準品質",[30,3941,3942,3945],{},[33,3943,3944],{},"300 DPI",": 印刷品質。資料の細部が重要なとき",[23,3947,157],{"id":157},[11,3949,3950,3952],{},[56,3951,3346],{}," を使って各ページを Canvas に描画し、Canvas から画像として書き出しています。",[27,3954,3955,3958,3963,3973,3978],{},[30,3956,3957],{},"PDF を ArrayBuffer として読み込み",[30,3959,3960,3753],{},[56,3961,3962],{},"getDocument()",[30,3964,3182,3965,3968,3969,3972],{},[56,3966,3967],{},"getPage(n)"," → ",[56,3970,3971],{},"render(ctx, viewport)"," で Canvas に描画",[30,3974,3975,3977],{},[56,3976,2741],{}," で PNG \u002F JPEG 化",[30,3979,3980],{},"全ページを ZIP にまとめてダウンロード",[11,3982,3983],{},"ブラウザの描画エンジンをそのまま使うため、フォント埋め込み・ベクタ図・透過要素も正確に再現されます。",[23,3985,180],{"id":180},[11,3987,3988,3991,3992,3994],{},[33,3989,3990],{},"Q. 特定のページだけ変換できますか？","\nA. 現状は全ページが対象です。特定ページだけなら ",[17,3993,3406],{"href":3405}," で該当ページだけ抽出してから変換するのが確実です。",[11,3996,3997,4000],{},[33,3998,3999],{},"Q. 透過背景の PDF を変換するとどうなる？","\nA. PNG を選べば透過が保持されます。JPEG は透過非対応のため白背景になります。",[11,4002,4003,4006],{},[33,4004,4005],{},"Q. 画像の品質をもっと上げたい","\nA. 解像度を 300 DPI にすると大きく改善します。ファイルサイズとメモリ消費も大きくなります。",[11,4008,4009,4012,4013,4015],{},[33,4010,4011],{},"Q. 全ページを 1 枚にまとめたい","\nA. 本ツールは 1 ページ 1 ファイルです。まとめたい場合はダウンロード後 ",[17,4014,2644],{"href":2643}," で結合してください。",[11,4017,4018,4021,4022,4024,4025,4027],{},[33,4019,4020],{},"Q. PNG と JPEG どちらを選ぶべきか？","\nA. テキストや図表が多い資料は ",[33,4023,2319],{}," が高品質です。写真が多いページや SNS 投稿用に軽さを優先するなら ",[33,4026,2313],{}," が適しています。",[23,4029,206],{"id":206},[27,4031,4032,4037,4042,4047],{},[30,4033,4034,4036],{},[17,4035,3406],{"href":3405}," — 変換前に必要なページだけ抽出",[30,4038,4039,4041],{},[17,4040,3249],{"href":3248}," — 先に PDF を軽くしてから変換すると出力もコンパクトに",[30,4043,4044,4046],{},[17,4045,2182],{"href":2181}," — 変換後の画像サイズをさらに削減",[30,4048,4049,4051],{},[17,4050,2644],{"href":2643}," — 変換した複数ページを 1 枚にまとめる",{"title":236,"searchDepth":237,"depth":237,"links":4053},[4054,4055,4056,4059,4060,4061],{"id":3865,"depth":237,"text":3865},{"id":1577,"depth":237,"text":1577},{"id":103,"depth":237,"text":103,"children":4057},[4058],{"id":3925,"depth":418,"text":3925},{"id":157,"depth":237,"text":157},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},"Zerosend の PDF → 画像変換ツールは、PDF の各ページをサーバーに送らずブラウザ内で PNG \u002F JPEG に書き出します。資料の一部だけ共有したいときに便利。Zerosend 編集部が解説。",{},"\u002Fblog\u002Fpdf-to-image-intro",{"title":3852,"description":4062},"pdf-to-image-intro","blog\u002Fpdf-to-image-intro",[3280,624,901,262],"71aq4s1WD6fPtxZpe1EQB5VFETOk05HeofsZ6n-nTXM",{"id":4,"title":5,"author":6,"body":4071,"category":247,"coverImage":248,"description":249,"draft":250,"extension":251,"locale":252,"meta":4227,"navigation":254,"noindex":250,"path":255,"publishedAt":256,"seo":4228,"slug":258,"stem":259,"tags":4229,"updatedAt":256,"__hash__":263},{"type":8,"value":4072,"toc":4217},[4073,4075,4079,4081,4105,4107,4117,4119,4123,4125,4127,4129,4145,4147,4165,4167,4171,4179,4181,4183,4187,4193,4197,4199],[11,4074,13],{},[11,4076,4077,21],{},[17,4078,20],{"href":19},[23,4080,25],{"id":25},[27,4082,4083,4087,4091,4095,4101],{},[30,4084,4085,36],{},[33,4086,35],{},[30,4088,4089,42],{},[33,4090,41],{},[30,4092,4093,48],{},[33,4094,47],{},[30,4096,4097,54,4099,59],{},[33,4098,53],{},[56,4100,58],{},[30,4102,4103,65],{},[33,4104,64],{},[23,4106,69],{"id":68},[27,4108,4109,4113],{},[30,4110,4111,77],{},[33,4112,76],{},[30,4114,4115,83],{},[33,4116,82],{},[23,4118,87],{"id":86},[11,4120,90,4121,94],{},[33,4122,93],{},[11,4124,97],{},[11,4126,100],{},[23,4128,103],{"id":103},[105,4130,4131,4137,4139,4141,4143],{},[30,4132,4133,113],{},[17,4134,4135],{"href":19},[56,4136,19],{},[30,4138,116],{},[30,4140,119],{},[30,4142,122],{},[30,4144,125],{},[23,4146,128],{"id":128},[27,4148,4149,4153,4157,4161],{},[30,4150,4151,136],{},[33,4152,135],{},[30,4154,4155,142],{},[33,4156,141],{},[30,4158,4159,148],{},[33,4160,147],{},[30,4162,4163,154],{},[33,4164,153],{},[23,4166,157],{"id":157},[11,4168,4169,163],{},[56,4170,162],{},[27,4172,4173,4175,4177],{},[30,4174,168],{},[30,4176,171],{},[30,4178,174],{},[11,4180,177],{},[23,4182,180],{"id":180},[11,4184,4185,186],{},[33,4186,185],{},[11,4188,4189,192,4191,197],{},[33,4190,191],{},[17,4192,196],{"href":195},[11,4194,4195,203],{},[33,4196,202],{},[23,4198,206],{"id":206},[27,4200,4201,4205,4209,4213],{},[30,4202,4203,215],{},[17,4204,214],{"href":213},[30,4206,4207,220],{},[17,4208,196],{"href":195},[30,4210,4211,227],{},[17,4212,226],{"href":225},[30,4214,4215,234],{},[17,4216,233],{"href":232},{"title":236,"searchDepth":237,"depth":237,"links":4218},[4219,4220,4221,4222,4223,4224,4225,4226],{"id":25,"depth":237,"text":25},{"id":68,"depth":237,"text":69},{"id":86,"depth":237,"text":87},{"id":103,"depth":237,"text":103},{"id":128,"depth":237,"text":128},{"id":157,"depth":237,"text":157},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},{},{"title":5,"description":249},[261,262],{"id":4231,"title":4232,"author":6,"body":4233,"category":247,"coverImage":248,"description":4455,"draft":250,"extension":251,"locale":252,"meta":4456,"navigation":254,"noindex":250,"path":4457,"publishedAt":256,"seo":4458,"slug":4459,"stem":4460,"tags":4461,"updatedAt":256,"__hash__":4463},"blog\u002Fblog\u002Fqr-read-intro.md","QR コードを読み取る — \u002Ftools\u002Fqr-read の思想と使い方",{"type":8,"value":4234,"toc":4446},[4235,4238,4244,4246,4274,4278,4285,4288,4302,4305,4307,4328,4330,4336,4354,4357,4360,4363,4381,4384,4386,4396,4402,4408,4417,4426,4428],[11,4236,4237],{},"怪しい広告に貼られていた QR、送られてきたチラシの QR、カメラで読むにはスマホを近づける距離が取りづらい QR。「画像として手元にある QR を PC でサッと中身だけ確認したい」という場面は意外と多いものです。",[11,4239,4240,4243],{},[17,4241,4242],{"href":213},"Zerosend の QR 読み取りツール"," は、この用途のためにあります。フィッシングやスキャン型詐欺への自衛にも使えます。",[23,4245,3865],{"id":3865},[27,4247,4248,4254,4260,4266],{},[30,4249,4250,4253],{},[33,4251,4252],{},"印刷物の URL を PC でそのまま開きたい",": チラシやポスターの QR を撮影 → 画像をドロップ → URL をコピー、という流れでスマホを使わずに遷移できます",[30,4255,4256,4259],{},[33,4257,4258],{},"受け取った QR の内容を先に確認したい",": メールや SNS で届いた QR をスキャンする前に、リンク先が安全かテキストで確認できます",[30,4261,4262,4265],{},[33,4263,4264],{},"スクリーンショットに含まれる QR を読みたい",": 画面録画や資料の中に小さく写っている QR も、画像をそのまま貼り付けるだけで読み取れます",[30,4267,4268,2577,4271,4273],{},[33,4269,4270],{},"QR コード生成後の検証",[17,4272,330],{"href":19}," で作った QR が正しい内容を埋め込んでいるか、すぐ確認できます",[23,4275,4277],{"id":4276},"なぜブラウザ内で-qr-を読み取るのか","なぜブラウザ内で QR を読み取るのか",[11,4279,4280,4281,4284],{},"QR 読み取り=「カメラで撮って自動でリンクを開く」と考えがちですが、これは",[33,4282,4283],{},"危険な挙動","です。悪意のある QR はフィッシングサイト、マルウェア配布 URL、課金トラップ、不審なアプリインストールに誘導することがあります。",[11,4286,4287],{},"Zerosend はこれに対し 2 つの方針を取ります。",[105,4289,4290,4296],{},[30,4291,4292,4295],{},[33,4293,4294],{},"画像読み取り処理をローカルで行う"," — QR 画像を第三者に渡さない",[30,4297,4298,4301],{},[33,4299,4300],{},"デコード結果を自動遷移しない"," — URL が含まれていても、まずテキストとして表示し、ユーザーが内容を確認してから手動で判断できる",[11,4303,4304],{},"これはセキュリティ設計として重要な原則で、ZerosendのCLAUDE.mdにも「外部 URL への自動遷移禁止」として明記されています。",[23,4306,103],{"id":103},[105,4308,4309,4315,4318,4325],{},[30,4310,4311,113],{},[17,4312,4313],{"href":213},[56,4314,213],{},[30,4316,4317],{},"QR が写っている画像をドラッグ&ドロップ",[30,4319,4320,4321,4324],{},"自動でデコードが走り、結果が",[33,4322,4323],{},"プレーンテキスト","として表示される",[30,4326,4327],{},"内容を確認し、必要なら手動でコピー・遷移",[23,4329,157],{"id":157},[11,4331,4332,4335],{},[56,4333,4334],{},"jsQR"," というブラウザ対応の純 JavaScript QR デコーダを使っています。",[27,4337,4338,4342,4348,4351],{},[30,4339,2983,4340,2364],{},[56,4341,2363],{},[30,4343,4344,4347],{},[56,4345,4346],{},"getImageData()"," でピクセル配列を取得",[30,4349,4350],{},"jsQR がピクセル配列から QR を検出・デコード",[30,4352,4353],{},"結果をテキストとしてそのまま表示 (HTML として解釈しない・リンク化しない)",[11,4355,4356],{},"ライブラリは WASM ではなく純 JavaScript 実装のため、初回ロードが軽いのも特徴です。",[23,4358,4359],{"id":4359},"フィッシング対策としての使い方",[11,4361,4362],{},"怪しいメール・チラシ・SMS に QR が含まれているとき:",[105,4364,4365,4368,4375,4378],{},[30,4366,4367],{},"画像をスクリーンショットや保存で取得 (スキャンしない)",[30,4369,4370,4371,4374],{},"Zerosend で読み取って",[33,4372,4373],{},"テキストとして"," URL を確認",[30,4376,4377],{},"URL 構造に違和感がないかチェック (正規サイトのサブドメイン偽装、短縮 URL 経由、意味不明なパスなど)",[30,4379,4380],{},"問題なさそうなら手動でアドレスバーに入力して遷移",[11,4382,4383],{},"カメラで直接読むと一発でブラウザが開くリスクがありますが、この手順ならテキストで一度確認できます。",[23,4385,180],{"id":180},[11,4387,4388,4391,4392,4395],{},[33,4389,4390],{},"Q. 悪意ある QR コードを読み取っても安全ですか？","\nA. 安全です。Zerosend は読み取り結果を ",[33,4393,4394],{},"テキストとして表示するだけ","で、URL を自動的に開きません。フィッシングサイトへの誘導や不正アプリのインストールは、ユーザーが自分でリンクを開かない限り起きません。設計上の安全機構です。",[11,4397,4398,4401],{},[33,4399,4400],{},"Q. バーコード (1D コード) も読み取れますか？","\nA. 現状は QR コード (2D) 専用です。バーコードには非対応です。",[11,4403,4404,4407],{},[33,4405,4406],{},"Q. 画像内に複数の QR がある場合は？","\nA. 現状は最初に検出された 1 つだけ読み取ります。",[11,4409,4410,4413,4414,4416],{},[33,4411,4412],{},"Q. 読み取れない QR","\nA. 解像度不足・反射・歪みが主な原因です。撮り直すか ",[17,4415,196],{"href":195}," で補正を試してください。",[11,4418,4419,4422,4423,4425],{},[33,4420,4421],{},"Q. 読み取り結果がサーバーに送られていないか確認したい","\nA. DevTools の Network タブを開いてから QR 画像をドロップしてください。通信が発生しないことが確認できます。",[56,4424,4334],{}," ライブラリは純 JavaScript 実装のため、WASM の読み込みもなく初回ロードが軽いです。",[23,4427,206],{"id":206},[27,4429,4430,4436,4441],{},[30,4431,4432,4435],{},[17,4433,4434],{"href":19},"QR コード生成"," — 作った QR の検証にも使える",[30,4437,4438,4440],{},[17,4439,196],{"href":195}," — QR 画像の切り抜き・回転で読み取り成功率向上",[30,4442,4443,4445],{},[17,4444,2182],{"href":2181}," — 読み取れた QR 画像を軽く保存",{"title":236,"searchDepth":237,"depth":237,"links":4447},[4448,4449,4450,4451,4452,4453,4454],{"id":3865,"depth":237,"text":3865},{"id":4276,"depth":237,"text":4277},{"id":103,"depth":237,"text":103},{"id":157,"depth":237,"text":157},{"id":4359,"depth":237,"text":4359},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},"Zerosend の QR 読み取りツールは、画像をサーバーに送らずブラウザ内で QR の中身をテキスト抽出します。リンク先の自動遷移はせず、安全に内容を確認できます。Zerosend 編集部が解説。",{},"\u002Fblog\u002Fqr-read-intro",{"title":4232,"description":4455},"qr-read-intro","blog\u002Fqr-read-intro",[261,262,4462],"セキュリティ","9MmmWPTfOPwejFG4M1Cr_Z6VD8XdHWqtq-FTJEUil_0",{"id":4465,"title":4466,"author":6,"body":4467,"category":247,"coverImage":248,"description":4695,"draft":250,"extension":251,"locale":252,"meta":4696,"navigation":254,"noindex":250,"path":4697,"publishedAt":256,"seo":4698,"slug":4699,"stem":4700,"tags":4701,"updatedAt":256,"__hash__":4703},"blog\u002Fblog\u002Fvideo-compress-intro.md","動画をブラウザ内で圧縮する — \u002Ftools\u002Fvideo-compress の思想と使い方",{"type":8,"value":4468,"toc":4683},[4469,4472,4482,4485,4488,4495,4506,4508,4511,4530,4533,4559,4562,4566,4569,4573,4584,4620,4623,4627,4633,4635,4641,4647,4653,4659,4661,4680],[11,4470,4471],{},"打ち合わせ動画、商品撮影、画面録画、子供の運動会。日常で動画を扱う場面は増える一方で、SNS やメッセンジャーのサイズ制限、メールの添付上限、サーバーのストレージコストという現実的な壁にぶつかります。",[11,4473,4474,4475,4481],{},"Zerosend は ",[17,4476,4477,4478,4480],{"href":1756},"動画圧縮ツール (",[56,4479,1756],{},")"," を、この「軽くしたいだけなのに、動画を他人のサーバーに預ける必要はない」という素朴な違和感を起点に作りました。なぜ作ったのか、どう使うのか、裏で何が起きているのかを整理します。",[23,4483,4484],{"id":4484},"なぜブラウザ内で動画を圧縮するのか",[11,4486,4487],{},"動画は個人情報そのものです。顔・声・背景・位置情報、ときには画面録画の中にパスワードや顧客名まで写り込みます。これをオンラインの圧縮サービスにアップロードするということは、その内容を一度他人のサーバーに預けることです。",[11,4489,4490,4491,4494],{},"多くのサービスは「一定時間で自動削除」を謳いますが、",[33,4492,4493],{},"その削除は利用者から検証できません","。削除完了のスクリーンショットを送ってくれるわけでもなく、ログがどこまで残るかも不透明です。未公開の企画映像や社内会議の録画を、無料ツールに放り込むことに抵抗を感じたことがある人は多いはずです。",[11,4496,4497,4498,4501,4502,4505],{},"Zerosend は逆のアプローチを取ります。",[33,4499,4500],{},"動画ファイルを最初から外に出さない","。処理はすべて、あなたがいま開いているこのブラウザ、ローカル端末の CPU と GPU の中だけで完結します。DevTools の Network タブを開いたまま圧縮を実行すれば、動画そのものがアップロードされていないことを自分の目で確認できます。信用してもらう代わりに、",[33,4503,4504],{},"検証可能にする"," — これが Zerosend の基本方針です。",[23,4507,103],{"id":103},[11,4509,4510],{},"操作はシンプルです。",[105,4512,4513,4519,4522,4525,4527],{},[30,4514,4515,113],{},[17,4516,4517],{"href":1756},[56,4518,1756],{},[30,4520,4521],{},"画面中央のドロップゾーンに動画ファイルをドラッグ&ドロップ、またはクリックして選択 (MP4 \u002F WebM \u002F MOV、最大 500MB)",[30,4523,4524],{},"圧縮強度 (CRF) と解像度を選ぶ",[30,4526,3325],{},[30,4528,4529],{},"処理が終わると「処理完了。あなたのファイルは外に出ていません。」と表示され、ダウンロードボタンから結果を保存できる",[340,4531,4532],{"id":4532},"設定の目安",[27,4534,4535,4541,4547,4553],{},[30,4536,4537,4540],{},[33,4538,4539],{},"高画質 (CRF 23)",": 画質維持を最優先。削減率は 10〜30% 程度。保存用のマスター映像向け",[30,4542,4543,4546],{},[33,4544,4545],{},"標準 (CRF 28)",": 視覚的な劣化は軽微。削減率 40〜70%。ウェブ掲載・SNS 共有に",[30,4548,4549,4552],{},[33,4550,4551],{},"小さめ (CRF 32)",": 多少ぼやけるが容量優先。チャット添付・LINE・メール向け",[30,4554,4555,4558],{},[33,4556,4557],{},"最小 (CRF 36)",": 輪郭が甘くなる。品質より「とにかく送れる」が最優先なとき",[11,4560,4561],{},"解像度は 100 \u002F 75 \u002F 50% から選べます。1080p の素材を 75% にすると、CRF を 1〜2 下げるより確実にサイズが落ちます。",[23,4563,4565],{"id":4564},"仕組み-二段構えのエンジン","仕組み — 二段構えのエンジン",[11,4567,4568],{},"Zerosend の動画圧縮は、単一のエンジンに依存していません。ブラウザの能力を見て、もっとも速い経路を自動で選びます。",[340,4570,4572],{"id":4571},"_1-webcodecs-高速パス","1. WebCodecs (高速パス)",[11,4574,4575,4576,4579,4580,4583],{},"Chrome \u002F Edge \u002F 最近の Safari には ",[56,4577,4578],{},"WebCodecs"," API が実装されており、",[33,4581,4582],{},"GPU 支援の H.264 エンコーダ","をブラウザから直接呼び出せます。Zerosend は対応環境では次のパイプラインで処理します。",[27,4585,4586,4592,4598,4605,4611,4614],{},[30,4587,4588,4591],{},[56,4589,4590],{},"mp4box.js"," で MP4 ファイルを demux",[30,4593,4594,4597],{},[56,4595,4596],{},"VideoDecoder"," でフレームを復号 (ハードウェアアクセラレーション)",[30,4599,4600,4601,4604],{},"必要なら ",[56,4602,4603],{},"OffscreenCanvas"," でリサイズ",[30,4606,4607,4610],{},[56,4608,4609],{},"VideoEncoder"," で H.264 に再エンコード (GPU)",[30,4612,4613],{},"音声はロスレスコピー (AAC のチャンクをそのまま維持)",[30,4615,4616,4619],{},[56,4617,4618],{},"mp4-muxer"," で MP4 に mux し、Blob として出力",[11,4621,4622],{},"数百 MB の動画も数十秒で処理できます。処理後の結果カードに「エンジン: webcodecs」と表示されれば、このパスが走っています。",[340,4624,4626],{"id":4625},"_2-ffmpegwasm-フォールバック","2. ffmpeg.wasm (フォールバック)",[11,4628,4629,4630,4632],{},"WebCodecs が未対応のブラウザ、HEVC などの特殊なコーデック入力、mp4box が parse できない特殊コンテナのときは、自動的に ",[56,4631,1877],{}," に切り替わります。完全に CPU で処理するため速度は落ちますが、対応できるフォーマットの幅が段違いに広いのが強みです。ffmpeg-core は Cloudflare R2 から、同一オリジンのパスを経由して 32MB の WASM を取得します。初回のみ時間がかかりますが、2 回目以降はブラウザのキャッシュから復元されます。",[23,4634,180],{"id":180},[11,4636,4637,4640],{},[33,4638,4639],{},"Q. 処理中にインターネット接続が切れたら？","\nA. 動画本体の送受信は発生しないため、圧縮処理自体は継続します。エンジン (ffmpeg.wasm) が未ロードの状態だと初回ダウンロードで失敗しますが、一度読み込んだあとはオフラインでも動作します。",[11,4642,4643,4646],{},[33,4644,4645],{},"Q. 結果のファイルはどこに保存されますか？","\nA. ダウンロードボタンを押したときのブラウザの保存先です。サーバーには何も残りません。結果ファイルはタブを閉じるとメモリから消えます。",[11,4648,4649,4652],{},[33,4650,4651],{},"Q. 画質が思ったより落ちます。","\nA. CRF を下げる (例: 28 → 23)、または解像度の縮小をやめる (50% → 100%) と改善します。素材が 4K なら、100% のまま CRF を下げるより 75% + CRF 25 の方が視覚的なバランスが取れやすいです。",[11,4654,4655,4658],{},[33,4656,4657],{},"Q. iPhone で撮った MOV も処理できますか？","\nA. はい。HEVC (H.265) の場合は ffmpeg.wasm 側のフォールバックに回るため時間がかかりますが、H.264 にトランスコードされた MP4 として出力されます。",[23,4660,206],{"id":206},[27,4662,4663,4670,4675],{},[30,4664,4665,4669],{},[17,4666,4668],{"href":4667},"\u002Ftools\u002Fvideo-to-gif","動画 → GIF"," — SNS の表紙やドキュメント挿入に",[30,4671,4672,4674],{},[17,4673,1750],{"href":1749}," — 必要な区間だけ切り出してから圧縮すると効率的",[30,4676,4677,4679],{},[17,4678,1743],{"href":1742}," — MOV \u002F WebM → MP4 など",[11,4681,4682],{},"Zerosend は「日常のちょっとした加工を、あなたの端末で完結させる」ことに徹したツール集です。動画の中身があなたの手元から離れないことを、DevTools で自分の目で確かめてから使ってみてください。",{"title":236,"searchDepth":237,"depth":237,"links":4684},[4685,4686,4689,4693,4694],{"id":4484,"depth":237,"text":4484},{"id":103,"depth":237,"text":103,"children":4687},[4688],{"id":4532,"depth":418,"text":4532},{"id":4564,"depth":237,"text":4565,"children":4690},[4691,4692],{"id":4571,"depth":418,"text":4572},{"id":4625,"depth":418,"text":4626},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},"Zerosend の動画圧縮ツールは、動画ファイルをサーバーに送らずブラウザ内で再エンコードしてサイズを削減します。WebCodecs で GPU 支援、未対応環境では ffmpeg.wasm にフォールバック。設計思想と使い方、仕組みを Zerosend 編集部が解説します。",{},"\u002Fblog\u002Fvideo-compress-intro",{"title":4466,"description":4695},"video-compress-intro","blog\u002Fvideo-compress-intro",[4702,987,4578,262],"動画","613Z3mNi94G9pdH05SAOutm_1Lv_QgpilD4PnVSTRWE",{"id":4705,"title":4706,"author":6,"body":4707,"category":247,"coverImage":248,"description":4872,"draft":250,"extension":251,"locale":252,"meta":4873,"navigation":254,"noindex":250,"path":4874,"publishedAt":256,"seo":4875,"slug":4876,"stem":4877,"tags":4878,"updatedAt":256,"__hash__":4879},"blog\u002Fblog\u002Fvideo-convert-intro.md","動画形式を変換する — \u002Ftools\u002Fvideo-convert の思想と使い方",{"type":8,"value":4708,"toc":4863},[4709,4712,4718,4720,4727,4730,4732,4751,4754,4774,4776,4781,4783,4786,4807,4810,4812,4818,4824,4830,4838,4844,4846],[11,4710,4711],{},"iPhone で撮った MOV を Windows に送りたい、古いビデオカメラの AVI を YouTube に上げたい、ウェブサイト掲載用に WebM 形式に変換して読み込みを軽くしたい。動画の形式変換は、互換性問題を解決する定番作業です。MP4 は最も互換性が高く、迷ったらまず MP4 を選ぶのが安全です。WebM は Chrome \u002F Firefox での再生効率が良く、ウェブページ埋め込みに適しています。",[11,4713,4714,4717],{},[17,4715,4716],{"href":1742},"Zerosend の動画形式変換ツール"," は、この変換をブラウザ内で完結させます。",[23,4719,1577],{"id":1577},[11,4721,4722,4723,4726],{},"動画ファイルは、内容がどのようなものであっても",[33,4724,4725],{},"撮影者・被写体・撮影場所","という 3 種の個人情報を常に含みます。結婚式の映像、社内イベントの録画、研修動画、顧客インタビュー。これらを無料のオンライン変換サービスに預けることは、映像を第三者のサーバーに一時的に置くことと同じです。",[11,4728,4729],{},"Zerosend では変換処理がローカルで完結するため、この構造的リスクを回避できます。",[23,4731,103],{"id":103},[105,4733,4734,4740,4743,4746,4748],{},[30,4735,4736,113],{},[17,4737,4738],{"href":1742},[56,4739,1742],{},[30,4741,4742],{},"動画ファイルをドラッグ&ドロップ",[30,4744,4745],{},"出力形式 (MP4 \u002F WebM) を選ぶ",[30,4747,1606],{},[30,4749,4750],{},"ダウンロード",[23,4752,4753],{"id":4753},"形式の使い分け",[27,4755,4756,4762,4768],{},[30,4757,4758,4761],{},[33,4759,4760],{},"MP4 (H.264 + AAC)",": 汎用。ブラウザ・デバイス・SNS すべてで最も広く対応",[30,4763,4764,4767],{},[33,4765,4766],{},"WebM (VP9 + Opus)",": ブラウザネイティブ。ウェブサイト掲載で効率が良い",[30,4769,4770,4773],{},[33,4771,4772],{},"互換性優先なら MP4",": 疑問があれば MP4 を選ぶのが安全",[23,4775,1871],{"id":1870},[11,4777,3732,4778,4780],{},[33,4779,1877],{}," を使ってブラウザ上で動画を変換します。ffmpeg.wasm は、動画処理の業界標準ツール「FFmpeg」を WebAssembly にコンパイルしたものです。サーバーへのアップロードは一切発生せず、すべての処理があなたの端末のメモリ上で完結します。初回アクセス時に約 30MB の WASM ファイルを読み込みます。",[23,4782,157],{"id":157},[11,4784,4785],{},"ffmpeg.wasm の再エンコードを利用しています。",[27,4787,4788,4791,4801,4804],{},[30,4789,4790],{},"入力動画を ffmpeg FS に書き込み",[30,4792,4793,4796,4797,4800],{},[56,4794,4795],{},"-c:v libx264 -c:a aac"," (MP4) または ",[56,4798,4799],{},"-c:v libvpx-vp9 -c:a libopus"," (WebM) で再エンコード",[30,4802,4803],{},"出力を Blob としてメモリに展開",[30,4805,4806],{},"ダウンロード用 URL を生成",[11,4808,4809],{},"再エンコードのため処理時間は入力の長さに比例します。30 秒の動画で数秒〜数十秒が目安です。",[23,4811,180],{"id":180},[11,4813,4814,4817],{},[33,4815,4816],{},"Q. 変換すると画質は落ちますか？","\nA. 再エンコードするため、理論上は多少劣化します。ただし本ツールのプリセットは実用レベルでは視覚的にほぼわからない品質設定です。",[11,4819,4820,4823],{},[33,4821,4822],{},"Q. 音声は変換後も保持されますか？","\nA. はい。MP4 では AAC、WebM では Opus コーデックで音声を保持します。",[11,4825,4826,4829],{},[33,4827,4828],{},"Q. コーデック指定や高度なオプションを変えたい","\nA. 本ツールは一般用途向けのプリセットで固定しています。細かい制御が必要なら、別のプロフェッショナル向けツールを検討してください。",[11,4831,4832,1957,4835,4837],{},[33,4833,4834],{},"Q. 音声のみ抽出したい",[17,4836,1913],{"href":1544}," をお使いください。",[11,4839,4840,4843],{},[33,4841,4842],{},"Q. 対応していない入力形式","\nA. ffmpeg がサポートする範囲ですが、特殊コーデック (Pro Res \u002F DNxHD など) は未対応の場合があります。",[23,4845,206],{"id":206},[27,4847,4848,4853,4858],{},[30,4849,4850,4852],{},[17,4851,1757],{"href":1756}," — 変換と同時にサイズも削減したいとき",[30,4854,4855,4857],{},[17,4856,1750],{"href":1749}," — 変換前に必要な区間だけ切り出す",[30,4859,4860,4862],{},[17,4861,1913],{"href":1544}," — 動画から音声だけ抽出して変換",{"title":236,"searchDepth":237,"depth":237,"links":4864},[4865,4866,4867,4868,4869,4870,4871],{"id":1577,"depth":237,"text":1577},{"id":103,"depth":237,"text":103},{"id":4753,"depth":237,"text":4753},{"id":1870,"depth":237,"text":1871},{"id":157,"depth":237,"text":157},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},"Zerosend の動画形式変換ツールは、MOV \u002F WebM \u002F MKV \u002F AVI などの動画をサーバーに送らずブラウザ内で MP4 など互換性の高い形式に変換します。Zerosend 編集部が解説。",{},"\u002Fblog\u002Fvideo-convert-intro",{"title":4706,"description":4872},"video-convert-intro","blog\u002Fvideo-convert-intro",[4702,901,262],"uen8HCCs7nwIfruqSzlnOQeM7PeUONPCTqhbCV48i8I",{"id":4881,"title":4882,"author":6,"body":4883,"category":247,"coverImage":248,"description":5120,"draft":250,"extension":251,"locale":252,"meta":5121,"navigation":254,"noindex":250,"path":5122,"publishedAt":256,"seo":5123,"slug":5124,"stem":5125,"tags":5126,"updatedAt":256,"__hash__":5128},"blog\u002Fblog\u002Fvideo-to-gif-intro.md","動画を GIF に変換する — \u002Ftools\u002Fvideo-to-gif の思想と使い方",{"type":8,"value":4884,"toc":5110},[4885,4888,4893,4895,4921,4925,4928,4948,4954,4958,4964,4967,4969,4991,4994,4997,5023,5025,5036,5055,5058,5060,5069,5079,5085,5091,5093],[11,4886,4887],{},"画面操作の説明を Slack で共有したい、バグの再現手順を issue に貼りたい、X のタイムラインで動く画像にしたい。動画が重くて共有しづらい場面で GIF は今でも現役です。",[11,4889,4890,4717],{},[17,4891,4892],{"href":4667},"Zerosend の 動画 → GIF 変換ツール",[23,4894,3865],{"id":3865},[27,4896,4897,4903,4909,4915],{},[30,4898,4899,4902],{},[33,4900,4901],{},"チャット・SNS への操作デモ共有",": Slack・Discord・X では動画より GIF の方が自動再生されやすく、見てもらいやすい",[30,4904,4905,4908],{},[33,4906,4907],{},"GitHub Issue へのバグ再現添付",": 再現手順を GIF にすると、文章だけより圧倒的に伝わります",[30,4910,4911,4914],{},[33,4912,4913],{},"製品マニュアルや説明資料",": 使い方の短いアニメを埋め込むとドキュメントの分かりやすさが上がります",[30,4916,4917,4920],{},[33,4918,4919],{},"SNS 投稿用のループ動画",": 短い映像をループさせてタイムラインで目を引く素材にできます",[23,4922,4924],{"id":4923},"gif-の特性を理解して使う","GIF の特性を理解して使う",[11,4926,4927],{},"GIF には独自の制約があります。",[27,4929,4930,4936,4942],{},[30,4931,4932,4935],{},[33,4933,4934],{},"音声なし",": GIF 形式の仕様上、音声トラックは含められません",[30,4937,4938,4941],{},[33,4939,4940],{},"色数は最大 256 色",": フルカラー動画に比べて色表現が限られます。グラデーションや写真素材はバンディングが出やすい",[30,4943,4944,4947],{},[33,4945,4946],{},"ファイルサイズが大きくなりやすい",": 同じ長さ・解像度の動画 MP4 と比べると、GIF は数倍のサイズになることが多い",[11,4949,4950,4951,4953],{},"画面操作録画やシンプルなアニメーションには向いています。風景動画など色が複雑な素材は ",[17,4952,1757],{"href":1756}," で MP4 のままにするのが適切です。",[23,4955,4957],{"id":4956},"なぜブラウザ内で-gif-変換するのか","なぜブラウザ内で GIF 変換するのか",[11,4959,4960,4961,94],{},"画面録画の中身は、UI スクリーンショット以上に情報を含みます。操作中に映る URL・ユーザー名・通知内容・顧客の名前。これらを含む動画を GIF 変換サービスにアップロードすると、",[33,4962,4963],{},"動画の全フレームが相手のサーバーに渡ります",[11,4965,4966],{},"Zerosend では変換処理をローカルで行うため、そのリスクがありません。DevTools で通信が発生していないことを確認してから使ってください。",[23,4968,103],{"id":103},[105,4970,4971,4977,4980,4983,4986,4989],{},[30,4972,4973,113],{},[17,4974,4975],{"href":4667},[56,4976,4667],{},[30,4978,4979],{},"動画ファイルをドラッグ&ドロップ (MP4 \u002F WebM \u002F MOV)",[30,4981,4982],{},"切り出し区間 (開始時刻・終了時刻) を指定",[30,4984,4985],{},"フレームレート (5 \u002F 10 \u002F 15fps) と幅を選択",[30,4987,4988],{},"「GIF 化を開始する」をクリック",[30,4990,4750],{},[23,4992,4993],{"id":4993},"サイズを抑えるコツ",[11,4995,4996],{},"GIF は形式として大きくなりがちです。以下の指針で調整してください。",[27,4998,4999,5005,5011,5017],{},[30,5000,5001,5004],{},[33,5002,5003],{},"区間は短く",": 3〜6 秒が実用上の上限",[30,5006,5007,5010],{},[33,5008,5009],{},"幅は 480px 以下",": Slack・Twitter で使うなら 480px 前後で十分",[30,5012,5013,5016],{},[33,5014,5015],{},"フレームレートは 10fps",": 15fps 以上は体感差が小さくサイズだけ増える",[30,5018,5019,5022],{},[33,5020,5021],{},"色数は制限",": ツール側で最適化しているが、単調な色味の動画ほどうまくハマる",[23,5024,157],{"id":157},[11,5026,5027,5028,5031,5032,5035],{},"ffmpeg.wasm で動画を復号し、",[56,5029,5030],{},"palettegen"," と ",[56,5033,5034],{},"paletteuse"," フィルタを使って GIF の 256 色パレットに最適化して書き出しています。",[27,5037,5038,5040,5046,5052],{},[30,5039,4790],{},[30,5041,5042,5045],{},[56,5043,5044],{},"-vf \"fps=10,scale=480:-1:flags=lanczos,palettegen\""," で最適パレット生成",[30,5047,5048,5051],{},[56,5049,5050],{},"-vf \"fps=10,scale=480:-1:flags=lanczos,paletteuse\""," で GIF エンコード",[30,5053,5054],{},"Blob としてメモリに展開",[11,5056,5057],{},"2 パス処理をブラウザ内で完結させているため、サーバー送信は一切発生しません。",[23,5059,180],{"id":180},[11,5061,5062,5065,5066,5068],{},[33,5063,5064],{},"Q. GIF が想像より大きくなるのはなぜ？","\nA. GIF の圧縮効率は MP4 より大幅に劣ります。色数が多い・解像度が高い・再生時間が長いほどサイズが跳ね上がります。区間を短く・幅を小さく・フレームレートを低くすることで抑えられます。30 秒超なら ",[17,5067,1757],{"href":1756}," で軽量 MP4 のままにするのをお勧めします。",[11,5070,5071,5074,5075,5078],{},[33,5072,5073],{},"Q. 最適なフレームレートは？","\nA. 画面操作デモや UI アニメーションなら ",[33,5076,5077],{},"10fps"," で十分です。15fps 以上は体感差が小さくサイズだけ増えます。スポーツや動きが速い動画なら 15fps を試してみてください。",[11,5080,5081,5084],{},[33,5082,5083],{},"Q. 音声は入りますか？","\nA. GIF 仕様上、音声は含められません。音声付きで共有したいなら動画のままが適切です。",[11,5086,5087,5090],{},[33,5088,5089],{},"Q. 透過 GIF は作れますか？","\nA. 1 ビット透過なら可能ですが、動画ソースからの抽出は実用的でないため、本ツールでは非対応です。",[23,5092,206],{"id":206},[27,5094,5095,5100,5105],{},[30,5096,5097,5099],{},[17,5098,1750],{"href":1749}," — GIF 化前に必要な区間だけ切り出す",[30,5101,5102,5104],{},[17,5103,1757],{"href":1756}," — GIF の代わりに軽量 MP4 にする選択肢",[30,5106,5107,5109],{},[17,5108,1743],{"href":1742}," — 他形式への変換",{"title":236,"searchDepth":237,"depth":237,"links":5111},[5112,5113,5114,5115,5116,5117,5118,5119],{"id":3865,"depth":237,"text":3865},{"id":4923,"depth":237,"text":4924},{"id":4956,"depth":237,"text":4957},{"id":103,"depth":237,"text":103},{"id":4993,"depth":237,"text":4993},{"id":157,"depth":237,"text":157},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},"Zerosend の 動画 → GIF 変換ツールは、動画をサーバーに送らずブラウザ内で GIF アニメに変換します。SNS・ドキュメント・Slack 用の短尺アニメ作成に。Zerosend 編集部が解説。",{},"\u002Fblog\u002Fvideo-to-gif-intro",{"title":4882,"description":5120},"video-to-gif-intro","blog\u002Fvideo-to-gif-intro",[4702,5127,262],"GIF","KP5LnDJg0eajQ42qALBS-sWzXFmFrGx0dQo1I45wKAc",{"id":5130,"title":5131,"author":6,"body":5132,"category":247,"coverImage":248,"description":5325,"draft":250,"extension":251,"locale":252,"meta":5326,"navigation":254,"noindex":250,"path":5327,"publishedAt":256,"seo":5328,"slug":5329,"stem":5330,"tags":5331,"updatedAt":256,"__hash__":5332},"blog\u002Fblog\u002Fvideo-trim-intro.md","動画をトリミング (切り出し) する — \u002Ftools\u002Fvideo-trim の思想と使い方",{"type":8,"value":5133,"toc":5316},[5134,5137,5142,5144,5176,5178,5185,5188,5190,5209,5213,5219,5222,5224,5232,5247,5250,5252,5260,5266,5275,5280,5286,5297,5299],[11,5135,5136],{},"60 分の会議録画から「重要な 3 分」だけ共有したい、旅行動画の最初の手ブレ部分をカットしたい、画面録画の誤操作部分を除きたい。動画のトリミングは、共有前の定番作業です。",[11,5138,5139,1546],{},[17,5140,5141],{"href":1749},"Zerosend の動画トリミングツール",[23,5143,1794],{"id":1794},[27,5145,5146,5152,5158,5164,5170],{},[30,5147,5148,5151],{},[33,5149,5150],{},"会議録画の抜粋共有",": 60 分の Zoom 録画から決議箇所の 5 分だけを切り出してチームに送る",[30,5153,5154,5157],{},[33,5155,5156],{},"旅行動画の冒頭カット",": 起動直後の手ブレや暗転部分を除いて本編から始める",[30,5159,5160,5163],{},[33,5161,5162],{},"画面録画の整理",": 操作説明動画の冒頭・末尾の余分な操作を削除",[30,5165,5166,5169],{},[33,5167,5168],{},"SNS 投稿用にカット",": 長い動画から見せたい場面だけを 60 秒以内に切り出す",[30,5171,5172,5175],{},[33,5173,5174],{},"インタビュー動画の引用",": 収録全体から発言箇所だけを抜粋してプレゼンに使う",[23,5177,1835],{"id":1835},[11,5179,5180,5181,5184],{},"トリミングしたい動画ほど「切り取りたい箇所」より「切り捨てたい箇所」が大きいものです。60 分の会議録画から 3 分を抽出する場合、",[33,5182,5183],{},"残りの 57 分分の機密発言もいったん相手サーバーにアップロードする","ことになります。",[11,5186,5187],{},"これはプライバシー観点で非合理的です。Zerosend はトリミング処理をローカルで行うため、アップロードそのものが発生しません。入力動画が数 GB あっても、ネットワークには何も流れません。",[23,5189,103],{"id":103},[105,5191,5192,5198,5201,5204,5206],{},[30,5193,5194,113],{},[17,5195,5196],{"href":1749},[56,5197,1749],{},[30,5199,5200],{},"動画をドラッグ&ドロップ",[30,5202,5203],{},"開始時刻・終了時刻を指定 (スライダーまたは秒数入力)",[30,5205,1864],{},[30,5207,5208],{},"切り出された動画をダウンロード",[23,5210,5212],{"id":5211},"ffmpegwasm-とは","ffmpeg.wasm とは",[11,5214,5215,5216,5218],{},"ffmpeg は動画・音声処理の世界標準ツールで、もともとはターミナルで使うコマンドラインプログラムです。",[33,5217,1877],{}," はこれを WebAssembly (WASM) にコンパイルしたもので、インストール不要でブラウザ上で動作します。",[11,5220,5221],{},"Zerosend はこの ffmpeg.wasm を使って、ネイティブアプリに近い動画処理をブラウザ内で実現しています。初回アクセス時は約 30MB の WASM ファイルを取得するため少し時間がかかりますが、取得後はオフラインでも動作します。",[23,5223,157],{"id":157},[11,5225,1886,5226,5228,5229,5231],{},[56,5227,1889],{}," (開始) \u002F ",[56,5230,1893],{}," (終了) オプションを使って指定区間を切り出します。",[27,5233,5234,5236,5242],{},[30,5235,4790],{},[30,5237,5238,5241],{},[56,5239,5240],{},"-ss \u003Cstart> -i input.mp4 -to \u003Cend> -c copy output.mp4"," で再エンコードなしに切り出し",[30,5243,5244,5246],{},[56,5245,1960],{}," によりロスレス抽出 (処理も高速)",[11,5248,5249],{},"再エンコードしないため、画質劣化なし・処理時間も入力サイズの数%程度で完了します。",[23,5251,180],{"id":180},[11,5253,5254,1957,5257,5259],{},[33,5255,5256],{},"Q. フレーム単位の精度は？",[56,5258,1960],{}," でキーフレーム境界に揃える仕様のため、GOP サイズに依存します。秒単位以上の精度が必要なら問題なく使えますが、フレーム単位の精度が必要な場合は本ツール内で再エンコードオプションを有効化できます (処理時間が増加)。",[11,5261,5262,5265],{},[33,5263,5264],{},"Q. 対応している動画形式は？","\nA. MP4・MOV・AVI・WebM・MKV など主要な形式に対応しています。スマートフォンで撮影した MP4 や MOV ファイルはそのまま使えます。",[11,5267,5268,5271,5272,5274],{},[33,5269,5270],{},"Q. ファイルサイズの上限はありますか？","\nA. デバイスのメモリに依存します。PC (8GB RAM) なら 2〜4GB 程度まで問題なく処理できます。大容量ファイルは事前に ",[17,5273,1757],{"href":1756}," でサイズを小さくしておくと安定します。",[11,5276,5277,5279],{},[33,5278,1966],{},"\nA. 現状は 1 区間のみです。複数区間を扱う場合は 1 区間ずつ抽出後、別途結合ツールを使ってください。",[11,5281,5282,5285],{},[33,5283,5284],{},"Q. 音声も一緒に切り出される？","\nA. はい。映像と音声は同じ区間でセット抽出されます。",[11,5287,5288,1957,5291,5293,5294,5296],{},[33,5289,5290],{},"Q. 音声だけ切り出したい場合は？",[17,5292,1736],{"href":1735}," を使うか、本ツールで切り出した動画から音声だけを ",[17,5295,1913],{"href":1544}," で抽出してください。",[23,5298,206],{"id":206},[27,5300,5301,5306,5311],{},[30,5302,5303,5305],{},[17,5304,1757],{"href":1756}," — トリミング後にサイズ削減",[30,5307,5308,5310],{},[17,5309,4668],{"href":4667}," — 短い区間を GIF アニメに",[30,5312,5313,5315],{},[17,5314,1743],{"href":1742}," — 形式違いへの変換",{"title":236,"searchDepth":237,"depth":237,"links":5317},[5318,5319,5320,5321,5322,5323,5324],{"id":1794,"depth":237,"text":1794},{"id":1835,"depth":237,"text":1835},{"id":103,"depth":237,"text":103},{"id":5211,"depth":237,"text":5212},{"id":157,"depth":237,"text":157},{"id":180,"depth":237,"text":180},{"id":206,"depth":237,"text":206},"Zerosend の動画トリミングツールは、動画をサーバーに送らずブラウザ内で任意の区間だけ切り出します。不要な前後や長い会議録画から特定区間のみを共有したいときに。Zerosend 編集部が解説。",{},"\u002Fblog\u002Fvideo-trim-intro",{"title":5131,"description":5325},"video-trim-intro","blog\u002Fvideo-trim-intro",[4702,2022,262],"flNtXZjV9WjTykXy1_JxOHLdiVIRg7yWC_Xq2LTpcU8",{"id":5334,"title":5335,"author":6,"body":5336,"category":247,"coverImage":248,"description":5625,"draft":250,"extension":251,"locale":252,"meta":5626,"navigation":254,"noindex":250,"path":5627,"publishedAt":5628,"seo":5629,"slug":5630,"stem":5631,"tags":5632,"updatedAt":5628,"__hash__":5635},"blog\u002Fblog\u002Fbrowser-only-limits.md","ブラウザ内でファイル処理は「どこまで」できるか — 2026 年の現在地",{"type":8,"value":5337,"toc":5594},[5338,5341,5345,5349,5360,5363,5366,5369,5373,5384,5388,5395,5399,5408,5412,5430,5433,5437,5440,5444,5450,5454,5457,5461,5465,5472,5476,5483,5487,5490,5494,5498,5508,5512,5519,5523,5534,5542,5545,5549,5563,5566,5568,5575,5583],[11,5339,5340],{},"「ファイルをサーバーに送らずに処理する」は、2026 年のブラウザでかなりの範囲が実現可能です。ただし万能ではありません。Zerosend が採用している技術と、その限界を正直に整理します。",[23,5342,5344],{"id":5343},"なぜブラウザだけで処理する選択を採るのか","なぜ「ブラウザだけで処理する」選択を採るのか",[340,5346,5348],{"id":5347},"送らないので漏れないという直球の設計","送らないので漏れない、という直球の設計",[11,5350,5351,5352,5355,5356,5359],{},"サーバー送信を伴わない構造そのものが、",[33,5353,5354],{},"個人情報漏洩・誤操作・第三者共有"," のリスクを原理的にゼロにします。「漏れない仕組み」を語るより、",[33,5357,5358],{},"漏れる場所をなくす","ほうが検証しやすい設計です。",[340,5361,5362],{"id":5362},"設定や権限に依存しない単純さ",[11,5364,5365],{},"サーバー側で暗号化キーを守る \u002F ログを消す \u002F バックアップから除外する、という細かい運用は継続的な手間がかかります。ブラウザ内で完結するなら、そもそもその運用自体が発生しません。",[23,5367,5368],{"id":5368},"使っている技術スタック",[340,5370,5372],{"id":5371},"canvas-api-画像の基礎処理","Canvas API — 画像の基礎処理",[11,5374,5375,5376,5379,5380,5383],{},"2D 描画と画像ピクセル操作の標準 API。Zerosend の画像圧縮・リサイズ・形式変換はすべて Canvas 経由です。",[56,5377,5378],{},"drawImage()"," で任意の描画、",[56,5381,5382],{},"toBlob()"," で指定フォーマットに書き出せます。",[340,5385,5387],{"id":5386},"web-worker-メインスレッドを止めない","Web Worker — メインスレッドを止めない",[11,5389,5390,5391,5394],{},"重い処理をメインスレッドで回すと UI がフリーズします。Web Worker で別スレッドに逃がすことでスムーズな UX を維持します。",[56,5392,5393],{},"browser-image-compression"," のように Worker を内包しているライブラリは、そのまま使うだけでメインスレッドを解放してくれます。",[340,5396,5398],{"id":5397},"webassembly-ffmpeg-pdf-系ライブラリの移植","WebAssembly — ffmpeg \u002F pdf 系ライブラリの移植",[11,5400,5401,5402,5404,5405,5407],{},"C \u002F C++ で書かれたネイティブライブラリを WASM 化することで、ブラウザで直接実行できます。Zerosend では ",[33,5403,1877],{}," (動画・音声) と ",[33,5406,3346],{}," (PDF レンダリング) が WASM ベースです。",[340,5409,5411],{"id":5410},"file-system-access-api-blob-入出力","File System Access API \u002F Blob — 入出力",[11,5413,5414,5415,1890,5418,5421,5422,5425,5426,5429],{},"モダンブラウザは ",[56,5416,5417],{},"showOpenFilePicker()",[56,5419,5420],{},"showSaveFilePicker()"," で OS のファイル選択ダイアログを呼べます。非対応の環境でも ",[56,5423,5424],{},"\u003Cinput type=\"file\">"," + ",[56,5427,5428],{},"Blob + URL.createObjectURL"," でダウンロードできるため、互換性の最低ラインは広いです。",[23,5431,5432],{"id":5432},"できること",[340,5434,5436],{"id":5435},"数-mb-数十-mb-のファイル処理","数 MB 〜数十 MB のファイル処理",[11,5438,5439],{},"現代のブラウザは 100MB 級のファイルでも (メモリ次第で) 安定して扱えます。JPG\u002FPNG 画像の圧縮・リサイズ・一括 ZIP 生成は問題なく動作します。",[340,5441,5443],{"id":5442},"バッチ処理-zip-生成を含む","バッチ処理 (ZIP 生成を含む)",[11,5445,5446,5449],{},[56,5447,5448],{},"jszip"," を使えば複数ファイルの圧縮まとめもブラウザ内で完結します。100 ファイル程度の一括処理は実用範囲です。",[340,5451,5453],{"id":5452},"逆圧縮形式変換","逆圧縮・形式変換",[11,5455,5456],{},"JPG → WebP、HEIC → JPG、PDF → PNG、MP4 → GIF などの変換は、すべてブラウザ内で実行できます。",[23,5458,5460],{"id":5459},"苦手なことできないこと","苦手なこと・できないこと",[340,5462,5464],{"id":5463},"数-gb-級の動画処理はメモリが持たない","数 GB 級の動画処理はメモリが持たない",[11,5466,5467,5468,5471],{},"ブラウザのプロセスメモリ上限はだいたい 2〜4 GB 程度。それ以上の動画をまるごと処理するのは困難です。",[33,5469,5470],{},"1 GB を超える動画はデスクトップツール"," (ffmpeg CLI 等) のほうが安定します。",[340,5473,5475],{"id":5474},"機械学習推論は遅い-onnx-runtime-web-は軽量モデル限定","機械学習推論は遅い (ONNX Runtime Web は軽量モデル限定)",[11,5477,5478,5479,5482],{},"ONNX Runtime Web や TensorFlow.js で推論は可能ですが、",[33,5480,5481],{},"数 GB 級のモデル","はブラウザで回すとかなり遅く、UX が実用的ではありません。軽量モデル (数百 MB) に限定するか、サーバー推論と割り切るのが現実的です。",[340,5484,5486],{"id":5485},"os-ネイティブ機能への直接アクセス","OS ネイティブ機能への直接アクセス",[11,5488,5489],{},"ブラウザはサンドボックス内で動くので、OS のファイルシステム全体を書き換えるような処理・プロセス起動はできません。セキュリティの観点からも妥当な制約です。",[23,5491,5493],{"id":5492},"zerosend-での実装のコツ-開発者向け","Zerosend での実装のコツ (開発者向け)",[340,5495,5497],{"id":5496},"ドメイン層を-ui-から分離する","ドメイン層を UI から分離する",[11,5499,5500,5503,5504,5507],{},[56,5501,5502],{},"domain\u002Fprocessors\u002F"," 配下に",[33,5505,5506],{},"純粋関数","を置き、Vue \u002F DOM API に依存させない設計にしています。テストが書きやすく、将来的に CLI 化・API 化もしやすくなります。",[340,5509,5511],{"id":5510},"web-worker-に重い処理を分離する判断基準","Web Worker に重い処理を分離する判断基準",[11,5513,5514,5515,5518],{},"目安は ",[33,5516,5517],{},"100 ms を超える処理はすべて Worker","。メインスレッドがそれ以上ブロックすると、ユーザー操作への応答 (クリック・スクロール) が目に見えて遅延します。",[340,5520,5522],{"id":5521},"csp-を破らずに-wasm-を読み込む","CSP を破らずに WASM を読み込む",[11,5524,5525,5526,5529,5530,5533],{},"CSP (Content Security Policy) に ",[56,5527,5528],{},"wasm-unsafe-eval"," を追加する必要があります。Zerosend では meta と ",[56,5531,5532],{},"_headers"," の両方に設定し、本番でも正しく動作することを確認しています。",[764,5535,5540],{"className":5536,"code":5538,"language":5539},[5537],"language-text","Content-Security-Policy: script-src 'self' 'wasm-unsafe-eval'\n","text",[56,5541,5538],{"__ignoreMap":236},[23,5543,5544],{"id":5544},"今後の展望",[340,5546,5548],{"id":5547},"webgpu-opfs-の成熟","WebGPU \u002F OPFS の成熟",[27,5550,5551,5557],{},[30,5552,5553,5556],{},[33,5554,5555],{},"WebGPU",": GPU を直接使える API。機械学習推論や 3D レンダリングで大きく速度改善が見込まれます",[30,5558,5559,5562],{},[33,5560,5561],{},"OPFS (Origin Private File System)",": Origin ごとにブラウザが管理する高速ファイル領域。大容量ファイル処理時の中間ストレージに使えます",[11,5564,5565],{},"これらが広く使える前提になれば、現状「苦手」としている領域の多くがブラウザだけで片付くようになります。",[23,5567,1187],{"id":1187},[11,5569,5570,5571,5574],{},"ブラウザ内ファイル処理は ",[33,5572,5573],{},"Canvas \u002F Web Worker \u002F WebAssembly \u002F File System Access API"," の組み合わせで、日常的な軽作業のほぼ全域をカバーできます。GB 級や重い ML 推論は依然として苦手ですが、Zerosend が対象とする画像・PDF・音声・短い動画の範囲では実用レベルです。",[11,5576,5577,5578,5582],{},"この設計の結果、",[17,5579,5581],{"href":5580},"\u002F#tools","Zerosend のツール群"," はサーバーに何も送らずに動作し、DevTools で自ら検証できる透明性を持っています。",[11,5584,5585,5586,1890,5590],{},"関連: ",[17,5587,5589],{"href":5588},"\u002Fblog\u002Fwhy-browser-only","なぜ Zerosend はブラウザ内処理にこだわるのか",[17,5591,5593],{"href":5592},"\u002Fguide\u002Fprivacy-online-tools","ピラー記事",{"title":236,"searchDepth":237,"depth":237,"links":5595},[5596,5600,5606,5611,5616,5621,5624],{"id":5343,"depth":237,"text":5344,"children":5597},[5598,5599],{"id":5347,"depth":418,"text":5348},{"id":5362,"depth":418,"text":5362},{"id":5368,"depth":237,"text":5368,"children":5601},[5602,5603,5604,5605],{"id":5371,"depth":418,"text":5372},{"id":5386,"depth":418,"text":5387},{"id":5397,"depth":418,"text":5398},{"id":5410,"depth":418,"text":5411},{"id":5432,"depth":237,"text":5432,"children":5607},[5608,5609,5610],{"id":5435,"depth":418,"text":5436},{"id":5442,"depth":418,"text":5443},{"id":5452,"depth":418,"text":5453},{"id":5459,"depth":237,"text":5460,"children":5612},[5613,5614,5615],{"id":5463,"depth":418,"text":5464},{"id":5474,"depth":418,"text":5475},{"id":5485,"depth":418,"text":5486},{"id":5492,"depth":237,"text":5493,"children":5617},[5618,5619,5620],{"id":5496,"depth":418,"text":5497},{"id":5510,"depth":418,"text":5511},{"id":5521,"depth":418,"text":5522},{"id":5544,"depth":237,"text":5544,"children":5622},[5623],{"id":5547,"depth":418,"text":5548},{"id":1187,"depth":237,"text":1187},"ブラウザだけで画像・PDF・動画を扱うには、どんな技術を使いどこまでできるのか。Canvas \u002F Web Worker \u002F WebAssembly \u002F File System Access API の採用ポイントと、率直な限界を整理します。",{},"\u002Fblog\u002Fbrowser-only-limits","2026-04-19",{"title":5335,"description":5625},"browser-only-limits","blog\u002Fbrowser-only-limits",[5633,1245,5634],"WebAssembly","技術解説","DVMRpha441VjgXVwUg-Ky9ljmdcZEo-shW86ze3x7Uo",{"id":5637,"title":5638,"author":6,"body":5639,"category":247,"coverImage":248,"description":6447,"draft":250,"extension":251,"locale":252,"meta":6448,"navigation":254,"noindex":250,"path":6449,"publishedAt":5628,"seo":6450,"slug":6451,"stem":6452,"tags":6453,"updatedAt":423,"__hash__":6456},"blog\u002Fblog\u002Ffavicon-complete-guide-2026.md","ファビコン 完全ガイド 2026 — サイズ・形式・HTML 設置まで全部入り",{"type":8,"value":5640,"toc":6405},[5641,5648,5652,5659,5680,5684,5687,5691,5695,5718,5725,5732,5735,5749,5753,5756,5763,5839,5843,5850,5853,5862,5866,5869,5876,6036,6040,6046,6050,6055,6197,6204,6212,6216,6220,6223,6227,6230,6233,6243,6247,6253,6257,6260,6293,6296,6299,6303,6306,6310,6319,6325,6331,6334,6337,6376,6380,6387,6389,6396,6402],[11,5642,5643,5644,5647],{},"ファビコン (favicon) は地味なアセットですが、種類・サイズ・形式の選択肢が多く、毎回「結局どれが必要なんだっけ?」となる人も多いはずです。本記事では 2026 年時点で本当に必要なアイコン一式と、HTML への組み込み、Zerosend の ",[17,5645,5646],{"href":232},"ファビコン生成ツール"," の活用法を整理します。",[23,5649,5651],{"id":5650},"ファビコンとは何か-1-分で復習","ファビコンとは何か (1 分で復習)",[340,5653,5655,5658],{"id":5654},"link-タグで参照される機能の総称",[56,5656,5657],{},"\u003Clink>"," タグで参照される機能の総称",[11,5660,5661,5662,5665,5666,5669,5670,1890,5673,1890,5676,5679],{},"ファビコンはブラウザのタブ表示に使われるアイコン、だけではなく",[33,5663,5664],{},"タブ \u002F ブックマーク \u002F PWA ホーム画面 \u002F 検索結果","など複数の文脈で使われる画像の総称です。",[56,5667,5668],{},"\u003Chead>"," 内の ",[56,5671,5672],{},"\u003Clink rel=\"icon\">",[56,5674,5675],{},"\u003Clink rel=\"apple-touch-icon\">",[56,5677,5678],{},"\u003Clink rel=\"manifest\">"," で参照されるアセット群です。",[340,5681,5683],{"id":5682},"表示場所によって最適なサイズ形式が違う","表示場所によって最適なサイズ・形式が違う",[11,5685,5686],{},"タブ用には 16×16 \u002F 32×32 の小さいアイコンが必要ですが、iPhone のホーム画面には 180×180 の PNG、Android の PWA には 192×192 と 512×512 の PNG が必要です。場所ごとに要件が違います。",[23,5688,5690],{"id":5689},"_2026-年時点で本当に必要なアイコン","2026 年時点で本当に必要なアイコン",[340,5692,5694],{"id":5693},"必須-3-つ","必須 3 つ",[27,5696,5697,5703,5709],{},[30,5698,5699,5702],{},[56,5700,5701],{},"favicon.ico"," — デスクトップブラウザのタブ \u002F ブックマーク (16\u002F32\u002F48px のマルチサイズ)",[30,5704,5705,5708],{},[56,5706,5707],{},"apple-touch-icon.png"," (180×180) — iOS のホーム画面",[30,5710,5711,1890,5714,5717],{},[56,5712,5713],{},"icon-192.png",[56,5715,5716],{},"icon-512.png"," — Android \u002F PWA 対応",[340,5719,5721,5722],{"id":5720},"推奨-faviconsvg","推奨: ",[56,5723,5724],{},"favicon.svg",[11,5726,5727,5728,5731],{},"モダンブラウザ (Chrome \u002F Firefox \u002F Safari の最新版) は SVG ファビコンに対応済みです。ベクターなのでどのサイズでもシャープに表示されます。ダークモード切替にも対応できるので、2026 年は ",[33,5729,5730],{},"SVG を第一選択","にして ICO をフォールバックにする運用がおすすめです。",[340,5733,5734],{"id":5734},"不要になったもの",[27,5736,5737,5743],{},[30,5738,5739,5742],{},[56,5740,5741],{},"browserconfig.xml"," (Windows 8\u002F10 タイル用) — IE 系と一緒に役目を終えています",[30,5744,5745,5748],{},[56,5746,5747],{},"*.png"," の 70×70 \u002F 150×150 \u002F 310×310 (IE\u002FEdge Legacy 向け)",[23,5750,5752],{"id":5751},"svg-ファビコンのメリットと対応ブラウザ","SVG ファビコンのメリットと対応ブラウザ",[340,5754,5755],{"id":5755},"ダークモード自動切替",[11,5757,5758,5759,5762],{},"SVG 内に ",[56,5760,5761],{},"@media (prefers-color-scheme: dark)"," のスタイルを書くだけで、OS のダークモードに合わせて色を切り替えられます。Chrome \u002F Firefox の最新版は対応済みです。",[764,5764,5766],{"className":766,"code":5765,"language":768,"meta":236,"style":236},"\u003Csvg>\n  \u003Cstyle>\n    @media (prefers-color-scheme: dark) {\n      .logo { fill: #fff; }\n    }\n  \u003C\u002Fstyle>\n  \u003Crect class=\"logo\" \u002F>\n\u003C\u002Fsvg>\n",[56,5767,5768,5777,5785,5790,5795,5801,5811,5830],{"__ignoreMap":236},[772,5769,5770,5772,5775],{"class":774,"line":775},[772,5771,779],{"class":778},[772,5773,5774],{"class":782},"svg",[772,5776,786],{"class":778},[772,5778,5779,5781,5783],{"class":774,"line":237},[772,5780,791],{"class":778},[772,5782,875],{"class":782},[772,5784,786],{"class":778},[772,5786,5787],{"class":774,"line":418},[772,5788,5789],{"class":778},"    @media (prefers-color-scheme: dark) {\n",[772,5791,5792],{"class":774,"line":843},[772,5793,5794],{"class":778},"      .logo { fill: #fff; }\n",[772,5796,5798],{"class":774,"line":5797},5,[772,5799,5800],{"class":778},"    }\n",[772,5802,5804,5807,5809],{"class":774,"line":5803},6,[772,5805,5806],{"class":778},"  \u003C\u002F",[772,5808,875],{"class":782},[772,5810,786],{"class":778},[772,5812,5814,5816,5819,5822,5824,5827],{"class":774,"line":5813},7,[772,5815,791],{"class":778},[772,5817,5818],{"class":782},"rect",[772,5820,5821],{"class":797}," class",[772,5823,801],{"class":778},[772,5825,5826],{"class":804},"\"logo\"",[772,5828,5829],{"class":778}," \u002F>\n",[772,5831,5833,5835,5837],{"class":774,"line":5832},8,[772,5834,846],{"class":778},[772,5836,5774],{"class":782},[772,5838,786],{"class":778},[340,5840,5842],{"id":5841},"アニメーション-限定的","アニメーション (限定的)",[11,5844,5845,5846,5849],{},"SMIL \u002F CSS アニメーションは技術的には可能ですが、ブラウザが",[33,5847,5848],{},"アイドル時には動かさない","等の最適化を入れるケースが多く、過信は禁物です。原則は静止画として設計しましょう。",[340,5851,5852],{"id":5852},"非対応ブラウザへのフォールバック",[11,5854,5855,5031,5858,5861],{},[56,5856,5857],{},"\u003Clink rel=\"icon\" type=\"image\u002Fsvg+xml\">",[56,5859,5860],{},"\u003Clink rel=\"alternate icon\" type=\"image\u002Fx-icon\">"," を並べておけば、対応ブラウザは SVG、非対応は ICO を使います。",[23,5863,5865],{"id":5864},"sitewebmanifest-と-pwa","site.webmanifest と PWA",[340,5867,5868],{"id":5868},"必須プロパティ",[11,5870,5871,5872,5875],{},"PWA 対応を見据えると ",[56,5873,5874],{},"site.webmanifest"," を用意します。最低限の中身はこうなります。",[764,5877,5881],{"className":5878,"code":5879,"language":5880,"meta":236,"style":236},"language-json shiki shiki-themes github-light github-dark","{\n  \"name\": \"My Site\",\n  \"short_name\": \"MySite\",\n  \"icons\": [\n    { \"src\": \"\u002Ficon-192.png\", \"sizes\": \"192x192\", \"type\": \"image\u002Fpng\" },\n    { \"src\": \"\u002Ficon-512.png\", \"sizes\": \"512x512\", \"type\": \"image\u002Fpng\" }\n  ],\n  \"theme_color\": \"#0a0a0a\",\n  \"background_color\": \"#ffffff\",\n  \"display\": \"standalone\"\n}\n","json",[56,5882,5883,5888,5902,5914,5922,5958,5989,5994,6006,6019,6030],{"__ignoreMap":236},[772,5884,5885],{"class":774,"line":775},[772,5886,5887],{"class":778},"{\n",[772,5889,5890,5894,5896,5899],{"class":774,"line":237},[772,5891,5893],{"class":5892},"sj4cs","  \"name\"",[772,5895,2577],{"class":778},[772,5897,5898],{"class":804},"\"My Site\"",[772,5900,5901],{"class":778},",\n",[772,5903,5904,5907,5909,5912],{"class":774,"line":418},[772,5905,5906],{"class":5892},"  \"short_name\"",[772,5908,2577],{"class":778},[772,5910,5911],{"class":804},"\"MySite\"",[772,5913,5901],{"class":778},[772,5915,5916,5919],{"class":774,"line":843},[772,5917,5918],{"class":5892},"  \"icons\"",[772,5920,5921],{"class":778},": [\n",[772,5923,5924,5927,5930,5932,5935,5937,5940,5942,5945,5947,5950,5952,5955],{"class":774,"line":5797},[772,5925,5926],{"class":778},"    { ",[772,5928,5929],{"class":5892},"\"src\"",[772,5931,2577],{"class":778},[772,5933,5934],{"class":804},"\"\u002Ficon-192.png\"",[772,5936,1684],{"class":778},[772,5938,5939],{"class":5892},"\"sizes\"",[772,5941,2577],{"class":778},[772,5943,5944],{"class":804},"\"192x192\"",[772,5946,1684],{"class":778},[772,5948,5949],{"class":5892},"\"type\"",[772,5951,2577],{"class":778},[772,5953,5954],{"class":804},"\"image\u002Fpng\"",[772,5956,5957],{"class":778}," },\n",[772,5959,5960,5962,5964,5966,5969,5971,5973,5975,5978,5980,5982,5984,5986],{"class":774,"line":5803},[772,5961,5926],{"class":778},[772,5963,5929],{"class":5892},[772,5965,2577],{"class":778},[772,5967,5968],{"class":804},"\"\u002Ficon-512.png\"",[772,5970,1684],{"class":778},[772,5972,5939],{"class":5892},[772,5974,2577],{"class":778},[772,5976,5977],{"class":804},"\"512x512\"",[772,5979,1684],{"class":778},[772,5981,5949],{"class":5892},[772,5983,2577],{"class":778},[772,5985,5954],{"class":804},[772,5987,5988],{"class":778}," }\n",[772,5990,5991],{"class":774,"line":5813},[772,5992,5993],{"class":778},"  ],\n",[772,5995,5996,5999,6001,6004],{"class":774,"line":5832},[772,5997,5998],{"class":5892},"  \"theme_color\"",[772,6000,2577],{"class":778},[772,6002,6003],{"class":804},"\"#0a0a0a\"",[772,6005,5901],{"class":778},[772,6007,6009,6012,6014,6017],{"class":774,"line":6008},9,[772,6010,6011],{"class":5892},"  \"background_color\"",[772,6013,2577],{"class":778},[772,6015,6016],{"class":804},"\"#ffffff\"",[772,6018,5901],{"class":778},[772,6020,6022,6025,6027],{"class":774,"line":6021},10,[772,6023,6024],{"class":5892},"  \"display\"",[772,6026,2577],{"class":778},[772,6028,6029],{"class":804},"\"standalone\"\n",[772,6031,6033],{"class":774,"line":6032},11,[772,6034,6035],{"class":778},"}\n",[340,6037,6039],{"id":6038},"ios-の癖","iOS の癖",[11,6041,6042,6043,6045],{},"iOS は ",[56,6044,5707],{}," を優先するため、webmanifest 側に icon を書いても iOS ホーム画面には適用されません。Android と iOS で別々のファイルを用意する前提で運用しましょう。",[23,6047,6049],{"id":6048},"html-に設置する正しい書き方","HTML に設置する正しい書き方",[11,6051,6052,6054],{},[56,6053,5668],{}," に並べる順序のお手本:",[764,6056,6058],{"className":766,"code":6057,"language":768,"meta":236,"style":236},"\u003Clink rel=\"icon\" type=\"image\u002Fsvg+xml\" href=\"\u002Ffavicon.svg\">\n\u003Clink rel=\"alternate icon\" type=\"image\u002Fx-icon\" href=\"\u002Ffavicon.ico\">\n\u003Clink rel=\"apple-touch-icon\" sizes=\"180x180\" href=\"\u002Fapple-touch-icon.png\">\n\u003Clink rel=\"manifest\" href=\"\u002Fsite.webmanifest\">\n\u003Cmeta name=\"theme-color\" content=\"#0a0a0a\">\n",[56,6059,6060,6092,6121,6151,6173],{"__ignoreMap":236},[772,6061,6062,6064,6067,6070,6072,6075,6077,6079,6082,6085,6087,6090],{"class":774,"line":775},[772,6063,779],{"class":778},[772,6065,6066],{"class":782},"link",[772,6068,6069],{"class":797}," rel",[772,6071,801],{"class":778},[772,6073,6074],{"class":804},"\"icon\"",[772,6076,808],{"class":797},[772,6078,801],{"class":778},[772,6080,6081],{"class":804},"\"image\u002Fsvg+xml\"",[772,6083,6084],{"class":797}," href",[772,6086,801],{"class":778},[772,6088,6089],{"class":804},"\"\u002Ffavicon.svg\"",[772,6091,786],{"class":778},[772,6093,6094,6096,6098,6100,6102,6105,6107,6109,6112,6114,6116,6119],{"class":774,"line":237},[772,6095,779],{"class":778},[772,6097,6066],{"class":782},[772,6099,6069],{"class":797},[772,6101,801],{"class":778},[772,6103,6104],{"class":804},"\"alternate icon\"",[772,6106,808],{"class":797},[772,6108,801],{"class":778},[772,6110,6111],{"class":804},"\"image\u002Fx-icon\"",[772,6113,6084],{"class":797},[772,6115,801],{"class":778},[772,6117,6118],{"class":804},"\"\u002Ffavicon.ico\"",[772,6120,786],{"class":778},[772,6122,6123,6125,6127,6129,6131,6134,6137,6139,6142,6144,6146,6149],{"class":774,"line":418},[772,6124,779],{"class":778},[772,6126,6066],{"class":782},[772,6128,6069],{"class":797},[772,6130,801],{"class":778},[772,6132,6133],{"class":804},"\"apple-touch-icon\"",[772,6135,6136],{"class":797}," sizes",[772,6138,801],{"class":778},[772,6140,6141],{"class":804},"\"180x180\"",[772,6143,6084],{"class":797},[772,6145,801],{"class":778},[772,6147,6148],{"class":804},"\"\u002Fapple-touch-icon.png\"",[772,6150,786],{"class":778},[772,6152,6153,6155,6157,6159,6161,6164,6166,6168,6171],{"class":774,"line":843},[772,6154,779],{"class":778},[772,6156,6066],{"class":782},[772,6158,6069],{"class":797},[772,6160,801],{"class":778},[772,6162,6163],{"class":804},"\"manifest\"",[772,6165,6084],{"class":797},[772,6167,801],{"class":778},[772,6169,6170],{"class":804},"\"\u002Fsite.webmanifest\"",[772,6172,786],{"class":778},[772,6174,6175,6177,6180,6183,6185,6188,6191,6193,6195],{"class":774,"line":5797},[772,6176,779],{"class":778},[772,6178,6179],{"class":782},"meta",[772,6181,6182],{"class":797}," name",[772,6184,801],{"class":778},[772,6186,6187],{"class":804},"\"theme-color\"",[772,6189,6190],{"class":797}," content",[772,6192,801],{"class":778},[772,6194,6003],{"class":804},[772,6196,786],{"class":778},[340,6198,6200,6203],{"id":6199},"sizesany-の罠",[56,6201,6202],{},"sizes=\"any\""," の罠",[11,6205,6206,6208,6209,331],{},[56,6207,6202],{}," を SVG に付けると、ブラウザが SVG を ICO より優先するようになります。基本的に意図通りですが、古い iOS で誤解される例があったため、2026 年時点では",[33,6210,6211],{},"書かないのが無難",[23,6213,6215],{"id":6214},"ファビコン生成アプローチの-3-類型と向き不向き","ファビコン生成アプローチの 3 類型と向き不向き",[340,6217,6219],{"id":6218},"アップロード型のオンライン-saas","アップロード型のオンライン SaaS",[11,6221,6222],{},"高機能で一発生成。ただしロゴ画像を一度サーバーに送ります。公開済みのロゴなら気にならないケースが多いです。",[340,6224,6226],{"id":6225},"デスクトップ-ローカルアプリ","デスクトップ \u002F ローカルアプリ",[11,6228,6229],{},"ImageMagick \u002F Sketch \u002F Figma 等。CLI や GUI で手元だけで生成できますが、セットアップが必要です。",[340,6231,6232],{"id":6232},"ブラウザ内完結型",[11,6234,6235,6236,6238,6239,6242],{},"Zerosend の ",[17,6237,5646],{"href":232}," がこの型。",[33,6240,6241],{},"インストール不要 + 手元完結","で、NDA 下の未公開ロゴでも気兼ねなく使えます。",[340,6244,6246],{"id":6245},"nda-下未公開ブランド社内案件での選び方","NDA 下・未公開ブランド・社内案件での選び方",[11,6248,6249,6250,6252],{},"受託案件や新規ブランドの立ち上げでは、ロゴ画像の取り扱いに神経を使います。この場合は",[33,6251,6232],{},"を選ぶか、デスクトップアプリで手元処理するのが安心です。",[23,6254,6256],{"id":6255},"zerosend-でブラウザ内完結で作る手順","Zerosend でブラウザ内完結で作る手順",[11,6258,6259],{},"1 枚の PNG または SVG から、必要なファイル一式 (ICO \u002F PNG 複数サイズ \u002F apple-touch-icon \u002F site.webmanifest \u002F HTML スニペット) を ZIP で一気に生成できます。",[105,6261,6262,6267,6270,6273,6276,6279],{},[30,6263,6264,6266],{},[17,6265,232],{"href":232}," にアクセス",[30,6268,6269],{},"ロゴ画像をドラッグ&ドロップ (推奨: 512×512 以上の正方形)",[30,6271,6272],{},"アプリ名 \u002F theme_color \u002F background_color を入力",[30,6274,6275],{},"「ファビコン一式を生成する」",[30,6277,6278],{},"生成されたプレビューを確認し、ZIP をダウンロード",[30,6280,6281,6282,6285,6286,6288,6289,6292],{},"ZIP に同梱の ",[56,6283,6284],{},"snippet.html"," の内容を ",[56,6287,5668],{}," に貼り付け、各ファイルをサイトのルート (",[56,6290,6291],{},"\u002F",") に配置",[11,6294,6295],{},"ブラウザ内完結なので、ロゴ画像が外部に送られることはありません。",[23,6297,6298],{"id":6298},"よくある失敗",[340,6300,6302],{"id":6301},"retina-で滲む","Retina で滲む",[11,6304,6305],{},"タブで綺麗に見せるには 32×32 や 48×48 も用意する必要があります。Zerosend は 16\u002F32\u002F48 のマルチサイズ ICO を自動で作ります。",[340,6307,6309],{"id":6308},"ios-ホーム画面で余白が出る","iOS ホーム画面で余白が出る",[11,6311,6312,6314,6315,6318],{},[56,6313,5707],{}," は",[33,6316,6317],{},"背景透過に対応していません","。透過 PNG を渡すと iOS が黒背景で埋めてしまうので、背景色を明示的に塗った PNG を用意しましょう。",[340,6320,6322,6324],{"id":6321},"faviconico-だけしか指定していない",[56,6323,5701],{}," だけしか指定していない",[11,6326,6327,6328,6330],{},"モダンブラウザで SVG を使うメリットを取りこぼします。少なくとも ",[56,6329,5724],{}," は併用するのが 2026 年の標準です。",[340,6332,6333],{"id":6333},"ブラウザキャッシュが残って古いアイコンが表示される",[11,6335,6336],{},"ブラウザはファビコンを積極的にキャッシュします。差し替え後に古いアイコンのままになる時は次を試します。",[27,6338,6339,6352,6358,6369],{},[30,6340,6341,6344,6345,1890,6348,6351],{},[33,6342,6343],{},"強制リロード"," (",[56,6346,6347],{},"Ctrl+Shift+R",[56,6349,6350],{},"Cmd+Shift+R",") で再取得",[30,6353,6354,6357],{},[33,6355,6356],{},"プライベート \u002F シークレットウィンドウ"," で確認 (キャッシュを噛まない)",[30,6359,6360,6361,6364,6365,6368],{},"本番では ",[56,6362,6363],{},"\u003Clink rel=\"icon\" href=\"\u002Ffavicon.ico?v=2\">"," のように",[33,6366,6367],{},"バージョンクエリ","を付けて即時反映を促す",[30,6370,6371,6372,6375],{},"Chrome は ",[56,6373,6374],{},"chrome:\u002F\u002Ffavicon\u002Fhttps:\u002F\u002Fyour-site.com\u002F"," でブラウザが認識しているファビコンを直接確認できる",[340,6377,6379],{"id":6378},"google-検索結果にファビコンが出ない","Google 検索結果にファビコンが出ない",[11,6381,6382,6383,6386],{},"Google モバイル SERP に表示されるには ",[33,6384,6385],{},"48×48 以上のアイコンがクロール可能","であること、かつ「サイト全体を代表するアイコン」というガイドラインに沿っていることが求められます。Zerosend のファビコン生成ツールは 16\u002F32\u002F48 のマルチサイズ ICO を自動で書き出すため、この要件は満たせます。サブドメインごとに別のファビコンを設定することも可能です。",[23,6388,1187],{"id":1187},[11,6390,6391,6392,6395],{},"2026 年のファビコン運用は「SVG を第一選択 + ICO \u002F apple-touch-icon \u002F PWA アイコン + webmanifest」の組み合わせで完成します。1 枚の画像から一式を生成するなら、ブラウザ内で完結する ",[17,6393,6394],{"href":232},"Zerosend のファビコン生成ツール"," が手早くておすすめです。",[11,6397,5585,6398],{},[17,6399,6401],{"href":6400},"\u002Fblog\u002Ffavicon-generator-intro","ファビコン生成ツールの舞台裏",[875,6403,6404],{},"html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}",{"title":236,"searchDepth":237,"depth":237,"links":6406},[6407,6412,6418,6423,6427,6431,6437,6438,6446],{"id":5650,"depth":237,"text":5651,"children":6408},[6409,6411],{"id":5654,"depth":418,"text":6410},"\u003Clink> タグで参照される機能の総称",{"id":5682,"depth":418,"text":5683},{"id":5689,"depth":237,"text":5690,"children":6413},[6414,6415,6417],{"id":5693,"depth":418,"text":5694},{"id":5720,"depth":418,"text":6416},"推奨: favicon.svg",{"id":5734,"depth":418,"text":5734},{"id":5751,"depth":237,"text":5752,"children":6419},[6420,6421,6422],{"id":5755,"depth":418,"text":5755},{"id":5841,"depth":418,"text":5842},{"id":5852,"depth":418,"text":5852},{"id":5864,"depth":237,"text":5865,"children":6424},[6425,6426],{"id":5868,"depth":418,"text":5868},{"id":6038,"depth":418,"text":6039},{"id":6048,"depth":237,"text":6049,"children":6428},[6429],{"id":6199,"depth":418,"text":6430},"sizes=\"any\" の罠",{"id":6214,"depth":237,"text":6215,"children":6432},[6433,6434,6435,6436],{"id":6218,"depth":418,"text":6219},{"id":6225,"depth":418,"text":6226},{"id":6232,"depth":418,"text":6232},{"id":6245,"depth":418,"text":6246},{"id":6255,"depth":237,"text":6256},{"id":6298,"depth":237,"text":6298,"children":6439},[6440,6441,6442,6444,6445],{"id":6301,"depth":418,"text":6302},{"id":6308,"depth":418,"text":6309},{"id":6321,"depth":418,"text":6443},"favicon.ico だけしか指定していない",{"id":6333,"depth":418,"text":6333},{"id":6378,"depth":418,"text":6379},{"id":1187,"depth":237,"text":1187},"ファビコンのサイズは結局どれが必要? ICO と SVG の使い分けは? 2026 年時点で本当に必要なアイコンセットと、1 枚の画像からブラウザ内で一式生成できる方法を解説します。",{},"\u002Fblog\u002Ffavicon-complete-guide-2026",{"title":5638,"description":6447},"favicon-complete-guide-2026","blog\u002Ffavicon-complete-guide-2026",[6454,430,6455],"ファビコン","SVG","rGRV7aRcqetLpG7f7z1cHwfvIdswbm-q-bojGTxqaWs",{"id":6458,"title":6459,"author":6,"body":6460,"category":248,"coverImage":248,"description":6665,"draft":250,"extension":251,"locale":252,"meta":6666,"navigation":254,"noindex":250,"path":6400,"publishedAt":5628,"seo":6667,"slug":6668,"stem":6669,"tags":6670,"updatedAt":5628,"__hash__":6671},"blog\u002Fblog\u002Ffavicon-generator-intro.md","ブラウザだけで作るファビコン一式 — \u002Ftools\u002Ffavicon-generator の舞台裏",{"type":8,"value":6461,"toc":6654},[6462,6465,6468,6471,6474,6479,6482,6485,6527,6530,6565,6569,6576,6579,6599,6606,6608,6620,6626,6629,6632,6634,6646,6648],[23,6463,6464],{"id":6464},"ファビコンが必要な理由",[11,6466,6467],{},"ファビコンは、ブラウザのタブやブックマーク一覧でサイトを識別する小さなアイコンです。スマートフォンのホーム画面に「追加」したときに表示されるアイコン (apple-touch-icon \u002F PWA アイコン) も、ファビコン一式の一部です。「ファビコンがない」「サイズが揃っていない」といった状態は、ユーザーの信頼感を下げ、PWA 対応の妨げにもなります。",[23,6469,6470],{"id":6470},"背景",[11,6472,6473],{},"サイトのファビコンを更新する作業は、新規サイトでも既存サイトのリブランディングでも発生します。ロゴ画像 1 枚から必要なアイコンセットを揃えるのは地味に手間のかかる工程です。",[11,6475,6476,6478],{},[17,6477,6394],{"href":232}," は、この工程をブラウザ内で完結させます。ロゴ画像を外部に送らずに一式を作成できるので、NDA 下の受託案件や未公開のブランディング作業でも安心して使えます。",[23,6480,6481],{"id":6481},"何が出力されるか",[11,6483,6484],{},"1 枚の画像 (PNG \u002F JPG \u002F WebP \u002F SVG) から次の 9 ファイルを生成し、ZIP で配布します。",[27,6486,6487,6492,6503,6508,6515,6519],{},[30,6488,6489,6491],{},[56,6490,5701],{}," — 16 \u002F 32 \u002F 48px のマルチサイズ ICO",[30,6493,6494,1890,6497,1890,6500],{},[56,6495,6496],{},"favicon-16.png",[56,6498,6499],{},"favicon-32.png",[56,6501,6502],{},"favicon-48.png",[30,6504,6505,6507],{},[56,6506,5707],{}," (180×180)",[30,6509,6510,1890,6512,6514],{},[56,6511,5713],{},[56,6513,5716],{}," (PWA)",[30,6516,6517],{},[56,6518,5874],{},[30,6520,6521,6523,6524,6526],{},[56,6522,6284],{}," — ",[56,6525,5668],{}," に貼り付ける link タグ",[23,6528,6529],{"id":6529},"使い方ステップ",[105,6531,6532,6538,6548,6554],{},[30,6533,6534,6537],{},[33,6535,6536],{},"画像を準備する"," — 正方形の PNG \u002F JPG \u002F WebP \u002F SVG を用意。最低でも 512×512px 推奨",[30,6539,6540,6523,6543,6547],{},[33,6541,6542],{},"ドロップする",[17,6544,6545],{"href":232},[56,6546,232],{}," を開いてドラッグ&ドロップ",[30,6549,6550,6553],{},[33,6551,6552],{},"ZIP をダウンロードする"," — ボタンを押すと 9 ファイルが入った ZIP が生成される",[30,6555,6556,6523,6559,6561,6562,6564],{},[33,6557,6558],{},"HTML に貼り付ける",[56,6560,6284],{}," の内容をサイトの ",[56,6563,5668],{}," にコピーして完了",[23,6566,6568],{"id":6567},"ico-を自前で書き出す","ICO を自前で書き出す",[11,6570,6571,6572,6575],{},"PNG は Canvas API で簡単に書き出せますが、ICO は少し工夫が必要です。とはいえ、Windows Vista 以降の ICO は ",[33,6573,6574],{},"PNG バイト列をそのまま埋め込める"," ため、意外と単純です。",[11,6577,6578],{},"構造:",[27,6580,6581,6587,6593],{},[30,6582,6583,6586],{},[33,6584,6585],{},"ICONDIR"," (6 バイト): reserved \u002F type \u002F image count",[30,6588,6589,6592],{},[33,6590,6591],{},"ICONDIRENTRY"," (16 バイト × 画像数): 幅 \u002F 高さ \u002F bpp \u002F サイズ \u002F オフセット",[30,6594,6595,6598],{},[33,6596,6597],{},"画像データ",": PNG のバイト列を順に連結",[11,6600,6601,6602,6605],{},"依存ゼロで 30 行程度に収まります。",[56,6603,6604],{},"domain\u002Fprocessors\u002FfaviconGenerator.ts"," で実装を公開しています。",[23,6607,180],{"id":180},[11,6609,6610,6613,6614,6616,6617,6619],{},[33,6611,6612],{},"Q. どのサイズが必要ですか？","\nA. 最低限は ",[56,6615,5701],{}," (16\u002F32px) と ",[56,6618,5707],{}," (180px) です。PWA 対応するなら 192px と 512px も必要です。本ツールはこれらをすべて一括生成します。",[11,6621,6622,6625],{},[33,6623,6624],{},"Q. SVG のロゴから生成できますか？","\nA. はい。SVG を入力するとブラウザ側で各サイズにラスタライズしてから ICO \u002F PNG を生成します。",[23,6627,6628],{"id":6628},"検証の楽しさ",[11,6630,6631],{},"作ったあとは DevTools の Network タブで確認できます。画像選択 → 生成 → ダウンロードの全てで、あなたのロゴが外に出ないことを自分で検証できます。",[23,6633,206],{"id":206},[27,6635,6636,6641],{},[30,6637,6638,6640],{},[17,6639,2182],{"href":2181}," — 入力画像が大きすぎる場合、事前に軽量化",[30,6642,6643,6645],{},[17,6644,2189],{"href":2188}," — 正方形にトリミングしてからファビコン生成すると精度が上がる",[23,6647,1187],{"id":1187},[11,6649,6650,6651,94],{},"1 枚の画像から ICO \u002F PNG \u002F apple-touch-icon \u002F manifest \u002F HTML スニペットを、あなたの端末だけで生成できます。",[17,6652,6653],{"href":232},"試してみてください",{"title":236,"searchDepth":237,"depth":237,"links":6655},[6656,6657,6658,6659,6660,6661,6662,6663,6664],{"id":6464,"depth":237,"text":6464},{"id":6470,"depth":237,"text":6470},{"id":6481,"depth":237,"text":6481},{"id":6529,"depth":237,"text":6529},{"id":6567,"depth":237,"text":6568},{"id":180,"depth":237,"text":180},{"id":6628,"depth":237,"text":6628},{"id":206,"depth":237,"text":206},{"id":1187,"depth":237,"text":1187},"1 枚の画像から ICO \u002F PNG \u002F apple-touch-icon \u002F site.webmanifest を生成するファビコン生成ツールを公開しました。ICO フォーマットを自前で書き出す実装のポイントを紹介します。",{},{"title":6459,"description":6665},"favicon-generator-intro","blog\u002Ffavicon-generator-intro",[262,5634],"3t3z-Zm-s-OgpewxhvXXeVAxzDosMQLq8XTZRneQGs4",{"id":6673,"title":6674,"author":6,"body":6675,"category":247,"coverImage":248,"description":6932,"draft":250,"extension":251,"locale":252,"meta":6933,"navigation":254,"noindex":250,"path":6934,"publishedAt":5628,"seo":6935,"slug":6936,"stem":6937,"tags":6938,"updatedAt":5628,"__hash__":6940},"blog\u002Fblog\u002Fheic-to-jpg-windows.md","Windows で HEIC を JPG に変換する 3 つの方法 — 無料・オンライン・アップロード不要",{"type":8,"value":6676,"toc":6908},[6677,6684,6688,6692,6699,6703,6706,6710,6713,6716,6730,6733,6745,6749,6754,6757,6773,6777,6784,6787,6791,6794,6798,6806,6813,6817,6869,6871,6874,6877,6881,6888,6892,6895,6897],[11,6678,6679,6680,6683],{},"iPhone から送られてきた写真 (",[56,6681,6682],{},".HEIC"," 形式) を Windows で開こうとして「このファイルを開けません」のダイアログで止まった経験がある人向け。3 つの解決方法を比較します。",[23,6685,6687],{"id":6686},"heic-とは何か-30-秒解説","HEIC とは何か (30 秒解説)",[340,6689,6691],{"id":6690},"apple-が推進する高圧縮画像フォーマット","Apple が推進する高圧縮画像フォーマット",[11,6693,6694,6695,6698],{},"HEIC (High Efficiency Image Container) は、iPhone 7 以降のデフォルト撮影形式です。JPG と比べて",[33,6696,6697],{},"同じ画質で約半分のファイルサイズ","を実現します。写真のストレージ節約目的で採用されています。",[340,6700,6702],{"id":6701},"windows-が標準対応していない理由","Windows が標準対応していない理由",[11,6704,6705],{},"HEIC の特許関係で、Windows には標準でコーデックが入っていません。対応するには拡張機能の追加 or 変換が必要です。",[23,6707,6709],{"id":6708},"方法-1-microsoft-store-の-heifhevc-拡張機能","方法 1: Microsoft Store の HEIF\u002FHEVC 拡張機能",[11,6711,6712],{},"Windows 10\u002F11 で HEIC を「フォト」アプリで直接開けるようにする方法。",[340,6714,6715],{"id":6715},"手順",[105,6717,6718,6721,6724,6727],{},[30,6719,6720],{},"Microsoft Store を開く",[30,6722,6723],{},"「HEIF 画像拡張機能」を検索してインストール (無料)",[30,6725,6726],{},"「HEVC ビデオ拡張機能」もインストール (有料の場合あり、~120 円程度)",[30,6728,6729],{},"再起動不要、すぐに HEIC が開けるようになる",[340,6731,6732],{"id":6732},"注意点",[27,6734,6735,6738],{},[30,6736,6737],{},"HEVC の方は Microsoft Store のポリシー次第で有料化されている期間があります",[30,6739,6740,6741,6744],{},"拡張機能を入れても、",[33,6742,6743],{},"Windows 標準のフォトビューアー","以外では開けないツールがあります (サードパーティ画像編集ソフト等)",[23,6746,6748],{"id":6747},"方法-2-zerosend-でブラウザ内変換-推奨","方法 2: Zerosend でブラウザ内変換 (推奨)",[11,6750,6751,6753],{},[17,6752,2036],{"href":2036}," は、ブラウザだけで HEIC → JPG 変換を行うツールです。",[340,6755,6715],{"id":6756},"手順-1",[105,6758,6759,6764,6767,6770],{},[30,6760,6761,6266],{},[17,6762,6763],{"href":2036},"Zerosend HEIC → JPG",[30,6765,6766],{},"HEIC ファイルをドラッグ&ドロップ (複数可)",[30,6768,6769],{},"「変換する」ボタン",[30,6771,6772],{},"JPG をダウンロード",[340,6774,6776],{"id":6775},"iphone-から送った写真が外に出ないメリット","iPhone から送った写真が外に出ないメリット",[11,6778,6779,6780,6783],{},"HEIC は iPhone の撮影形式、つまり",[33,6781,6782],{},"個人の写真","です。家族のプライベート写真や顔写真が写り込んだ業務資料を、一度クラウド SaaS にアップロードして変換させるのは気持ちの良い行為ではありません。",[11,6785,6786],{},"Zerosend はブラウザ内で完結するため、写真が外部に送られません。DevTools の Network タブで確認できます。",[23,6788,6790],{"id":6789},"方法-3-iphone-側で互換性優先に変更","方法 3: iPhone 側で「互換性優先」に変更",[11,6792,6793],{},"そもそも HEIC ではなく JPG で撮影する設定に変える方法。",[340,6795,6797],{"id":6796},"手順-ios","手順 (iOS)",[105,6799,6800,6803],{},[30,6801,6802],{},"設定 → カメラ → フォーマット",[30,6804,6805],{},"「高効率」→「互換性優先」に変更",[11,6807,6808,6809,6812],{},"これで以降の撮影は JPG になります。ただし",[33,6810,6811],{},"容量は 1.5〜2 倍","に増えるので、iPhone のストレージとの兼ね合いで判断してください。",[23,6814,6816],{"id":6815},"どの方法が良いか-用途別まとめ","どの方法が良いか (用途別まとめ)",[920,6818,6819,6829],{},[923,6820,6821],{},[926,6822,6823,6826],{},[929,6824,6825],{},"シーン",[929,6827,6828],{},"おすすめ",[936,6830,6831,6839,6847,6855,6862],{},[926,6832,6833,6836],{},[941,6834,6835],{},"1〜2 枚を今だけ開きたい",[941,6837,6838],{},"方法 1 (拡張機能)",[926,6840,6841,6844],{},[941,6842,6843],{},"まとめて JPG 化したい (複数枚)",[941,6845,6846],{},"方法 2 (Zerosend)",[926,6848,6849,6852],{},[941,6850,6851],{},"今後撮る写真は Windows で扱いやすくしたい",[941,6853,6854],{},"方法 3 (iPhone 設定)",[926,6856,6857,6860],{},[941,6858,6859],{},"プライバシーに気を配りたい",[941,6861,6846],{},[926,6863,6864,6867],{},[941,6865,6866],{},"業務で他社に JPG で渡したい",[941,6868,6846],{},[23,6870,180],{"id":180},[340,6872,6873],{"id":6873},"画質は劣化するか",[11,6875,6876],{},"HEIC → JPG の変換は非可逆同士の変換なので、わずかに劣化します。Zerosend は変換品質を 92% に設定しており、肉眼での判別は困難なレベルです。",[340,6878,6880],{"id":6879},"exif-撮影日時位置情報-は残るか","EXIF (撮影日時・位置情報) は残るか",[11,6882,6883,6884,6887],{},"iPhone の HEIC に含まれる EXIF は、変換時に基本的に引き継がれます。ただし Zerosend は",[33,6885,6886],{},"プライバシー配慮で EXIF を自動削除","します。撮影日時を残したい場合は、方法 1 (拡張機能で開くだけ) を選ぶか、別ツールで明示的に保持してください。",[340,6889,6891],{"id":6890},"連写した大量の-heic-も一括変換できるか","連写した大量の HEIC も一括変換できるか",[11,6893,6894],{},"Zerosend は複数ファイルの一括変換に対応しており、結果は ZIP でまとめてダウンロードできます。100 枚単位の処理も問題ありません (ブラウザのメモリ次第)。",[23,6896,1187],{"id":1187},[11,6898,6899,6900,6903,6904,6907],{},"HEIC が開けないという問題は、拡張機能・オンライン変換・撮影設定変更の 3 通りで解決できます。",[33,6901,6902],{},"一度にたくさん + プライバシー重視","なら、ブラウザ内で完結する ",[17,6905,6906],{"href":2036},"Zerosend の HEIC → JPG 変換"," が一番実用的です。",{"title":236,"searchDepth":237,"depth":237,"links":6909},[6910,6914,6918,6922,6925,6926,6931],{"id":6686,"depth":237,"text":6687,"children":6911},[6912,6913],{"id":6690,"depth":418,"text":6691},{"id":6701,"depth":418,"text":6702},{"id":6708,"depth":237,"text":6709,"children":6915},[6916,6917],{"id":6715,"depth":418,"text":6715},{"id":6732,"depth":418,"text":6732},{"id":6747,"depth":237,"text":6748,"children":6919},[6920,6921],{"id":6756,"depth":418,"text":6715},{"id":6775,"depth":418,"text":6776},{"id":6789,"depth":237,"text":6790,"children":6923},[6924],{"id":6796,"depth":418,"text":6797},{"id":6815,"depth":237,"text":6816},{"id":180,"depth":237,"text":180,"children":6927},[6928,6929,6930],{"id":6873,"depth":418,"text":6873},{"id":6879,"depth":418,"text":6880},{"id":6890,"depth":418,"text":6891},{"id":1187,"depth":237,"text":1187},"iPhone の HEIC 写真が Windows で開けない時の解決策を 3 通り解説。Microsoft Store 拡張機能、ブラウザ内変換 (Zerosend)、iPhone の設定変更を比較し、用途別のおすすめを紹介します。",{},"\u002Fblog\u002Fheic-to-jpg-windows",{"title":6674,"description":6932},"heic-to-jpg-windows","blog\u002Fheic-to-jpg-windows",[2219,624,6939],"Windows","980U9DKFglaadPkZ3zjYq5jDasjMkJdPDF9-XLyb51g",{"id":6942,"title":6943,"author":6,"body":6944,"category":247,"coverImage":248,"description":7365,"draft":250,"extension":251,"locale":252,"meta":7366,"navigation":254,"noindex":250,"path":7367,"publishedAt":5628,"seo":7368,"slug":7369,"stem":7370,"tags":7371,"updatedAt":423,"__hash__":7372},"blog\u002Fblog\u002Fimage-compress-guide.md","オンライン画像圧縮 完全ガイド 2026 — 画質を落とさず最大限軽くする方法",{"type":8,"value":6945,"toc":7333},[6946,6953,6956,6960,6967,6971,6974,6977,6981,6994,6997,7001,7008,7018,7022,7036,7043,7047,7051,7058,7061,7143,7150,7154,7161,7165,7175,7182,7186,7193,7197,7204,7207,7211,7214,7229,7232,7239,7242,7245,7249,7267,7270,7274,7292,7295,7299,7305,7308,7315,7319,7326,7328],[11,6947,6948,6949,6952],{},"Web サイトに画像を載せるとき、「軽くしたいけど画質は落としたくない」という悩みは共通です。本記事では、画像圧縮の基本と実用的なコツ、そしてファイルをサーバーに預けずに処理できる ",[17,6950,6951],{"href":2181},"Zerosend の画像圧縮ツール"," の使い方を整理します。",[23,6954,6955],{"id":6955},"なぜ画像圧縮が必要か",[340,6957,6959],{"id":6958},"表示速度と-seo-core-web-vitals","表示速度と SEO (Core Web Vitals)",[11,6961,6962,6963,6966],{},"Google の Core Web Vitals では、ページ内の最大コンテンツの表示時間 (LCP) を評価軸にしています。LCP の遅延原因の多くは",[33,6964,6965],{},"巨大な画像","です。未圧縮の写真を 1 枚置くだけで、モバイル回線ではページ全体の表示が数秒遅れます。検索順位にも影響します。",[340,6968,6970],{"id":6969},"サーバー費用ストレージ節約","サーバー費用・ストレージ節約",[11,6972,6973],{},"画像 1 枚あたり数 MB を 100 枚置けば数 GB。配信帯域・ストレージ・CDN 費用は使い手がその画像を見る回数だけ上乗せで発生します。初期の圧縮コストをサボるほど、後でお金と速度の両方で払うことになります。",[23,6975,6976],{"id":6976},"主要な画像フォーマットと圧縮方式",[340,6978,6980],{"id":6979},"jpg-と-png-の使い分け","JPG と PNG の使い分け",[27,6982,6983,6989],{},[30,6984,6985,6988],{},[33,6986,6987],{},"JPG",": 写真向け。非可逆圧縮 (情報を捨てて軽くする)。透過不可。",[30,6990,6991,6993],{},[33,6992,2319],{},": ロゴ・スクリーンショット・透過が必要な画像向け。可逆圧縮。",[11,6995,6996],{},"写真を PNG で保存すると JPG の 5〜10 倍の容量になります。まずこの判断を間違えないこと。",[340,6998,7000],{"id":6999},"webp-avif-の現在地","WebP \u002F AVIF の現在地",[11,7002,7003,7004,7007],{},"2026 年時点では ",[33,7005,7006],{},"WebP は実質全ブラウザで使えます","。AVIF も主要ブラウザが対応済みで、JPG の 2〜3 割小さい容量を実現できます。",[11,7009,7010,7011,7013,7014,7017],{},"互換性が不安なら、WebP を第一選択にしつつ、フォールバックで JPG \u002F PNG を用意するのが安全です。",[56,7012,761],{}," タグの ",[56,7015,7016],{},"srcset"," で自動切替できます。",[340,7019,7021],{"id":7020},"可逆圧縮-vs-非可逆圧縮","可逆圧縮 vs 非可逆圧縮",[27,7023,7024,7030],{},[30,7025,7026,7029],{},[33,7027,7028],{},"可逆 (lossless)",": ファイルを小さくするが画質は 1 ピクセルも失わない。PNG \u002F WebP lossless \u002F AVIF lossless。",[30,7031,7032,7035],{},[33,7033,7034],{},"非可逆 (lossy)",": 人間の目に目立ちにくい情報を捨てて大幅に軽くする。JPG \u002F WebP lossy \u002F AVIF。",[11,7037,7038,7039,7042],{},"Web 配信用は",[33,7040,7041],{},"基本的に非可逆で十分","。ロゴやイラストのような「元画像が重要」なものだけ可逆を選びます。",[23,7044,7046],{"id":7045},"画質を落とさず圧縮する-5-つのコツ","画質を落とさず圧縮する 5 つのコツ",[340,7048,7050],{"id":7049},"_1-品質-8085-の黄金点","1. 品質 80〜85 % の黄金点",[11,7052,7053,7054,7057],{},"JPG の品質設定は 100% ではなく ",[33,7055,7056],{},"85% がベスト","です。体感の画質差はほぼ分かりませんが、ファイルサイズは 100% の約 40% まで落ちます。70% まで下げると輪郭にノイズが出始めるので、そこが下限の目安です。",[11,7059,7060],{},"具体的な目安は次の通りです (元画像比のおおよその容量)。",[920,7062,7063,7076],{},[923,7064,7065],{},[926,7066,7067,7070,7073],{},[929,7068,7069],{},"品質",[929,7071,7072],{},"体感画質",[929,7074,7075],{},"容量目安 (元比)",[936,7077,7078,7089,7099,7110,7121,7132],{},[926,7079,7080,7083,7086],{},[941,7081,7082],{},"100",[941,7084,7085],{},"最高",[941,7087,7088],{},"100%",[926,7090,7091,7094,7096],{},[941,7092,7093],{},"95",[941,7095,7085],{},[941,7097,7098],{},"70%",[926,7100,7101,7104,7107],{},[941,7102,7103],{},"85",[941,7105,7106],{},"ほぼ最高",[941,7108,7109],{},"40%",[926,7111,7112,7115,7118],{},[941,7113,7114],{},"75",[941,7116,7117],{},"良好",[941,7119,7120],{},"30%",[926,7122,7123,7126,7129],{},[941,7124,7125],{},"60",[941,7127,7128],{},"ノイズが見え始める",[941,7130,7131],{},"22%",[926,7133,7134,7137,7140],{},[941,7135,7136],{},"40",[941,7138,7139],{},"明らかに劣化",[941,7141,7142],{},"15%",[11,7144,7145,7146,7149],{},"85% より上は容量効率が悪く、これより下はブロックノイズが目立ち始めます。",[33,7147,7148],{},"85% が黄金点","である理由がここにあります。",[340,7151,7153],{"id":7152},"_2-不要なメタデータを削る","2. 不要なメタデータを削る",[11,7155,7156,7157,7160],{},"スマホで撮った写真には EXIF (撮影日時・GPS 位置情報・カメラ機種) が埋め込まれています。サイズ的にわずか数十 KB ですが、",[33,7158,7159],{},"プライバシー面でも削るべき","です。Zerosend の画像圧縮は保存時に EXIF を自動で除去します。",[340,7162,7164],{"id":7163},"_3-画像サイズを先にリサイズ","3. 画像サイズを先にリサイズ",[11,7166,7167,7168,7170,7171,7174],{},"圧縮前に画像サイズ (ピクセル) を表示サイズに合わせることが、品質と容量を両立する最強の施策です。300px で表示する画像を 3000px のまま圧縮しても、帯域の無駄でしかありません。",[17,7169,572],{"href":2188}," で",[33,7172,7173],{},"先に縮めてから","圧縮してください。",[11,7176,7177,7178,7181],{},"なお、",[33,7179,7180],{},"元画像より大きいサイズに拡大しても画質は上がりません","。800px の画像を 1600px にリサイズすると、補間で輪郭がぼやけるだけで情報量は増えません。リサイズは「元画像の最大サイズを上限」にして縮小方向だけに使うのが鉄則です。",[340,7183,7185],{"id":7184},"_4-複数ツールを重ねがけしない","4. 複数ツールを重ねがけしない",[11,7187,7188,7189,7192],{},"非可逆圧縮は毎回わずかに画質が落ちます。「JPG を圧縮 → またアップ → また圧縮」を繰り返すと、ジワジワ劣化が積み重なります。元画像から ",[33,7190,7191],{},"1 回だけ"," 圧縮する運用にしましょう。",[340,7194,7196],{"id":7195},"_5-重要な画像だけ手動で確認","5. 重要な画像だけ手動で確認",[11,7198,7199,7200,7203],{},"自動処理で全部済ませてよい画像と、見出し画像やアイキャッチのように",[33,7201,7202],{},"手動で結果を確認すべき画像","を分けます。後者は品質 85% に加えて、元画像とのスライダー比較を挟むと事故を防げます。",[23,7205,7206],{"id":7206},"オンライン画像圧縮ツールの選び方",[340,7208,7210],{"id":7209},"アップロードされるされないを見分ける","アップロードされる\u002Fされないを見分ける",[11,7212,7213],{},"「オンラインで無料で使える」と謳うツールの多くは、一度ファイルをサーバーに送って処理しています。画像のロゴや社内資料では、これが問題になる場面があります。",[11,7215,7216,7217,7220,7221,7224,7225,7228],{},"見分け方はシンプルです。ブラウザの ",[33,7218,7219],{},"DevTools を開き Network タブを表示","してからツールを使ってみてください。アップロード時に大きなデータを伴う POST リクエストが出ていれば、そのツールは送信型です。",[17,7222,7223],{"href":2181},"Zerosend の画像圧縮"," はこの検証で",[33,7226,7227],{},"送信ゼロ","が確認できます。",[340,7230,7231],{"id":7231},"画質コントロールの柔軟性",[11,7233,7234,7235,7238],{},"品質スライダーがあるか、形式を選べるか、出力プレビューがあるかは必ずチェックしましょう。プリセット一択のツールは",[33,7236,7237],{},"過剰圧縮","に陥りがちです。",[340,7240,7241],{"id":7241},"バッチ処理に対応しているか",[11,7243,7244],{},"1 枚ずつでは時間がかかる業務向けに、複数ファイルの一括処理 + ZIP ダウンロードに対応したツールを選びます。",[23,7246,7248],{"id":7247},"zerosend-でブラウザ内完結の画像圧縮をする手順","Zerosend でブラウザ内完結の画像圧縮をする手順",[105,7250,7251,7255,7258,7261,7264],{},[30,7252,7253,6266],{},[17,7254,2181],{"href":2181},[30,7256,7257],{},"画像をドラッグ&ドロップ (JPG \u002F PNG \u002F WebP、複数可)",[30,7259,7260],{},"品質スライダーを調整 (推奨は 80)",[30,7262,7263],{},"「圧縮する」ボタン",[30,7265,7266],{},"1 枚ならそのまま、複数なら ZIP でダウンロード",[11,7268,7269],{},"すべての処理がブラウザ内で完結するので、機密画像も安心して扱えます。",[340,7271,7273],{"id":7272},"devtools-の-network-タブで検証する方法","DevTools の Network タブで検証する方法",[105,7275,7276,7279,7282,7285],{},[30,7277,7278],{},"圧縮する前に DevTools を開く (右クリック → 検証)",[30,7280,7281],{},"Network タブに切り替え、「Preserve log」をオンに",[30,7283,7284],{},"画像をドラッグ&ドロップして処理を走らせる",[30,7286,7287,7288,7291],{},"表示される通信が CDN \u002F GA \u002F AdSense だけで、",[33,7289,7290],{},"画像自体を POST している通信がない"," ことを確認",[23,7293,7294],{"id":7294},"よくある落とし穴",[340,7296,7298],{"id":7297},"透過-png-が白背景になる","透過 PNG が白背景になる",[11,7300,7301,7302,7304],{},"JPG は透過を扱えません。PNG の透過画像を「形式変換: JPG」で処理すると、透過部分が白で埋まります。透過を保ちたい場合は PNG のまま \u002F WebP に変換してください。",[17,7303,722],{"href":2195}," を参照。",[340,7306,7307],{"id":7307},"圧縮後に色がくすむ",[11,7309,7310,7311,7314],{},"sRGB 以外のプロファイル (Adobe RGB \u002F Display P3) で保存された画像は、非対応ブラウザで色がくすんで見えることがあります。Web 配信は ",[33,7312,7313],{},"sRGB に統一","するのが無難です。",[340,7316,7318],{"id":7317},"sns-側で再圧縮される","SNS 側で再圧縮される",[11,7320,7321,7322,7325],{},"Twitter \u002F Instagram \u002F LINE では、投稿された画像がプラットフォーム側でさらに圧縮されます。自分で極限まで圧縮するよりも、",[33,7323,7324],{},"そこそこで止めて SNS の再圧縮に任せる","方が綺麗に見えるケースもあります。",[23,7327,1187],{"id":1187},[11,7329,7330,7331,94],{},"画像圧縮は「JPG 品質 85% を目安に、先にリサイズ、メタデータは削る」の 3 原則で大半がうまくいきます。Zerosend の画像圧縮は、この原則をブラウザ内で実現します。機密画像でも気兼ねなく使えるので、",[17,7332,6653],{"href":2181},{"title":236,"searchDepth":237,"depth":237,"links":7334},[7335,7339,7344,7351,7356,7359,7364],{"id":6955,"depth":237,"text":6955,"children":7336},[7337,7338],{"id":6958,"depth":418,"text":6959},{"id":6969,"depth":418,"text":6970},{"id":6976,"depth":237,"text":6976,"children":7340},[7341,7342,7343],{"id":6979,"depth":418,"text":6980},{"id":6999,"depth":418,"text":7000},{"id":7020,"depth":418,"text":7021},{"id":7045,"depth":237,"text":7046,"children":7345},[7346,7347,7348,7349,7350],{"id":7049,"depth":418,"text":7050},{"id":7152,"depth":418,"text":7153},{"id":7163,"depth":418,"text":7164},{"id":7184,"depth":418,"text":7185},{"id":7195,"depth":418,"text":7196},{"id":7206,"depth":237,"text":7206,"children":7352},[7353,7354,7355],{"id":7209,"depth":418,"text":7210},{"id":7231,"depth":418,"text":7231},{"id":7241,"depth":418,"text":7241},{"id":7247,"depth":237,"text":7248,"children":7357},[7358],{"id":7272,"depth":418,"text":7273},{"id":7294,"depth":237,"text":7294,"children":7360},[7361,7362,7363],{"id":7297,"depth":418,"text":7298},{"id":7307,"depth":418,"text":7307},{"id":7317,"depth":418,"text":7318},{"id":1187,"depth":237,"text":1187},"画像圧縮で画質を落とさず最大限軽くするための実用テクと、ファイルをサーバーに送らずブラウザだけで圧縮する方法を解説。品質 85% の黄金点・フォーマット選び・リサイズとの順序まで。",{},"\u002Fblog\u002Fimage-compress-guide",{"title":6943,"description":7365},"image-compress-guide","blog\u002Fimage-compress-guide",[624,626,902],"WgkSGzLGGIWj-RYIlFVIe_Mx6myS-glWbsNMBp0XNvU",{"id":7374,"title":7375,"author":6,"body":7376,"category":247,"coverImage":248,"description":7980,"draft":250,"extension":251,"locale":252,"meta":7981,"navigation":254,"noindex":250,"path":7982,"publishedAt":5628,"seo":7983,"slug":7984,"stem":7985,"tags":7986,"updatedAt":423,"__hash__":7987},"blog\u002Fblog\u002Fpdf-merge-guide.md","PDF 結合 無料 — 顧客情報をアップロードせずに処理する完全手順 2026",{"type":8,"value":7377,"toc":7946},[7378,7385,7389,7392,7395,7398,7401,7405,7408,7412,7416,7423,7433,7437,7440,7444,7447,7451,7458,7462,7484,7487,7491,7498,7501,7504,7521,7554,7558,7561,7611,7615,7618,7621,7628,7631,7634,7638,7642,7645,7649,7652,7656,7667,7671,7681,7893,7900,7904,7906,7909,7912,7915,7917,7924,7927,7929,7938,7943],[11,7379,7380,7381,7384],{},"複数の PDF を 1 つに結合したいが、契約書や請求書を見ず知らずのサーバーに送るのは気が引ける。そんな時に使えるのが、ブラウザだけで完結する ",[17,7382,7383],{"href":3255},"Zerosend の PDF 結合ツール"," です。本記事では選び方のポイント、よくあるトラブル、B2B 現場で使う運用ルールまでまとめます。",[23,7386,7388],{"id":7387},"pdf-結合が業務で必要になる典型シーン","PDF 結合が業務で必要になる典型シーン",[340,7390,7391],{"id":7391},"請求書の月次まとめ",[11,7393,7394],{},"取引先ごとに発行された請求書 PDF を、月末に 1 本の PDF にまとめて経理に回す。毎月繰り返している個人事業主や中小事業主は多いはずです。",[340,7396,7397],{"id":7397},"複数ファイルで届いた契約書の統合",[11,7399,7400],{},"「表紙」「本文」「別紙」「押印欄」が別々の PDF で届くケースは少なくありません。署名前に 1 本にまとめておくと、先方への送付もアーカイブもシンプルになります。",[340,7402,7404],{"id":7403},"スキャン-pdf-添付資料の一体化","スキャン PDF + 添付資料の一体化",[11,7406,7407],{},"紙の書類をスキャンした PDF に、別で作った Excel\u002FWord の PDF 出力を結合して提出するパターン。士業や官公庁関連の手続きで頻出します。",[23,7409,7411],{"id":7410},"無料-pdf-結合ツールの選び方-4-つの判断基準","無料 PDF 結合ツールの選び方 — 4 つの判断基準",[340,7413,7415],{"id":7414},"_1-ファイルがサーバーに送られないか","1. ファイルがサーバーに送られないか",[11,7417,7418,7419,7422],{},"オンラインで使える PDF 結合ツールの多くは、ファイルを一度サーバーへアップロードしてから処理します。ほとんどのサービスは処理後にサーバー上のファイルを消すと明言していますが、",[33,7420,7421],{},"NDA 下の契約書や顧客情報を含む PDF を外部に送ること自体が問題","になる場面があります。",[11,7424,7425,7426,7429,7430,7228],{},"判定は DevTools の Network タブで簡単にできます。",[17,7427,7428],{"href":3255},"Zerosend の PDF 結合"," はブラウザ内で完結するため、ここで",[33,7431,7432],{},"通信ゼロ",[340,7434,7436],{"id":7435},"_2-結合順の制御","2. 結合順の制御",[11,7438,7439],{},"ドラッグ&ドロップで並び替えができるか、ファイル名の自動ソートしか受け付けないかは大きな差。実務では並び替えが必要になるシーンが多いはずです。",[340,7441,7443],{"id":7442},"_3-パスワード付き-pdf-に対応するか","3. パスワード付き PDF に対応するか",[11,7445,7446],{},"社内で暗号化された PDF は、結合する前に一度ロック解除が必要です。現状の Zerosend は非対応なので、先に Acrobat 等で解除してから結合してください。",[340,7448,7450],{"id":7449},"_4-ファイルサイズ枚数の上限","4. ファイルサイズ・枚数の上限",[11,7452,7453,7454,7457],{},"大きな PDF 数十枚の結合はメモリを使います。ブラウザ内処理ツールは",[33,7455,7456],{},"数百 MB 級で動作が不安定","になることがあるので、サイズ上限と処理速度を事前に確認してください。Zerosend は 1 ファイル 100 MB までを推奨しています。",[23,7459,7461],{"id":7460},"zerosend-でアップロードせずに結合する手順","Zerosend でアップロードせずに結合する手順",[105,7463,7464,7468,7471,7478,7481],{},[30,7465,7466,6266],{},[17,7467,3255],{"href":3255},[30,7469,7470],{},"結合したい PDF を複数ドラッグ&ドロップ",[30,7472,7473,7474,7477],{},"リストを",[33,7475,7476],{},"ドラッグで並び替え","て希望の順序に",[30,7479,7480],{},"「結合する」ボタン",[30,7482,7483],{},"結合後の PDF を即ダウンロード",[11,7485,7486],{},"全工程がブラウザ内で実行されるため、処理中に外部通信は発生しません。",[340,7488,7490],{"id":7489},"ダウンロード前に-network-タブで検証する","ダウンロード前に Network タブで検証する",[11,7492,7493,7494,7497],{},"DevTools → Network タブを開いた状態で結合を実行すると、",[33,7495,7496],{},"PDF の中身が通信ペイロードに乗っていない"," ことが目視できます。この検証可能性が Zerosend の強みです。",[23,7499,7500],{"id":7500},"よくあるトラブルと対処",[340,7502,7503],{"id":7503},"結合順が希望通りにならない",[11,7505,7506,7507,1890,7510,1890,7513,7516,7517,7520],{},"並び替えの基準はツールごとに違い、",[33,7508,7509],{},"追加順",[33,7511,7512],{},"文字列順",[33,7514,7515],{},"更新日時順","のどれを採用するかで結果が変わります。事故の 8 割は文字列順 (",[56,7518,7519],{},"1, 10, 11, 2, 20, 3",") によるものです。",[27,7522,7523,7537,7551],{},[30,7524,7525,7526,7529,7530,6344,7533,7536],{},"ファイル名が ",[56,7527,7528],{},"1, 2, 10, 11, 2-2"," のように桁数が違うと、文字列ソートで 1 → 10 → 11 → 2 の順になります。",[33,7531,7532],{},"ゼロパディング",[56,7534,7535],{},"01, 02, 10, 11",") で解決します",[30,7538,7539,7542,7543,7546,7547,7550],{},[33,7540,7541],{},"日本語ファイル名 + 数字","も罠が多い。",[56,7544,7545],{},"請求書1.pdf, 請求書10.pdf, 請求書2.pdf"," は文字列順では ",[56,7548,7549],{},"請求書1 → 請求書10 → 請求書2"," になります。半角と全角の数字が混ざるとさらに狂います",[30,7552,7553],{},"Zerosend ではリストをドラッグして明示的に並び替えるのが確実です",[7555,7556,7557],"h4",{"id":7557},"並び順事故を防ぐ運用ルール",[11,7559,7560],{},"実務でハマらないための定石は次の通りです。",[27,7562,7563,7572,7585,7591,7601],{},[30,7564,7565,2577,7568,7571],{},[33,7566,7567],{},"契約書 (表紙 + 本文 + 押印)",[56,7569,7570],{},"01_表紙.pdf, 02_本文.pdf, 03_押印欄.pdf"," のようにゼロ埋め連番を頭に付ける",[30,7573,7574,2577,7577,7580,7581,7584],{},[33,7575,7576],{},"請求書の月次結合",[56,7578,7579],{},"2026-04-01_ClientA.pdf, 2026-04-05_ClientB.pdf"," のように ",[33,7582,7583],{},"YYYY-MM-DD を先頭","に置く。文字列ソートが自然に日付順になる",[30,7586,7587,7590],{},[33,7588,7589],{},"桁数の先読み",": 10〜99 件なら 2 桁、100 以上なら 3 桁でゼロパディング",[30,7592,7593,7596,7597,7600],{},[33,7594,7595],{},"月末 50 件のような大量結合",": 本番投入の前に",[33,7598,7599],{},"3 ファイル程度でテスト結合","して並び順仮説を検証する",[30,7602,7603,7606,7607,7610],{},[33,7604,7605],{},"ページ単位で並べ替えたい場合",": 結合前に ",[17,7608,7609],{"href":3440},"PDF ページ編集ツール"," で各 PDF のページ順を整えておく。結合ツール側で頑張るより事故が起きにくい",[340,7612,7614],{"id":7613},"パスワード付き-pdf-が開けない","パスワード付き PDF が開けない",[11,7616,7617],{},"先にロック解除してから Zerosend に持ち込むか、デスクトップアプリを併用してください。パスワード対応は今後の検討事項です。",[340,7619,7620],{"id":7620},"結合後のファイルサイズが大きい",[11,7622,7623,7624,7627],{},"結合すると中身がそのまま積み重なるため、元の合計より少し大きくなります。メール添付できないサイズになったら、",[17,7625,7626],{"href":3248},"PDF 圧縮ツール"," で後処理します。",[340,7629,7630],{"id":7630},"文字化け",[11,7632,7633],{},"フォントが埋め込まれていない PDF は、結合後に一部フォントが別物になって文字化けすることがあります。フォント埋め込みで出力し直すのが確実です。",[23,7635,7637],{"id":7636},"b2b-業務での運用ルール-3-選","B2B 業務での運用ルール 3 選",[340,7639,7641],{"id":7640},"_1-顧客情報を含む-pdf-はどこで処理するか明文化","1. 顧客情報を含む PDF はどこで処理するか明文化",[11,7643,7644],{},"「個人情報を含む PDF は外部 SaaS にアップロードしない」と社内ルールで決めている企業は増えています。ブラウザ内処理ツールに切り替えるだけで、このルールに抵触しにくくなります。",[340,7646,7648],{"id":7647},"_2-共有フォルダに結合後を置く元ファイルは削除","2. 共有フォルダに結合後を置く、元ファイルは削除",[11,7650,7651],{},"結合後に元の分割ファイルが残っていると、どちらが「最新版」か分からなくなります。チームで扱う場合は、結合後を共有し元は個人のアーカイブに退避するのがおすすめです。",[340,7653,7655],{"id":7654},"_3-監査ログを要求される環境での選択","3. 監査ログを要求される環境での選択",[11,7657,7658,7659,7662,7663,7666],{},"監査・法務から「誰が・いつ・どの SaaS で処理したか」のログを求められる場合、クラウドサービスより",[33,7660,7661],{},"ローカル完結型","のほうがログの出所が明確です。DevTools で通信が発生していないことを",[33,7664,7665],{},"自分で確認した記録","は、第三者監査に対しても説明が付きやすくなります。",[23,7668,7670],{"id":7669},"スクリプトで自動化する場合-開発者向け","スクリプトで自動化する場合 (開発者向け)",[11,7672,7673,7674,7676,7677,7680],{},"毎月の定型結合を自動化したいなら、Node.js の ",[56,7675,3167],{}," で順序を",[33,7678,7679],{},"コードで明示","するのが堅い方法です。",[764,7682,7686],{"className":7683,"code":7684,"language":7685,"meta":236,"style":236},"language-typescript shiki shiki-themes github-light github-dark","import { PDFDocument } from 'pdf-lib'\nimport { readFileSync, writeFileSync } from 'node:fs'\n\nconst files = ['01.pdf', '02.pdf', '03.pdf']  \u002F\u002F 明示的に順序指定\nconst out = await PDFDocument.create()\nfor (const f of files) {\n  const src = await PDFDocument.load(readFileSync(f))\n  const pages = await out.copyPages(src, src.getPageIndices())\n  for (const p of pages) out.addPage(p)\n}\nwriteFileSync('merged.pdf', await out.save())\n","typescript",[56,7687,7688,7703,7715,7720,7754,7775,7793,7818,7844,7867,7871],{"__ignoreMap":236},[772,7689,7690,7694,7697,7700],{"class":774,"line":775},[772,7691,7693],{"class":7692},"szBVR","import",[772,7695,7696],{"class":778}," { PDFDocument } ",[772,7698,7699],{"class":7692},"from",[772,7701,7702],{"class":804}," 'pdf-lib'\n",[772,7704,7705,7707,7710,7712],{"class":774,"line":237},[772,7706,7693],{"class":7692},[772,7708,7709],{"class":778}," { readFileSync, writeFileSync } ",[772,7711,7699],{"class":7692},[772,7713,7714],{"class":804}," 'node:fs'\n",[772,7716,7717],{"class":774,"line":418},[772,7718,7719],{"emptyLinePlaceholder":254},"\n",[772,7721,7722,7725,7728,7731,7734,7737,7739,7742,7744,7747,7750],{"class":774,"line":843},[772,7723,7724],{"class":7692},"const",[772,7726,7727],{"class":5892}," files",[772,7729,7730],{"class":7692}," =",[772,7732,7733],{"class":778}," [",[772,7735,7736],{"class":804},"'01.pdf'",[772,7738,1684],{"class":778},[772,7740,7741],{"class":804},"'02.pdf'",[772,7743,1684],{"class":778},[772,7745,7746],{"class":804},"'03.pdf'",[772,7748,7749],{"class":778},"]  ",[772,7751,7753],{"class":7752},"sJ8bj","\u002F\u002F 明示的に順序指定\n",[772,7755,7756,7758,7761,7763,7766,7769,7772],{"class":774,"line":5797},[772,7757,7724],{"class":7692},[772,7759,7760],{"class":5892}," out",[772,7762,7730],{"class":7692},[772,7764,7765],{"class":7692}," await",[772,7767,7768],{"class":778}," PDFDocument.",[772,7770,7771],{"class":797},"create",[772,7773,7774],{"class":778},"()\n",[772,7776,7777,7780,7782,7784,7787,7790],{"class":774,"line":5803},[772,7778,7779],{"class":7692},"for",[772,7781,6344],{"class":778},[772,7783,7724],{"class":7692},[772,7785,7786],{"class":5892}," f",[772,7788,7789],{"class":7692}," of",[772,7791,7792],{"class":778}," files) {\n",[772,7794,7795,7798,7800,7802,7804,7806,7809,7812,7815],{"class":774,"line":5813},[772,7796,7797],{"class":7692},"  const",[772,7799,825],{"class":5892},[772,7801,7730],{"class":7692},[772,7803,7765],{"class":7692},[772,7805,7768],{"class":778},[772,7807,7808],{"class":797},"load",[772,7810,7811],{"class":778},"(",[772,7813,7814],{"class":797},"readFileSync",[772,7816,7817],{"class":778},"(f))\n",[772,7819,7820,7822,7825,7827,7829,7832,7835,7838,7841],{"class":774,"line":5832},[772,7821,7797],{"class":7692},[772,7823,7824],{"class":5892}," pages",[772,7826,7730],{"class":7692},[772,7828,7765],{"class":7692},[772,7830,7831],{"class":778}," out.",[772,7833,7834],{"class":797},"copyPages",[772,7836,7837],{"class":778},"(src, src.",[772,7839,7840],{"class":797},"getPageIndices",[772,7842,7843],{"class":778},"())\n",[772,7845,7846,7849,7851,7853,7856,7858,7861,7864],{"class":774,"line":6008},[772,7847,7848],{"class":7692},"  for",[772,7850,6344],{"class":778},[772,7852,7724],{"class":7692},[772,7854,7855],{"class":5892}," p",[772,7857,7789],{"class":7692},[772,7859,7860],{"class":778}," pages) out.",[772,7862,7863],{"class":797},"addPage",[772,7865,7866],{"class":778},"(p)\n",[772,7868,7869],{"class":774,"line":6021},[772,7870,6035],{"class":778},[772,7872,7873,7876,7878,7881,7883,7886,7888,7891],{"class":774,"line":6032},[772,7874,7875],{"class":797},"writeFileSync",[772,7877,7811],{"class":778},[772,7879,7880],{"class":804},"'merged.pdf'",[772,7882,1684],{"class":778},[772,7884,7885],{"class":7692},"await",[772,7887,7831],{"class":778},[772,7889,7890],{"class":797},"save",[772,7892,7843],{"class":778},[11,7894,7895,7896,7899],{},"ファイル一覧をコードで持つため、ファイル名のソート順に依存せず",[33,7897,7898],{},"意図した順序が必ず保たれる","のが強みです。",[23,7901,7903],{"id":7902},"pdf-結合ツールの-3-類型とプライバシー観点での選び方","PDF 結合ツールの 3 類型とプライバシー観点での選び方",[340,7905,6219],{"id":6218},[11,7907,7908],{},"機能が豊富で UI が洗練されている傾向。ただしファイルはサーバーに送られるため、機密書類には不向き。",[340,7910,7911],{"id":7911},"デスクトップアプリ型",[11,7913,7914],{},"Acrobat 等の本格アプリや、OSS のユーティリティ。インストールと設定が必要だが、ローカル完結でセキュアに処理できます。",[340,7916,6232],{"id":6232},[11,7918,7919,7920,7923],{},"Zerosend のような",[33,7921,7922],{},"インストール不要でローカル完結","なタイプ。PC を変えても使える気軽さと、送信しない安心感を両立しています。",[11,7925,7926],{},"業務要件の機密度・操作感の好み・頻度によって使い分けるのが実務的です。",[23,7928,1187],{"id":1187},[11,7930,7931,7932,7935,7936,94],{},"PDF 結合はシンプルな作業ですが、扱う情報の性質を考えると",[33,7933,7934],{},"ツール選びは慎重に","なるべき場面です。Zerosend の PDF 結合はブラウザ内で完結し、DevTools で自ら検証できる透明性があります。",[17,7937,6653],{"href":3255},[11,7939,5585,7940],{},[17,7941,7942],{"href":5592},"プライバシー重視のオンラインツール",[875,7944,7945],{},"html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":236,"searchDepth":237,"depth":237,"links":7947},[7948,7953,7959,7962,7968,7973,7974,7979],{"id":7387,"depth":237,"text":7388,"children":7949},[7950,7951,7952],{"id":7391,"depth":418,"text":7391},{"id":7397,"depth":418,"text":7397},{"id":7403,"depth":418,"text":7404},{"id":7410,"depth":237,"text":7411,"children":7954},[7955,7956,7957,7958],{"id":7414,"depth":418,"text":7415},{"id":7435,"depth":418,"text":7436},{"id":7442,"depth":418,"text":7443},{"id":7449,"depth":418,"text":7450},{"id":7460,"depth":237,"text":7461,"children":7960},[7961],{"id":7489,"depth":418,"text":7490},{"id":7500,"depth":237,"text":7500,"children":7963},[7964,7965,7966,7967],{"id":7503,"depth":418,"text":7503},{"id":7613,"depth":418,"text":7614},{"id":7620,"depth":418,"text":7620},{"id":7630,"depth":418,"text":7630},{"id":7636,"depth":237,"text":7637,"children":7969},[7970,7971,7972],{"id":7640,"depth":418,"text":7641},{"id":7647,"depth":418,"text":7648},{"id":7654,"depth":418,"text":7655},{"id":7669,"depth":237,"text":7670},{"id":7902,"depth":237,"text":7903,"children":7975},[7976,7977,7978],{"id":6218,"depth":418,"text":6219},{"id":7911,"depth":418,"text":7911},{"id":6232,"depth":418,"text":6232},{"id":1187,"depth":237,"text":1187},"複数の PDF を結合したい、でも契約書や請求書を SaaS に預けたくない事業主へ。Zerosend ならブラウザ内で完結します。無料ツールの選び方、順番トラブルの対処、B2B 運用ルールまで解説します。",{},"\u002Fblog\u002Fpdf-merge-guide",{"title":7375,"description":7980},"pdf-merge-guide","blog\u002Fpdf-merge-guide",[3280,428,429],"6RlWZV8XiJYxdhjlLU9LDr-gRKynMSe66uD6bjeacAQ",{"id":7989,"title":7990,"author":6,"body":7991,"category":8367,"coverImage":248,"description":8368,"draft":250,"extension":251,"locale":252,"meta":8369,"navigation":254,"noindex":250,"path":8370,"publishedAt":5628,"seo":8371,"slug":8372,"stem":8373,"tags":8374,"updatedAt":5628,"__hash__":8376},"blog\u002Fblog\u002Fprivacy-tools-comparison.md","アップロード不要なファイル処理ツールの選び方 2026 — 3 類型の使い分け",{"type":8,"value":7992,"toc":8345},[7993,7996,8000,8004,8011,8015,8022,8026,8030,8033,8053,8057,8060,8077,8081,8088,8105,8109,8220,8223,8227,8233,8237,8243,8247,8253,8257,8267,8269,8275,8278,8304,8308,8311,8329,8331,8337],[11,7994,7995],{},"ファイルをサーバーに預けずに処理する選択肢は、ここ数年で現実的になりました。本記事では「どの方式を、どんな時に選べばいいか」を 3 類型で整理します。",[23,7997,7999],{"id":7998},"なぜアップロードしないが業務の要件になるのか","なぜ「アップロードしない」が業務の要件になるのか",[340,8001,8003],{"id":8002},"_2025-年以降のデータ保護要件-個人情報保護法改正","2025 年以降のデータ保護要件 (個人情報保護法改正)",[11,8005,8006,8007,8010],{},"日本の個人情報保護法改正で、個人情報を取り扱う事業者の説明責任が強まりました。",[33,8008,8009],{},"顧客の個人情報が含まれるファイルを外部 SaaS にアップロードする","際、少なくとも利用規約・プライバシーポリシーの確認と社内ルールでの合意が求められるケースが増えています。",[340,8012,8014],{"id":8013},"nda-案件受託案件医療-士業での制約","NDA 案件・受託案件・医療 \u002F 士業での制約",[11,8016,8017,8018,8021],{},"受託案件の成果物・医療機関の診療データ・士業が扱う顧客情報は、そもそも",[33,8019,8020],{},"外部にアップロードしてはいけない契約","になっていることが多いです。この場合、ブラウザ内完結型またはローカルアプリ型しか選択肢がありません。",[23,8023,8025],{"id":8024},"ファイル処理ツールの-3-類型","ファイル処理ツールの 3 類型",[340,8027,8029],{"id":8028},"類型-a-アップロード型オンライン-saas","類型 A: アップロード型オンライン SaaS",[11,8031,8032],{},"ブラウザでアクセスしてファイルをアップロード、サーバー側で処理、結果をダウンロードする方式。",[27,8034,8035,8041,8047],{},[30,8036,8037,8040],{},[33,8038,8039],{},"強み",": 機能が豊富。UI が洗練されている。どの端末からでも同じ体験。",[30,8042,8043,8046],{},[33,8044,8045],{},"弱み",": 機密ファイルには使えない。通信遅延あり。",[30,8048,8049,8052],{},[33,8050,8051],{},"適する場面",": 公開済みの画像、共有して良いドキュメントの軽作業。",[340,8054,8056],{"id":8055},"類型-b-デスクトップアプリ","類型 B: デスクトップアプリ",[11,8058,8059],{},"PC にインストールして使うツール。商用アプリも OSS も含みます。",[27,8061,8062,8067,8072],{},[30,8063,8064,8066],{},[33,8065,8039],{},": ローカル完結で速い。機能が深い。複雑な処理に強い。",[30,8068,8069,8071],{},[33,8070,8045],{},": インストールと設定が必要。PC が変わると毎回セットアップ。",[30,8073,8074,8076],{},[33,8075,8051],{},": 日常的にヘビーユースする制作者・業務者。",[340,8078,8080],{"id":8079},"類型-c-ブラウザ内完結型-zerosend-が採用","類型 C: ブラウザ内完結型 (Zerosend が採用)",[11,8082,8083,8084,8087],{},"ブラウザでアクセスするが、ファイルはサーバーに送らず",[33,8085,8086],{},"ブラウザ内 JavaScript \u002F WebAssembly で処理","する方式。",[27,8089,8090,8095,8100],{},[30,8091,8092,8094],{},[33,8093,8039],{},": インストール不要。ローカル完結で送信ゼロ。すぐ使える。",[30,8096,8097,8099],{},[33,8098,8045],{},": 数 GB 級のファイルは苦手 (メモリ上限)。機能はアプリ型より浅い場合がある。",[30,8101,8102,8104],{},[33,8103,8051],{},": 機密ファイルを含む日常的な作業、受託案件、士業・医療の業務補助。",[23,8106,8108],{"id":8107},"類型別の強み弱み比較","類型別の強み・弱み比較",[920,8110,8111,8127],{},[923,8112,8113],{},[926,8114,8115,8118,8121,8124],{},[929,8116,8117],{},"観点",[929,8119,8120],{},"類型 A (SaaS)",[929,8122,8123],{},"類型 B (アプリ)",[929,8125,8126],{},"類型 C (ブラウザ内)",[936,8128,8129,8142,8155,8168,8182,8196,8209],{},[926,8130,8131,8134,8137,8140],{},[941,8132,8133],{},"インストール",[941,8135,8136],{},"不要",[941,8138,8139],{},"必要",[941,8141,8136],{},[926,8143,8144,8147,8150,8153],{},[941,8145,8146],{},"ネットワーク送信",[941,8148,8149],{},"あり (本体)",[941,8151,8152],{},"なし",[941,8154,8152],{},[926,8156,8157,8160,8163,8166],{},[941,8158,8159],{},"複数端末利用",[941,8161,8162],{},"容易",[941,8164,8165],{},"端末ごと設定",[941,8167,8162],{},[926,8169,8170,8173,8176,8179],{},[941,8171,8172],{},"速度",[941,8174,8175],{},"通信待ちあり",[941,8177,8178],{},"最速",[941,8180,8181],{},"端末性能次第",[926,8183,8184,8187,8190,8193],{},[941,8185,8186],{},"機能の深さ",[941,8188,8189],{},"深い",[941,8191,8192],{},"最も深い",[941,8194,8195],{},"中",[926,8197,8198,8201,8204,8207],{},[941,8199,8200],{},"機密データ適性",[941,8202,8203],{},"低",[941,8205,8206],{},"高",[941,8208,8206],{},[926,8210,8211,8214,8216,8218],{},[941,8212,8213],{},"大容量対応",[941,8215,8206],{},[941,8217,8206],{},[941,8219,8195],{},[23,8221,8222],{"id":8222},"カテゴリ別の選び方",[340,8224,8226],{"id":8225},"画像-圧縮-形式変換","画像 (圧縮 \u002F 形式変換)",[11,8228,8229,8230],{},"日常的な画像圧縮・リサイズ・形式変換はブラウザ内完結型で十分です。Photoshop 級の高度なレタッチはデスクトップアプリ型に軍配。 → ",[17,8231,8232],{"href":2181},"Zerosend 画像圧縮",[340,8234,8236],{"id":8235},"pdf-結合-分割-圧縮","PDF (結合 \u002F 分割 \u002F 圧縮)",[11,8238,8239,8240],{},"結合・分割・圧縮などの一般的な処理はブラウザ内完結型が機密データと両立しやすくおすすめです。高度な編集 (埋め込みフォント差し替えなど) はアプリ型が適しています。 → ",[17,8241,8242],{"href":3255},"Zerosend PDF 結合",[340,8244,8246],{"id":8245},"動画-音声","動画 \u002F 音声",[11,8248,8249,8250],{},"短い動画の圧縮・形式変換・トリミングはブラウザ内完結型で実用範囲です。長尺動画 (30 分以上) や 4K 素材の編集はデスクトップアプリ型が現実的。 → ",[17,8251,8252],{"href":1756},"Zerosend 動画圧縮",[340,8254,8256],{"id":8255},"qr-コード","QR コード",[11,8258,8259,8260,8263,8264],{},"生成・読み取りどちらもブラウザ内完結型で十分です。QR コードに個人情報が乗るケースもあるため、",[33,8261,8262],{},"生成時に入力したテキストが送信されないこと","は重要な要件です。 → ",[17,8265,8266],{"href":19},"Zerosend QR 生成",[340,8268,6454],{"id":6454},[11,8270,8271,8272],{},"1 枚のロゴから一式を生成するタイプ。NDA 下の未公開ロゴ作成ではブラウザ内完結型が最適です。 → ",[17,8273,8274],{"href":232},"Zerosend ファビコン生成",[23,8276,8277],{"id":8277},"自分の要件で判定するフローチャート",[105,8279,8280,8286,8292,8298],{},[30,8281,8282,8285],{},[33,8283,8284],{},"機密度が高い"," (顧客情報 \u002F 未公開素材 \u002F 医療データ) → 類型 B or C",[30,8287,8288,8291],{},[33,8289,8290],{},"複数端末・出先でも使いたい"," → 類型 C",[30,8293,8294,8297],{},[33,8295,8296],{},"数 GB の動画 \u002F 複雑な編集"," → 類型 B",[30,8299,8300,8303],{},[33,8301,8302],{},"軽作業のみ + 公開済みデータ"," → 類型 A でも可",[23,8305,8307],{"id":8306},"アップロードしていないの検証方法","「アップロードしていない」の検証方法",[11,8309,8310],{},"ブラウザ内完結型と主張しているツールが本当に送っていないかは、30 秒で検証できます。",[105,8312,8313,8316,8319,8322],{},[30,8314,8315],{},"ブラウザの DevTools を開く (右クリック → 検証)",[30,8317,8318],{},"Network タブに切り替え、「Preserve log」を有効化",[30,8320,8321],{},"ツールを実際に使ってファイルを処理してみる",[30,8323,8324,8325,8328],{},"表示される通信が CDN・解析・広告程度で、",[33,8326,8327],{},"処理対象ファイルを含むリクエストがない","ことを確認",[23,8330,1187],{"id":1187},[11,8332,8333,8334,8336],{},"ファイル処理ツールは「送るか送らないか」で選ぶ時代です。業務の機密度・使用頻度・扱うファイルサイズで 3 類型を使い分けるのが実務的です。日常的な軽作業かつ機密度が高い範囲では、",[33,8335,6232],{}," (Zerosend など) が最もバランスの良い選択肢です。",[11,8338,5585,8339,1890,8342],{},[17,8340,8341],{"href":5592},"プライバシー重視のオンラインツール (ピラー)",[17,8343,8344],{"href":5627},"ブラウザ内でファイル処理はどこまでできるか",{"title":236,"searchDepth":237,"depth":237,"links":8346},[8347,8351,8356,8357,8364,8365,8366],{"id":7998,"depth":237,"text":7999,"children":8348},[8349,8350],{"id":8002,"depth":418,"text":8003},{"id":8013,"depth":418,"text":8014},{"id":8024,"depth":237,"text":8025,"children":8352},[8353,8354,8355],{"id":8028,"depth":418,"text":8029},{"id":8055,"depth":418,"text":8056},{"id":8079,"depth":418,"text":8080},{"id":8107,"depth":237,"text":8108},{"id":8222,"depth":237,"text":8222,"children":8358},[8359,8360,8361,8362,8363],{"id":8225,"depth":418,"text":8226},{"id":8235,"depth":418,"text":8236},{"id":8245,"depth":418,"text":8246},{"id":8255,"depth":418,"text":8256},{"id":6454,"depth":418,"text":6454},{"id":8277,"depth":237,"text":8277},{"id":8306,"depth":237,"text":8307},{"id":1187,"depth":237,"text":1187},"guide","ファイルをサーバーに預けずに処理したい時、どの方式を選ぶか。アップロード型・デスクトップ型・ブラウザ内完結型の 3 類型を、業務要件・UX・対応形式の観点で比較し、用途別の選び方を解説します。",{},"\u002Fblog\u002Fprivacy-tools-comparison",{"title":7990,"description":8368},"privacy-tools-comparison","blog\u002Fprivacy-tools-comparison",[429,8375],"比較","1u9MtR913FhIDCsCr-3EkjysE71wSOjGODw-WNT3_Yw",{"id":8378,"title":8379,"author":6,"body":8380,"category":248,"coverImage":248,"description":8448,"draft":250,"extension":251,"locale":252,"meta":8449,"navigation":254,"noindex":254,"path":8450,"publishedAt":5628,"seo":8451,"slug":8452,"stem":8453,"tags":8454,"updatedAt":5628,"__hash__":8456},"blog\u002Fblog\u002Fwelcome.md","Zerosend ブログを始めます",{"type":8,"value":8381,"toc":8442},[8382,8385,8388,8391,8394,8414,8417,8433,8435],[23,8383,8384],{"id":8384},"はじめに",[11,8386,8387],{},"Zerosend の公式ブログを開始します。このブログでは、プライバシーファーストな Web ツールを作る中で得た知見、ブラウザ内処理の技術、そしてデータを「送らない」という選択についての考察を記録していきます。",[23,8389,8390],{"id":8390},"扱うテーマ",[11,8392,8393],{},"主に次のテーマを扱います。",[27,8395,8396,8402,8408],{},[30,8397,8398,8401],{},[33,8399,8400],{},"ブラウザ内処理の技術",": WebAssembly、Web Worker、Canvas API、File System Access API の実用例",[30,8403,8404,8407],{},[33,8405,8406],{},"プライバシー設計",": CSP、アップロード不要のアーキテクチャ、Network タブで検証できる実装",[30,8409,8410,8413],{},[33,8411,8412],{},"各ツールの舞台裏",": 画像圧縮 \u002F PDF 編集 \u002F 動画変換 \u002F ファビコン生成などの内部実装",[23,8415,8416],{"id":8416},"更新頻度",[11,8418,8419,8420,8423,8424,1890,8428,8432],{},"不定期ですが、ツールの追加・改善に合わせて更新します。記事の一覧は ",[17,8421,8422],{"href":8422},"\u002Fblog"," から、または ",[17,8425,8427],{"href":8426},"\u002Fblog\u002Ffeed.xml","RSS",[17,8429,8431],{"href":8430},"\u002Fblog\u002Ffeed.json","JSON Feed"," で購読できます。",[23,8434,1187],{"id":1187},[11,8436,8437,8438,8441],{},"まずはこの 1 本から。引き続き ",[17,8439,8440],{"href":6291},"Zerosend"," のツール群もよろしくお願いします。",{"title":236,"searchDepth":237,"depth":237,"links":8443},[8444,8445,8446,8447],{"id":8384,"depth":237,"text":8384},{"id":8390,"depth":237,"text":8390},{"id":8416,"depth":237,"text":8416},{"id":1187,"depth":237,"text":1187},"ブラウザ内で完結するプライバシーファーストなオンラインツールを配信する Zerosend の公式ブログを開始します。扱うテーマと更新頻度について説明します。",{},"\u002Fblog\u002Fwelcome",{"title":8379,"description":8448},"welcome","blog\u002Fwelcome",[8455],"お知らせ","qWeGVg9xXJwmBE_vTgt8kwzVFyh4hc5kXl0dsfTAuew",{"id":8458,"title":5589,"author":6,"body":8459,"category":248,"coverImage":248,"description":8688,"draft":250,"extension":251,"locale":252,"meta":8689,"navigation":254,"noindex":250,"path":5588,"publishedAt":5628,"seo":8690,"slug":8691,"stem":8692,"tags":8693,"updatedAt":5628,"__hash__":8695},"blog\u002Fblog\u002Fwhy-browser-only.md",{"type":8,"value":8460,"toc":8678},[8461,8465,8468,8475,8478,8481,8507,8510,8513,8516,8543,8546,8550,8553,8580,8587,8590,8593,8613,8616,8618,8624,8630,8636,8638,8644,8646,8649,8671],[23,8462,8464],{"id":8463},"なぜ送らないのか","なぜ「送らない」のか",[11,8466,8467],{},"オンラインツールの多くはファイルをサーバーに送信して処理します。利便性は高いものの、ユーザーは自分のファイルがサーバー上でどう扱われるかを自分の目で確認できません。",[11,8469,8470,8471,8474],{},"Zerosend の設計原則はシンプルです。",[33,8472,8473],{},"「送らないのが一番確実」","。ファイルを外に出さなければ、ログも、漏洩も、第三者共有も原理的に存在しません。",[23,8476,8477],{"id":8477},"アップロード型ツールのリスク",[11,8479,8480],{},"「処理後に即削除」と書かれているツールを見かけますが、これを利用者側から検証する手段はほぼありません。サービス側のサーバーに一時的にでもファイルが到達する以上、次のようなリスクが残ります。",[27,8482,8483,8489,8495,8501],{},[30,8484,8485,8488],{},[33,8486,8487],{},"ログへの記録",": アクセスログにファイル名やメタデータが残る",[30,8490,8491,8494],{},[33,8492,8493],{},"従業員によるアクセス",": 内部ポリシーによってはサポート担当者などが参照できる",[30,8496,8497,8500],{},[33,8498,8499],{},"セキュリティインシデント",": サーバーが侵害された場合、処理待ちや一時保存中のファイルが漏洩する",[30,8502,8503,8506],{},[33,8504,8505],{},"利用規約の抜け穴",": AI 学習や品質改善目的での利用を広く許可していても、ユーザーは気付きにくい",[11,8508,8509],{},"業務文書・医療情報・個人の写真など、機密性の高いファイルを扱う場面では、この問題が深刻です。",[23,8511,8512],{"id":8512},"ブラウザ内処理で何ができるか",[11,8514,8515],{},"現代のブラウザは、かつてネイティブアプリが担っていた処理の多くを実行できます。",[27,8517,8518,8521,8524,8531],{},[30,8519,8520],{},"Canvas API による画像圧縮・リサイズ・形式変換",[30,8522,8523],{},"WebAssembly + ffmpeg による動画・音声の変換",[30,8525,8526,1890,8528,8530],{},[56,8527,3167],{},[56,8529,3346],{}," による PDF の結合・分割・ラスタライズ",[30,8532,8533,1890,8536,1890,8539,8542],{},[56,8534,8535],{},"File System Access API",[56,8537,8538],{},"Blob",[56,8540,8541],{},"URL.createObjectURL"," を介したダウンロード",[11,8544,8545],{},"これらは全てクライアントサイドで完結します。インストール不要でブラウザを開くだけで使えるため、作業環境を選びません。",[23,8547,8549],{"id":8548},"devtools-で自分の目で確認する方法","DevTools で自分の目で確認する方法",[11,8551,8552],{},"「送っていません」という主張は、ユーザーが自分で確認できなければ信用するしかありません。Zerosend はブラウザ標準の DevTools で検証できる形にしています。",[105,8554,8555,8561,8566,8572,8577],{},[30,8556,8557,8560],{},[33,8558,8559],{},"F12 キーを押す"," (Mac は Cmd+Option+I) — DevTools が開く",[30,8562,8563],{},[33,8564,8565],{},"「Network」タブを選ぶ",[30,8567,8568,8571],{},[33,8569,8570],{},"「Fetch\u002FXHR」フィルターをオンにする"," — API 通信だけを絞り込む",[30,8573,8574],{},[33,8575,8576],{},"ツールにファイルをドロップして処理する",[30,8578,8579],{},"リストに表示される通信を確認。処理中に外部へのリクエストが起きないことを目視できる",[11,8581,8582,8583,8586],{},"CDN や解析スクリプトへの最小限の通信は残りますが、",[33,8584,8585],{},"処理対象のファイル自体が HTTP リクエストのボディに乗らない","ことは目視で確認できます。",[23,8588,8589],{"id":8589},"制約もある",[11,8591,8592],{},"ブラウザ内処理は万能ではありません。",[27,8594,8595,8601,8607],{},[30,8596,8597,8600],{},[33,8598,8599],{},"ファイルサイズの上限",": メモリに載る範囲で処理する必要がある",[30,8602,8603,8606],{},[33,8604,8605],{},"初回ロードが重い",": ffmpeg.wasm は約 30MB の WASM を取得する",[30,8608,8609,8612],{},[33,8610,8611],{},"複雑な処理はサーバーが速い",": 大規模な機械学習推論はまだブラウザには重い",[11,8614,8615],{},"Zerosend は「日常的な軽作業をブラウザで完結させる」範囲に絞ることで、この制約の中で価値を出しています。",[23,8617,180],{"id":180},[11,8619,8620,8623],{},[33,8621,8622],{},"Q. ブラウザ内処理でも履歴は残りますか？","\nA. ファイルデータはサーバーに送られません。ブラウザの閲覧履歴にはアクセスしたページの URL が残りますが、どの Web サービスでも同様です。ファイルの内容はブラウザのメモリ上で処理され、ページを閉じれば消えます。",[11,8625,8626,8629],{},[33,8627,8628],{},"Q. オフラインでも使えますか？","\nA. 画像系ツールはページ読み込み後ならオフラインでも動作します。ffmpeg.wasm を使う動画・音声系ツールは初回の WASM 取得にネットワークが必要ですが、取得後はオフラインで処理できます。",[11,8631,8632,8635],{},[33,8633,8634],{},"Q. スマートフォンでも動きますか？","\nA. Safari (iOS) \u002F Chrome (Android) の最新版で動作します。大きなファイルはスマートフォンのメモリ制限に引っかかる場合があります。",[23,8637,1187],{"id":1187},[11,8639,8640,8641,8643],{},"「送らない」は、透明性と検証可能性をユーザーに返す設計です。詳しい技術背景は ",[17,8642,5593],{"href":5592}," も参照してください。",[23,8645,206],{"id":206},[11,8647,8648],{},"Zerosend では画像・動画・音声・PDF の処理をすべてブラウザ内で完結するツールを提供しています。",[27,8650,8651,8656,8661,8666],{},[30,8652,8653,8655],{},[17,8654,2182],{"href":2181}," — 写真や画像をサーバーに送らず軽量化",[30,8657,8658,8660],{},[17,8659,1750],{"href":1749}," — 会議録画や旅行動画を安全にカット",[30,8662,8663,8665],{},[17,8664,3256],{"href":3255}," — 機密文書を手元だけで結合",[30,8667,8668,8670],{},[17,8669,214],{"href":213}," — スキャン結果もローカル処理",[11,8672,8673,8674,8677],{},"全ツール一覧は ",[17,8675,8676],{"href":6291},"トップページ"," で確認できます。",{"title":236,"searchDepth":237,"depth":237,"links":8679},[8680,8681,8682,8683,8684,8685,8686,8687],{"id":8463,"depth":237,"text":8464},{"id":8477,"depth":237,"text":8477},{"id":8512,"depth":237,"text":8512},{"id":8548,"depth":237,"text":8549},{"id":8589,"depth":237,"text":8589},{"id":180,"depth":237,"text":180},{"id":1187,"depth":237,"text":1187},{"id":206,"depth":237,"text":206},"ファイルをサーバーにアップロードしない設計を選んだ理由と、ブラウザ内処理の利点・制約を整理します。DevTools の Network タブで自ら検証できる透明性について書きました。",{},{"title":5589,"description":8688},"why-browser-only","blog\u002Fwhy-browser-only",[429,8694],"設計","tlDh92SJcdqfwID_vZe6xWmz2EJFDwYIL0qkVDzZZvk",1778757803569]