[{"data":1,"prerenderedAt":2730},["ShallowReactive",2],{"blog-tag-ja-image":3},[4,220,515,724,944,1170,1387,1587,1796,2022,2294],{"id":5,"title":6,"author":7,"body":8,"category":201,"coverImage":202,"description":203,"draft":204,"extension":205,"locale":206,"meta":207,"navigation":208,"noindex":204,"path":209,"publishedAt":210,"seo":211,"slug":212,"stem":213,"tags":214,"updatedAt":210,"__hash__":219},"blog\u002Fblog\u002Fogp-image-size-optimization.md","OGP画像のサイズ最適化ガイド｜SNSでキレイに表示される設定と作り方","Zerosend Editorial",{"type":9,"value":10,"toc":193},"minimark",[11,16,20,28,36,39,43,46,51,67,72,83,88,96,101,106,113,116,118,122,125,130,133,138,141,146,157,162,165,167,171,178,181,184,191],[12,13,15],"h2",{"id":14},"ogp画像が崩れる切れる原因はサイズ指定にある","OGP画像が「崩れる」「切れる」原因はサイズ指定にある",[17,18,19],"p",{},"SNSでURLをシェアしたとき、サムネイル画像が途中で切れていたり、極端に小さく表示されたりした経験はないでしょうか。あるいは、自分のサイトをX（旧Twitter）やFacebookに投稿したら、想定と全く違う画像が表示された、というケースもよく聞かれます。",[17,21,22,23,27],{},"こうした問題の多くは、OGP（Open Graph Protocol）画像のサイズが各プラットフォームの仕様と合っていないことが原因です。OGPはHTMLのmetaタグで設定するもので、",[24,25,26],"code",{},"og:image","に指定した画像がSNSカードのサムネイルとして使われます。しかし、画像サイズや縦横比が規定から外れていると、プラットフォーム側でトリミングされたり、表示をスキップされたりします。",[17,29,30,31,35],{},"さらに見落とされがちなのが、",[32,33,34],"strong",{},"ファイルサイズ（容量）の上限","です。画像の縦横ピクセル数が正しくても、ファイルが重すぎるとSNSのクローラーが取得に失敗し、画像なしのカードとして表示されることがあります。OGP画像の最適化は「ピクセル寸法」と「ファイル容量」の両方を意識する必要があります。",[37,38],"hr",{},[12,40,42],{"id":41},"各snsプラットフォームの推奨サイズ一覧","各SNS・プラットフォームの推奨サイズ一覧",[17,44,45],{},"OGP画像の最適なサイズはプラットフォームによって異なります。主要サービスの推奨値をまとめました。",[17,47,48],{},[32,49,50],{},"X（旧Twitter）",[52,53,54,58,61,64],"ul",{},[55,56,57],"li",{},"Summaryカード（小さいサムネイル）：144×144px以上、縦横比1:1",[55,59,60],{},"Summary Card with Large Image（横長サムネイル）：300×157px以上、縦横比2:1",[55,62,63],{},"推奨サイズ：1200×628px",[55,65,66],{},"ファイルサイズ上限：5MB（JPG\u002FPNG\u002FWebP）",[17,68,69],{},[32,70,71],{},"Facebook \u002F Meta",[52,73,74,77,80],{},[55,75,76],{},"最小サイズ：200×200px",[55,78,79],{},"推奨サイズ：1200×630px（縦横比1.91:1）",[55,81,82],{},"推奨ファイルサイズ：1MB以下",[17,84,85],{},[32,86,87],{},"LinkedIn",[52,89,90,93],{},[55,91,92],{},"推奨サイズ：1200×627px",[55,94,95],{},"ファイルサイズ上限：5MB",[17,97,98],{},[32,99,100],{},"Slack \u002F チャットツール",[52,102,103],{},[55,104,105],{},"og:imageを取得してプレビュー表示。1200×630px前後が無難",[17,107,108,109,112],{},"これらを横断的に見ると、",[32,110,111],{},"1200×630px（または1200×628px）"," という解像度がほぼすべてのサービスに対応できる事実上の標準サイズです。縦横比は約1.91:1を維持しつつ、JPEG品質を80〜85程度に抑えてファイルサイズを300KB以内に収めると、どの環境でも安定して表示されます。",[17,114,115],{},"ただし、既存の画像を流用する場合や、デザイン素材が別のアスペクト比で作られている場合は、リサイズ作業が必要になります。",[37,117],{},[12,119,121],{"id":120},"実践ogp画像を正しいサイズにリサイズする手順","実践：OGP画像を正しいサイズにリサイズする手順",[17,123,124],{},"OGP画像のリサイズ自体は難しい作業ではありませんが、いくつか気をつけたいポイントがあります。",[17,126,127],{},[32,128,129],{},"① 元画像の縦横比を確認する",[17,131,132],{},"元画像が正方形（1:1）や縦長の場合、単純にリサイズすると1200×630pxに収まらず、余白が生じたり主要な被写体が切り取られたりします。リサイズ前に、画像をどこを中心にトリミングするかを先に決めておくと作業がスムーズです。",[17,134,135],{},[32,136,137],{},"② 出力形式はJPEGかWebPを選ぶ",[17,139,140],{},"OGP画像には透過（アルファチャンネル）が不要なケースがほとんどです。PNGは品質が高い反面ファイルが重くなりやすいため、JPEGかWebPで書き出すのが現実的です。SNSのクローラーはWebPにも対応していますが、古いクローラーを考慮してJPEGを第一候補にするのが無難です。",[17,142,143],{},[32,144,145],{},"③ ツールを選ぶ：Photoshopがなくても問題ない",[17,147,148,149,156],{},"プロ向けの画像編集ソフトがなくても、ブラウザだけで完結するツールが充実しています。その一つとして ",[150,151,155],"a",{"href":152,"rel":153},"https:\u002F\u002Fzerosend.site\u002Ftools\u002Fimage-resize",[154],"nofollow","画像リサイズツール"," があります。このツールの特徴は、アップロードした画像がサーバーに送信されない点です。画像データはブラウザ内だけで処理されるため、社内資料や未公開のバナー画像を扱う場合でも、情報漏洩リスクを気にせず使えます。縦横のピクセル数を数値で直接指定できるので、1200×630pxに合わせる作業が直感的に行えます。",[17,158,159],{},[32,160,161],{},"④ リサイズ後にOGPキャッシュをクリアする",[17,163,164],{},"画像を差し替えても、SNS側のキャッシュが残っていると古い画像が表示され続けます。Xであれば「Card Validator」、Facebookであれば「Sharing Debugger」を使ってキャッシュを強制更新してください。ツールにURLを入力して「スクレイプ」または「デバッグ」を実行するだけで、新しい画像が反映されます。",[37,166],{},[12,168,170],{"id":169},"ogp画像の最適化がseoにも影響する理由","OGP画像の最適化がSEOにも影響する理由",[17,172,173,174,177],{},"OGPはSNS表示のための仕様であり、Googleの検索順位に直接影響するわけではありません。しかし、",[32,175,176],{},"間接的にSEOへのプラス効果","が期待できます。",[17,179,180],{},"SNSでシェアされたときに魅力的なサムネイルが表示されれば、クリック率が上がり、リンクが拡散されやすくなります。これがサイトへの流入増加につながり、滞在時間や被リンク獲得に好影響を与えます。また、画像ファイルのサイズを適切に絞ることはページの読み込み速度改善に直結し、Googleが重視するCore Web Vitalsの指標（特にLCPやFID）にも貢献します。",[17,182,183],{},"OGP画像を「SNS用の飾り」として後回しにしがちですが、サイトのパフォーマンスとブランド品質を底上げする実務的な施策として捉えると、優先度が変わってくるはずです。",[17,185,186,187,190],{},"まず手元にあるキービジュアルやアイキャッチ画像を1200×630px・300KB以内に整えるところから始めてみてください。専用ソフトが不要な環境であれば、前述した ",[150,188,155],{"href":152,"rel":189},[154]," のようなブラウザベースのツールを活用すると、余計な手間をかけずに作業を完結できます。",[37,192],{},{"title":194,"searchDepth":195,"depth":195,"links":196},"",2,[197,198,199,200],{"id":14,"depth":195,"text":15},{"id":41,"depth":195,"text":42},{"id":120,"depth":195,"text":121},{"id":169,"depth":195,"text":170},"tech",null,"OGP画像の推奨サイズや各SNSの仕様を解説。Twitterやog:imageが正しく表示されない原因と、ブラウザだけで完結する無料ツールを使った具体的な対処法を紹介します。",false,"md","ja",{},true,"\u002Fblog\u002Fogp-image-size-optimization","2026-05-12",{"title":6,"description":203},"ogp-image-size-optimization","blog\u002Fogp-image-size-optimization",[215,216,217,218],"画像","リサイズ","Web制作","SEO","mIit_bdGiULblUiC2FeigxS7qW8uxuS9f-pKvrNhJKM",{"id":221,"title":222,"author":7,"body":223,"category":201,"coverImage":202,"description":504,"draft":204,"extension":205,"locale":206,"meta":505,"navigation":208,"noindex":204,"path":506,"publishedAt":507,"seo":508,"slug":509,"stem":510,"tags":511,"updatedAt":507,"__hash__":514},"blog\u002Fblog\u002Fcore-web-vitals-image-compress.md","Core Web Vitals を改善する画像圧縮の方法と実践ステップ",{"type":9,"value":224,"toc":498},[225,229,232,252,255,258,265,267,270,273,329,332,343,346,348,352,359,371,374,404,407,409,412,415,420,445,450,487,490,493,495],[12,226,228],{"id":227},"core-web-vitals-と画像の関係を正しく理解する","Core Web Vitals と画像の関係を正しく理解する",[17,230,231],{},"Googleが検索ランキングの評価指標として採用している「Core Web Vitals」は、大きく3つの指標で構成されています。",[52,233,234,240,246],{},[55,235,236,239],{},[32,237,238],{},"LCP（Largest Contentful Paint）","：ページ内の最も大きなコンテンツが表示されるまでの時間",[55,241,242,245],{},[32,243,244],{},"INP（Interaction to Next Paint）","：ユーザー操作に対する応答速度",[55,247,248,251],{},[32,249,250],{},"CLS（Cumulative Layout Shift）","：レイアウトのずれ具合",[17,253,254],{},"このうち、画像が直接影響するのは主にLCPです。ページを開いたときに最初に目に入る大きな画像（ヒーローイメージやメインビジュアルなど）がLCPの対象になることが多く、その画像ファイルが重いほど表示に時間がかかり、スコアが下がります。",[17,256,257],{},"Googleが定めるLCPの合格ラインは「2.5秒以内」。これを超えると「改善が必要」と判定され、検索順位にも悪影響が出る可能性があります。",[17,259,260,261,264],{},"ブログやコーポレートサイトを運営しているWeb担当者の方から「PageSpeed Insightsで低スコアが出たけど何をすればいいのかわからない」という声をよく聞きます。そのほとんどのケースで、",[32,262,263],{},"画像の最適化が最も効果的な改善策","になります。",[37,266],{},[12,268,269],{"id":269},"画像圧縮で改善できるスコアの目安",[17,271,272],{},"画像圧縮の効果は、元のファイルサイズによって大きく変わります。一般的な傾向として以下のような改善が見込めます。",[274,275,276,292],"table",{},[277,278,279],"thead",{},[280,281,282,286,289],"tr",{},[283,284,285],"th",{},"元のファイルサイズ",[283,287,288],{},"圧縮後の目安",[283,290,291],{},"LCPへの効果",[293,294,295,307,318],"tbody",{},[280,296,297,301,304],{},[298,299,300],"td",{},"3MB以上",[298,302,303],{},"300KB〜500KB程度",[298,305,306],{},"大きく改善",[280,308,309,312,315],{},[298,310,311],{},"1MB前後",[298,313,314],{},"100KB〜200KB程度",[298,316,317],{},"中程度改善",[280,319,320,323,326],{},[298,321,322],{},"500KB以下",[298,324,325],{},"50KB〜100KB程度",[298,327,328],{},"微改善〜維持",[17,330,331],{},"デジタルカメラやスマートフォンで撮影した画像は、何も処理しないと3〜8MB程度になることがよくあります。そのままWebサイトに掲載すると、モバイル回線のユーザーにとっては表示まで数秒かかることも珍しくありません。",[17,333,334,335,338,339,342],{},"また、画像圧縮はLCPだけでなくCLSにも間接的に効果があります。画像に",[24,336,337],{},"width","と",[24,340,341],{},"height","属性を設定したうえでファイルサイズを適切に管理すると、読み込み中のレイアウトずれを防ぎやすくなります。",[17,344,345],{},"PageSpeed Insightsで「適切なサイズの画像」「次世代フォーマットでの画像の配信」「効率的な画像エンコード」などの警告が出ている場合は、まず画像圧縮から取り組むのが王道です。",[37,347],{},[12,349,351],{"id":350},"実践ブラウザだけで完結する画像圧縮の手順","実践：ブラウザだけで完結する画像圧縮の手順",[17,353,354,355,358],{},"画像圧縮ツールは数多くありますが、業務で使う場合に気になるのが",[32,356,357],{},"ファイルのプライバシー","です。社内資料の画像や顧客の写真をアップロードする際、そのデータがサーバーに保存・収集されていないかどうかは確認しておきたいポイントです。",[17,360,361,366,367,370],{},[150,362,365],{"href":363,"rel":364},"https:\u002F\u002Fzerosend.site\u002Ftools\u002Fimage-compress",[154],"ZeroSend の画像圧縮ツール","は、ファイルをサーバーに送信せず、",[32,368,369],{},"ブラウザ内だけで処理を完結","させる設計になっています。アップロードした画像が外部に送信されることはないため、社内ルールが厳しい職場でも安心して使いやすいのが特徴です。",[17,372,373],{},"使い方はシンプルです。",[375,376,377,386,392,398],"ol",{},[55,378,379,382,385],{},[32,380,381],{},"ツールにアクセスする",[150,383,363],{"href":363,"rel":384},[154]," をブラウザで開きます。インストール不要です。",[55,387,388,391],{},[32,389,390],{},"画像ファイルを選択する","\nJPEG・PNG・WebPなど主要なフォーマットに対応しています。ドラッグ＆ドロップでも選択できます。",[55,393,394,397],{},[32,395,396],{},"圧縮品質を調整する","\nスライダーで圧縮率を調整できます。品質を下げすぎると画像が荒くなるため、まずは「品質70〜80%」を目安に試してみてください。多くのケースでこの範囲でもビジュアル上の劣化はほとんど気になりません。",[55,399,400,403],{},[32,401,402],{},"ダウンロードして使用する","\n圧縮後のファイルをダウンロードして、そのままWebサイトにアップロードできます。",[17,405,406],{},"処理はすべてローカルで行われるため、通信環境に関わらず速く動作し、データが外部に出ることもありません。",[37,408],{},[12,410,411],{"id":411},"画像圧縮の前後に確認すべきチェックリスト",[17,413,414],{},"圧縮するだけで終わりにしてしまうと、せっかくの改善効果が半減することがあります。以下のチェックリストを参考に、一連の対応を整理してみてください。",[17,416,417],{},[32,418,419],{},"圧縮前に確認すること",[52,421,424,433,439],{"className":422},[423],"contains-task-list",[55,425,428,432],{"className":426},[427],"task-list-item",[429,430],"input",{"disabled":208,"type":431},"checkbox"," PageSpeed Insights（またはLighthouse）でLCPの対象要素を特定する",[55,434,436,438],{"className":435},[427],[429,437],{"disabled":208,"type":431}," 改善対象の画像ファイルサイズを把握する（100KB以上なら圧縮優先）",[55,440,442,444],{"className":441},[427],[429,443],{"disabled":208,"type":431}," 表示サイズに対して必要以上に大きな解像度になっていないか確認する（例：横幅800pxで表示しているのに3000px幅の画像を使っていないか）",[17,446,447],{},[32,448,449],{},"圧縮後に確認すること",[52,451,453,459,471,481],{"className":452},[423],[55,454,456,458],{"className":455},[427],[429,457],{"disabled":208,"type":431}," 視覚的な品質が許容範囲に収まっているか確認する",[55,460,462,464,465,467,468,470],{"className":461},[427],[429,463],{"disabled":208,"type":431}," 画像タグに",[24,466,337],{},"・",[24,469,341],{},"属性が設定されているか確認する（CLSの防止）",[55,472,474,476,477,480],{"className":473},[427],[429,475],{"disabled":208,"type":431}," 可能であれば",[24,478,479],{},"loading=\"lazy\"","を設定する（ファーストビュー外の画像に有効）",[55,482,484,486],{"className":483},[427],[429,485],{"disabled":208,"type":431}," 再度PageSpeed Insightsでスコアを計測して改善幅を確認する",[17,488,489],{},"画像圧縮は一度やれば終わりではありません。新しいページを追加するたびに同じ基準で対応する習慣をつけると、Core Web Vitalsのスコアを継続的に維持できます。",[17,491,492],{},"また、今後Webサイトに掲載する画像は、撮影・制作の段階からファイルサイズを意識しておくと後の作業が楽になります。「Web用に書き出す」「解像度は72dpiで十分」といった基準を制作フローに組み込んでおくことをおすすめします。",[37,494],{},[17,496,497],{},"Core Web Vitalsの改善は、一見難しそうに感じますが、画像圧縮という具体的なアクションから着手するのが最も効果を実感しやすい方法です。ツールの導入コストも時間もほとんどかからないため、まずは今のサイトの画像を一度確認してみてください。",{"title":194,"searchDepth":195,"depth":195,"links":499},[500,501,502,503],{"id":227,"depth":195,"text":228},{"id":269,"depth":195,"text":269},{"id":350,"depth":195,"text":351},{"id":411,"depth":195,"text":411},"Core Web Vitals のスコアを下げる画像の重さを解消する方法を解説。ブラウザだけで完結する無料ツールを使った実践的な改善ステップを紹介します。",{},"\u002Fblog\u002Fcore-web-vitals-image-compress","2026-05-05",{"title":222,"description":504},"core-web-vitals-image-compress","blog\u002Fcore-web-vitals-image-compress",[215,512,218,513],"圧縮","Core Web Vitals","UwuTfke-zayrzyjzA0lR0uobGodScG9hVZstptUy0MI",{"id":516,"title":517,"author":7,"body":518,"category":201,"coverImage":202,"description":712,"draft":204,"extension":205,"locale":206,"meta":713,"navigation":208,"noindex":204,"path":714,"publishedAt":715,"seo":716,"slug":717,"stem":718,"tags":719,"updatedAt":715,"__hash__":723},"blog\u002Fblog\u002Fheic-to-jpg-intro.md","HEIC を JPG に変換する — \u002Ftools\u002Fheic-to-jpg の思想と使い方",{"type":9,"value":519,"toc":703},[520,523,530,534,541,567,570,573,577,580,583,586,607,610,620,640,643,646,652,658,664,670,673],[17,521,522],{},"iPhone で撮影した写真を PC や同僚に送ったら「開けません」と言われた経験、ありますよね。iPhone の標準形式 HEIC (High Efficiency Image Container) は、Apple エコシステム外では互換性が限定的です。Windows 10 以降はアドオンが必要、画像編集ソフトも対応が遅れがちです。",[17,524,525,529],{},[150,526,528],{"href":527},"\u002Ftools\u002Fheic-to-jpg","Zerosend の HEIC → JPG 変換ツール"," は、この問題をブラウザ内で解決します。",[12,531,533],{"id":532},"heic-とは","HEIC とは",[17,535,536,537,540],{},"HEIC は Apple が iOS 11 から採用した画像フォーマットです。HEVC (H.265) という映像圧縮技術を静止画に応用したもので、同等画質の JPG と比べてファイルサイズを約半分に抑えられます。iPhone のストレージを節約するうえで有効な形式ですが、",[32,538,539],{},"Apple 外のシステムでは素直に開けない","という問題を持っています。",[52,542,543,549,555,561],{},[55,544,545,548],{},[32,546,547],{},"Windows PC",": 標準では開けず、Microsoft Store から有償の HEVC コーデックをインストールする必要がある",[55,550,551,554],{},[32,552,553],{},"古い画像編集ソフト",": Photoshop や Lightroom の古いバージョンは非対応",[55,556,557,560],{},[32,558,559],{},"Web サービス",": X (Twitter)・Facebook・note など多くのプラットフォームで HEIC のアップロードが弾かれる",[55,562,563,566],{},[32,564,565],{},"Android",": HEIC をネイティブで扱えない機種が多い",[12,568,569],{"id":569},"変換が必要な主な場面",[17,571,572],{},"Windows の仕事用 PC で iPhone の写真を開きたいとき、ブログや SNS に iPhone 写真を投稿しようとして弾かれたとき、クライアントへ納品する写真素材のファイル形式を統一するとき——いずれも JPG への変換が最短解です。",[12,574,576],{"id":575},"なぜブラウザ内で-heic-を変換するのか","なぜブラウザ内で HEIC を変換するのか",[17,578,579],{},"iPhone で撮った写真は、個人・家族・仕事の私的情景を含みがちです。顔、家の中、位置情報、撮影日時。これらを無料のオンライン変換サービスにアップロードすることは、事実上それらの情報を第三者に預けることを意味します。",[17,581,582],{},"Zerosend は、HEIC のデコードから JPG の書き出しまで、すべてブラウザ内で行います。写真自体が外に出ないため、NDA 下の撮影素材や家族の写真でも安心して使えます。",[12,584,585],{"id":585},"使い方",[375,587,588,595,598,601,604],{},[55,589,590,594],{},[150,591,592],{"href":527},[24,593,527],{}," を開く",[55,596,597],{},"HEIC \u002F HEIF 形式の画像をドラッグ&ドロップ (複数可)",[55,599,600],{},"品質 (JPG の圧縮率) を選択",[55,602,603],{},"「変換を開始する」をクリック",[55,605,606],{},"結果を ZIP でダウンロード",[12,608,609],{"id":609},"仕組み",[17,611,612,613,616,617,619],{},"HEIC のデコードはブラウザ標準ではまだ実装されていないため、",[24,614,615],{},"heic2any"," ライブラリを読み込んで使っています。",[24,618,615],{}," は libheif を WebAssembly 化したもので、ブラウザ内で HEIC を Blob として展開できます。",[52,621,622,625,630,633],{},[55,623,624],{},"HEIC ファイルを ArrayBuffer として読み込み",[55,626,627,629],{},[24,628,615],{}," で JPEG Blob に変換 (libheif の WASM が実行される)",[55,631,632],{},"必要なら Canvas 経由で品質を再指定",[55,634,635,636,639],{},"元のファイル名を保持したまま ",[24,637,638],{},".jpg"," 拡張子で書き出し",[17,641,642],{},"初回のみ libheif の WASM (約 2MB) をダウンロードするため少し待ち時間がありますが、2 回目以降はキャッシュから即時起動します。",[12,644,645],{"id":645},"よくある質問",[17,647,648,651],{},[32,649,650],{},"Q. HEIC と HEIF の違いは？","\nA. HEIF がコンテナフォーマットの総称で、HEIC はその中で HEVC (H.265) でエンコードされた静止画を指します。本ツールは両方対応しています。",[17,653,654,657],{},[32,655,656],{},"Q. Live Photo はどうなりますか？","\nA. 静止画部分のみが JPG として書き出されます。動画部分は含まれません。動画も抽出したい場合は別途 iPhone 側で「書き出す > 現状のまま」を使ってください。",[17,659,660,663],{},[32,661,662],{},"Q. EXIF (撮影日時・位置情報) は引き継がれますか？","\nA. 一部情報は失われます。位置情報のプライバシー観点ではむしろ利点です。",[17,665,666,669],{},[32,667,668],{},"Q. 複数ファイルまとめて変換できますか？","\nA. はい。ZIP で一括ダウンロードできます。数十枚程度までは快適に処理できます。",[12,671,672],{"id":672},"関連ツール",[52,674,675,682,689,696],{},[55,676,677,681],{},[150,678,680],{"href":679},"\u002Ftools\u002Fimage-compress","画像圧縮"," — JPG 変換後にさらに軽くしたいとき",[55,683,684,688],{},[150,685,687],{"href":686},"\u002Ftools\u002Fimage-resize","画像リサイズ"," — 送信前に寸法も揃える",[55,690,691,695],{},[150,692,694],{"href":693},"\u002Ftools\u002Fimage-convert","画像形式変換"," — JPG \u002F PNG \u002F WebP の相互変換",[55,697,698,702],{},[150,699,701],{"href":700},"\u002Ftools\u002Fimage-to-pdf","画像 → PDF"," — 変換後の JPG をまとめて PDF 化する",{"title":194,"searchDepth":195,"depth":195,"links":704},[705,706,707,708,709,710,711],{"id":532,"depth":195,"text":533},{"id":569,"depth":195,"text":569},{"id":575,"depth":195,"text":576},{"id":585,"depth":195,"text":585},{"id":609,"depth":195,"text":609},{"id":645,"depth":195,"text":645},{"id":672,"depth":195,"text":672},"iPhone で撮った HEIC 画像を Windows \u002F Android や古いシステムで開けるよう JPG に変換するツール。サーバーに送らずブラウザ内で変換する仕組みと注意点を Zerosend 編集部が解説。",{},"\u002Fblog\u002Fheic-to-jpg-intro","2026-04-20",{"title":517,"description":712},"heic-to-jpg-intro","blog\u002Fheic-to-jpg-intro",[720,215,721,722],"HEIC","iPhone","ツール","NbDoeVSgFPWUufoUokX_--BrmUj9tyIBQSEzbnQ7-e4",{"id":725,"title":726,"author":7,"body":727,"category":201,"coverImage":202,"description":935,"draft":204,"extension":205,"locale":206,"meta":936,"navigation":208,"noindex":204,"path":937,"publishedAt":715,"seo":938,"slug":939,"stem":940,"tags":941,"updatedAt":715,"__hash__":943},"blog\u002Fblog\u002Fimage-convert-intro.md","画像形式変換をブラウザ内で — \u002Ftools\u002Fimage-convert の思想と使い方",{"type":9,"value":728,"toc":926},[729,732,735,761,767,770,773,776,783,786,788,807,810,836,843,845,852,874,881,883,889,895,901,907,909],[17,730,731],{},"「PNG で貰ったロゴを JPEG にしたい」「iPhone で撮った HEIC を JPG で送りたい」「サイト表示を速くするために WebP に揃えたい」。画像の形式変換は地味ですが発生頻度の高い作業です。",[17,733,734],{},"よくあるユースケースを整理するとこうなります。",[52,736,737,743,749,755],{},[55,738,739,742],{},[32,740,741],{},"Web 担当者",": 納品された PNG 素材を WebP に変換してページ表示を高速化したい",[55,744,745,748],{},[32,746,747],{},"デザイナー",": 透過 PNG のロゴを、背景色固定の JPEG に変換してメール添付したい",[55,750,751,754],{},[32,752,753],{},"一般ユーザー",": Windows で開けない HEIC をとにかく JPG に直したい",[55,756,757,760],{},[32,758,759],{},"開発者",": 複数形式が混在した画像フォルダを WebP に一括統一したい",[17,762,763,766],{},[150,764,765],{"href":693},"Zerosend の画像形式変換ツール"," は、この日常作業をブラウザ内で完結させます。一度も外に出さずに、あなたの端末だけで別形式に書き出します。",[12,768,769],{"id":769},"形式を変換したい主な理由",[17,771,772],{},"画像形式ごとに得意な用途が異なります。目的に合った形式を選ぶだけで、ファイルサイズが 30〜50% 小さくなったり、透過表現が使えるようになったりします。変換そのものを手軽にできる環境があると、素材管理の自由度が大きく上がります。",[12,774,775],{"id":775},"なぜブラウザ内で形式変換するのか",[17,777,778,779,782],{},"画像変換サービスの多くは、アップロード → サーバーで変換 → ダウンロード という流れです。社員写真、契約書のスキャン、製品デザイン案。",[32,780,781],{},"中身を見られたくない画像ほど、オンライン変換ツールに投げづらい","のが現実です。",[17,784,785],{},"Zerosend は、変換処理そのものがブラウザ内で完結するため、機密性の高い素材でもそのまま使えます。DevTools の Network タブを開いたまま変換しても、画像本体がアップロードされていないことを自分で確認できます。",[12,787,585],{"id":585},[375,789,790,796,799,802,804],{},[55,791,792,594],{},[150,793,794],{"href":693},[24,795,693],{},[55,797,798],{},"画像をドラッグ&ドロップ (複数可)",[55,800,801],{},"出力形式 (JPEG \u002F PNG \u002F WebP) と品質を選択",[55,803,603],{},[55,805,806],{},"結果を ZIP でまとめてダウンロード",[12,808,809],{"id":809},"形式の選び方",[52,811,812,818,824,830],{},[55,813,814,817],{},[32,815,816],{},"JPEG",": 写真・背景画像。透過不要。古いブラウザ\u002Fアプリ互換性が最重要なら",[55,819,820,823],{},[32,821,822],{},"PNG",": ロゴ・UI パーツ・透過必要なグラフィック。可逆圧縮",[55,825,826,829],{},[32,827,828],{},"WebP",": 汎用。JPEG より 25〜35% 小さくなり、透過も扱える。モダン用途の標準",[55,831,832,835],{},[32,833,834],{},"AVIF",": 更に小さいが生成コストが高く、ブラウザ対応がまだ揃いきらない",[17,837,838,839,842],{},"ブログや EC で表示速度を気にするなら ",[32,840,841],{},"WebP 一択","と言って差し支えありません。",[12,844,609],{"id":609},[17,846,847,848,851],{},"Canvas API の ",[24,849,850],{},"canvas.toBlob(callback, 'image\u002Fwebp', quality)"," を使って変換しています。ブラウザ標準のエンコーダなので、外部ライブラリ依存もありません。",[52,853,854,861,868],{},[55,855,856,857,860],{},"入力画像を ",[24,858,859],{},"\u003Cimg>"," として読み込み",[55,862,863,864,867],{},"同寸の ",[24,865,866],{},"\u003Ccanvas>"," に描画",[55,869,870,873],{},[24,871,872],{},"toBlob"," で出力形式と品質を指定して書き出し",[17,875,876,877,880],{},"HEIC 入力のみ別ツール (",[150,878,879],{"href":527},"HEIC → JPG",") に振り分けています。HEIC デコーダがブラウザ標準にまだ入っていないため、別ライブラリを読み込む必要があるためです。",[12,882,645],{"id":645},[17,884,885,888],{},[32,886,887],{},"Q. WebP に変換するメリットは？","\nA. 同じ視覚品質で JPEG より 25〜35% 小さくなります。透過も扱えるため PNG の代替にもなり、モダンブラウザはすべて対応済みです。ブログや EC では積極的に使う価値があります。",[17,890,891,894],{},[32,892,893],{},"Q. 透過 PNG を JPEG にしたらどうなる？","\nA. 透過部分は白で塗られます。意図しない結果になりやすいので注意してください。透過を維持したい場合は WebP か PNG のままにしてください。",[17,896,897,900],{},[32,898,899],{},"Q. 元のメタデータ (EXIF) は引き継がれる？","\nA. 落ちます。位置情報漏れの予防としてはむしろ利点です。",[17,902,903,906],{},[32,904,905],{},"Q. バッチ処理の上限は？","\nA. 端末のメモリ次第ですが、実用上は 100 枚前後までを推奨します。",[12,908,672],{"id":672},[52,910,911,916,921],{},[55,912,913,915],{},[150,914,680],{"href":679}," — 品質指定で再エンコードしてサイズ削減",[55,917,918,920],{},[150,919,687],{"href":686}," — 形式変換と同時に寸法も揃えたいときは先にこちら",[55,922,923,925],{},[150,924,879],{"href":527}," — iPhone 写真専用の変換",{"title":194,"searchDepth":195,"depth":195,"links":927},[928,929,930,931,932,933,934],{"id":769,"depth":195,"text":769},{"id":775,"depth":195,"text":775},{"id":585,"depth":195,"text":585},{"id":809,"depth":195,"text":809},{"id":609,"depth":195,"text":609},{"id":645,"depth":195,"text":645},{"id":672,"depth":195,"text":672},"Zerosend の画像形式変換ツールは、JPEG \u002F PNG \u002F WebP \u002F AVIF をサーバーに送らず相互変換します。用途別の形式選び、透過・圧縮率の違いを Zerosend 編集部が整理します。",{},"\u002Fblog\u002Fimage-convert-intro",{"title":726,"description":935},"image-convert-intro","blog\u002Fimage-convert-intro",[215,942,828,722],"変換","xN0-q4ewAvDZNl6TjIn0v_ArxA8uRFuMBmge7YzSp3k",{"id":945,"title":946,"author":7,"body":947,"category":201,"coverImage":202,"description":1161,"draft":204,"extension":205,"locale":206,"meta":1162,"navigation":208,"noindex":204,"path":1163,"publishedAt":715,"seo":1164,"slug":1165,"stem":1166,"tags":1167,"updatedAt":715,"__hash__":1169},"blog\u002Fblog\u002Fimage-edit-intro.md","画像の切り抜き・回転・反転をブラウザ内で — \u002Ftools\u002Fimage-edit の思想と使い方",{"type":9,"value":948,"toc":1153},[949,952,959,962,1000,1003,1006,1013,1016,1018,1055,1057,1093,1096,1098,1104,1114,1120,1126,1132,1134],[17,950,951],{},"SNS アイコンの正方形切り出し、履歴書の証明写真の比率合わせ、商品画像の回転、スキャン画像の左右反転。Photoshop を開くほどでもないのに地味に面倒な作業ですよね。",[17,953,954,958],{},[150,955,957],{"href":956},"\u002Ftools\u002Fimage-edit","Zerosend の画像編集ツール"," は、この 3 操作を 1 画面に集約してブラウザ内で完結させます。",[12,960,961],{"id":961},"こんな場面で使える",[52,963,964,970,976,982,988,994],{},[55,965,966,969],{},[32,967,968],{},"SNS アイコン・プロフィール画像",": Instagram や Twitter は正方形が基本。1:1 プリセットでワンクリック切り抜き",[55,971,972,975],{},[32,973,974],{},"証明写真のトリミング",": 就活・パスポート申請用に 3:4 比率で切り抜き。顔が含まれるデータをサーバーに送りたくないときに特に有効",[55,977,978,981],{},[32,979,980],{},"スキャン画像の向き修正",": スキャナが横向きで読み込んだ場合、90° 回転で即座に修正",[55,983,984,987],{},[32,985,986],{},"商品画像の整形",": EC サイト用に余白をカットして正方形化",[55,989,990,993],{},[32,991,992],{},"鏡像反転",": 文字が逆に写り込んだ画像を水平反転で修正",[55,995,996,999],{},[32,997,998],{},"ブログ・資料のサムネイル",": 16:9 プリセットで統一感のある横長画像を作成",[12,1001,1002],{"id":1002},"なぜブラウザ内で編集するのか",[17,1004,1005],{},"トリミングは個人情報と密接です。証明写真を切り出すなら顔、名刺をスキャンするなら氏名・連絡先、社内資料の一部を切り出すなら機密情報が含まれます。",[17,1007,1008,1009,1012],{},"これらを「画像を切り抜くだけ」のオンラインツールにアップロードすると、切り抜き前の原版が相手のサーバーに残る可能性があります。オンラインツールはビジネスモデル上、アップロード済みのファイルをログ・解析・AI 学習に回しても契約上問題にならないケースが多く、",[32,1010,1011],{},"利用者側からはその境界が見えません","。",[17,1014,1015],{},"Zerosend は編集処理そのものをローカルで行うことで、この不透明性を取り除きます。",[12,1017,585],{"id":585},[375,1019,1020,1026,1029,1052],{},[55,1021,1022,594],{},[150,1023,1024],{"href":956},[24,1025,956],{},[55,1027,1028],{},"画像をドラッグ&ドロップ",[55,1030,1031,1032],{},"3 つの操作から選ぶ:\n",[52,1033,1034,1040,1046],{},[55,1035,1036,1039],{},[32,1037,1038],{},"切り抜き",": 矩形を選択範囲として指定",[55,1041,1042,1045],{},[32,1043,1044],{},"回転",": 90° \u002F 180° \u002F 270° の 3 ステップ",[55,1047,1048,1051],{},[32,1049,1050],{},"反転",": 水平 \u002F 垂直",[55,1053,1054],{},"プレビューで結果を確認してダウンロード",[12,1056,609],{"id":609},[52,1058,1059,1071,1080],{},[55,1060,1061,1063,1064,1066,1067,1070],{},[32,1062,1038],{},": 選択した矩形の寸法の ",[24,1065,866],{}," を作り、",[24,1068,1069],{},"drawImage"," で元画像の該当領域を切り出し",[55,1072,1073,1075,1076,1079],{},[32,1074,1044],{},": 回転行列を ",[24,1077,1078],{},"ctx.transform"," で適用してから描画",[55,1081,1082,1084,1085,1088,1089,1092],{},[32,1083,1050],{},": ",[24,1086,1087],{},"ctx.scale(-1, 1)"," で水平、",[24,1090,1091],{},"ctx.scale(1, -1)"," で垂直",[17,1094,1095],{},"いずれも Canvas API の基本操作の組み合わせで、追加ライブラリは使っていません。処理は数十ミリ秒で完了します。",[12,1097,645],{"id":645},[17,1099,1100,1103],{},[32,1101,1102],{},"Q. 元の画像ファイルは変更されますか？","\nA. いいえ。処理はブラウザのメモリ上で行われ、ダウンロードするまで何も書き変わりません。元ファイルはそのまま手元に残ります。",[17,1105,1106,1109,1110,1113],{},[32,1107,1108],{},"Q. 対応している画像形式は？","\nA. JPEG・PNG・WebP・GIF (静止画) に対応しています。HEIC 形式の場合は先に ",[150,1111,1112],{"href":527},"HEIC → JPG 変換"," を使ってから編集してください。",[17,1115,1116,1119],{},[32,1117,1118],{},"Q. 比率指定 (1:1, 4:3, 16:9) で切り抜けますか？","\nA. はい。プリセットボタンで一発切り替えできます。SNS アイコンは 1:1、YouTube サムネは 16:9 など。",[17,1121,1122,1125],{},[32,1123,1124],{},"Q. 複数画像をまとめて同じ比率で切り抜けますか？","\nA. 現状は 1 枚ずつです。バッチ処理は要望を見ながら検討します。",[17,1127,1128,1131],{},[32,1129,1130],{},"Q. 編集後に再度編集したい場合は？","\nA. ダウンロードしたファイルを再度ドロップすれば、何度でも編集できます。",[12,1133,672],{"id":672},[52,1135,1136,1141,1146],{},[55,1137,1138,1140],{},[150,1139,687],{"href":686}," — 切り抜き後に寸法を揃えたいとき",[55,1142,1143,1145],{},[150,1144,680],{"href":679}," — 編集後の軽量化",[55,1147,1148,1152],{},[150,1149,1151],{"href":1150},"\u002Ftools\u002Fimage-merge","画像結合"," — 複数画像を 1 枚にまとめたいとき",{"title":194,"searchDepth":195,"depth":195,"links":1154},[1155,1156,1157,1158,1159,1160],{"id":961,"depth":195,"text":961},{"id":1002,"depth":195,"text":1002},{"id":585,"depth":195,"text":585},{"id":609,"depth":195,"text":609},{"id":645,"depth":195,"text":645},{"id":672,"depth":195,"text":672},"Zerosend の画像編集ツールは、切り抜き・回転・反転をサーバーに送らず端末内で処理します。証明写真・SNS アイコン・商品画像のトリミングで使える基本操作を Zerosend 編集部が解説。",{},"\u002Fblog\u002Fimage-edit-intro",{"title":946,"description":1161},"image-edit-intro","blog\u002Fimage-edit-intro",[215,1168,722],"編集","RrpC6EauzaWkAgWFfR06-Hve3OSQ4XqwZn5wmKjcYTw",{"id":1171,"title":1172,"author":7,"body":1173,"category":201,"coverImage":202,"description":1378,"draft":204,"extension":205,"locale":206,"meta":1379,"navigation":208,"noindex":204,"path":1380,"publishedAt":715,"seo":1381,"slug":1382,"stem":1383,"tags":1384,"updatedAt":715,"__hash__":1386},"blog\u002Fblog\u002Fimage-merge-intro.md","複数画像を 1 枚にまとめる — \u002Ftools\u002Fimage-merge の思想と使い方",{"type":9,"value":1174,"toc":1369},[1175,1178,1184,1187,1194,1197,1199,1222,1224,1250,1253,1257,1277,1283,1286,1312,1314,1323,1329,1338,1344,1350,1352],[17,1176,1177],{},"スマホのスクリーンショットを複数枚まとめて 1 枚の縦長画像にしたい。商品のビフォーアフター画像を横並びで 1 枚にしたい。操作マニュアルの手順画像を縦に並べて 1 ファイルにまとめたい。比較画像や before\u002Fafter の資料作りで、画像を並べたいシーンは日常的に発生します。",[17,1179,1180,1183],{},[150,1181,1182],{"href":1150},"Zerosend の画像結合ツール"," は、こうした「複数画像を 1 枚にまとめる」需要をブラウザ内で完結させます。",[12,1185,1186],{"id":1186},"なぜブラウザ内で結合するのか",[17,1188,1189,1190,1193],{},"結合対象の画像には、アプリの画面キャプチャ、社内ドキュメントのスクショ、顧客の LINE 履歴など機密性の高いものが混ざりがちです。",[32,1191,1192],{},"結合対象を全部まとめてサーバーに上げる","ということは、それだけの量の機密情報を一度に外に出すことと同じです。",[17,1195,1196],{},"Zerosend は結合処理そのものがローカルで動くため、何枚投入しても 1 枚のファイルも外に出ません。",[12,1198,585],{"id":585},[375,1200,1201,1207,1210,1213,1216,1219],{},[55,1202,1203,594],{},[150,1204,1205],{"href":1150},[24,1206,1150],{},[55,1208,1209],{},"画像を複数枚ドラッグ&ドロップ",[55,1211,1212],{},"結合方向を選ぶ (縦に連結 \u002F 横に連結 \u002F グリッド)",[55,1214,1215],{},"順序が違う場合はドラッグで並べ替え",[55,1217,1218],{},"「結合を開始する」をクリック",[55,1220,1221],{},"1 枚の画像としてダウンロード",[12,1223,609],{"id":609},[52,1225,1226,1229,1235,1241,1244],{},[55,1227,1228],{},"各入力画像の寸法を計測",[55,1230,1231,1232,1234],{},"結合後の ",[24,1233,866],{}," サイズを計算 (縦連結なら幅は最大・高さは合計)",[55,1236,1237,1238,1240],{},"画像を順に ",[24,1239,1069],{}," で配置",[55,1242,1243],{},"幅\u002F高さが揃わない場合は縦横比を保って自動センタリング",[55,1245,1246,1249],{},[24,1247,1248],{},"canvas.toBlob()"," で PNG \u002F JPEG として書き出し",[17,1251,1252],{},"全処理は Canvas API の組み合わせで完結します。100 枚程度の結合まで現実的です。",[12,1254,1256],{"id":1255},"縦結合横結合の使い分け","縦結合・横結合の使い分け",[52,1258,1259,1265,1271],{},[55,1260,1261,1264],{},[32,1262,1263],{},"縦に連結",": スマホのスクロールスクリーンショットをつなぐ、手順説明の連番画像をまとめる",[55,1266,1267,1270],{},[32,1268,1269],{},"横に連結",": ビフォー\u002Fアフターを並べる、比較検討資料を 1 枚にする",[55,1272,1273,1276],{},[32,1274,1275],{},"グリッド",": 複数カットを整然と並べて SNS 投稿やカタログ素材にする",[17,1278,1279,1280,1282],{},"サイズが異なる画像は、余白を自動で埋めて揃えます。事前に ",[150,1281,687],{"href":686}," で寸法を統一しておくと、余白なしにきれいに仕上がります。",[12,1284,1285],{"id":1285},"使いどころ",[52,1287,1288,1294,1300,1306],{},[55,1289,1290,1293],{},[32,1291,1292],{},"スクショ集約",": アプリのフロー解説で、複数画面を 1 枚にまとめて Slack に貼る",[55,1295,1296,1299],{},[32,1297,1298],{},"比較画像",": ビフォー\u002Fアフターを横並びで 1 枚に",[55,1301,1302,1305],{},[32,1303,1304],{},"SNS 投稿",": Instagram の 1 枚投稿でも複数カットを見せる",[55,1307,1308,1311],{},[32,1309,1310],{},"申請書類",": 表紙と本文を 1 画像にまとめて提出",[12,1313,645],{"id":645},[17,1315,1316,1319,1320,1322],{},[32,1317,1318],{},"Q. 結合後のファイルサイズはどのくらいになりますか？","\nA. 入力枚数と解像度に比例して大きくなります。多数枚を結合した場合は ",[150,1321,680],{"href":679}," で軽量化するのがおすすめです。",[17,1324,1325,1328],{},[32,1326,1327],{},"Q. 何枚まで結合できますか？","\nA. ツールに上限は設けていませんが、ブラウザのメモリに依存します。100 枚程度までは現実的に動作します。",[17,1330,1331,1334,1335,1337],{},[32,1332,1333],{},"Q. 画像サイズが違うものを結合するとどうなる？","\nA. 縦連結では幅を最大に合わせ、余白部分は透明 (PNG) または白 (JPEG) になります。事前に ",[150,1336,687],{"href":686}," で揃えておくときれいに仕上がります。",[17,1339,1340,1343],{},[32,1341,1342],{},"Q. 間に余白を入れられる？","\nA. はい。境界の色と幅を指定できます。",[17,1345,1346,1349],{},[32,1347,1348],{},"Q. グリッドの行数・列数は指定できる？","\nA. はい。例えば 4 枚を 2×2 のグリッドに配置できます。",[12,1351,672],{"id":672},[52,1353,1354,1359,1364],{},[55,1355,1356,1358],{},[150,1357,687],{"href":686}," — 結合前にサイズを揃える",[55,1360,1361,1363],{},[150,1362,680],{"href":679}," — 結合後の巨大ファイルを軽くする",[55,1365,1366,1368],{},[150,1367,701],{"href":700}," — 結合の代わりに PDF 1 枚にまとめる選択肢も",{"title":194,"searchDepth":195,"depth":195,"links":1370},[1371,1372,1373,1374,1375,1376,1377],{"id":1186,"depth":195,"text":1186},{"id":585,"depth":195,"text":585},{"id":609,"depth":195,"text":609},{"id":1255,"depth":195,"text":1256},{"id":1285,"depth":195,"text":1285},{"id":645,"depth":195,"text":645},{"id":672,"depth":195,"text":672},"Zerosend の画像結合ツールは、複数の画像をサーバーに送らずブラウザ内で縦\u002F横に連結します。比較画像・ビフォーアフター・スマホのスクリーンショット集約に。Zerosend 編集部が解説。",{},"\u002Fblog\u002Fimage-merge-intro",{"title":1172,"description":1378},"image-merge-intro","blog\u002Fimage-merge-intro",[215,1385,722],"結合","BdOzeJZQnsoFfwi5pz3V87puNcR5EgH2JaJgn9GjCok",{"id":1388,"title":1389,"author":7,"body":1390,"category":201,"coverImage":202,"description":1579,"draft":204,"extension":205,"locale":206,"meta":1580,"navigation":208,"noindex":204,"path":1581,"publishedAt":715,"seo":1582,"slug":1583,"stem":1584,"tags":1585,"updatedAt":715,"__hash__":1586},"blog\u002Fblog\u002Fimage-resize-intro.md","画像リサイズをブラウザ内で — \u002Ftools\u002Fimage-resize の思想と使い方",{"type":9,"value":1391,"toc":1568},[1392,1395,1401,1404,1410,1417,1419,1438,1442,1480,1482,1488,1513,1516,1519,1522,1524,1530,1536,1542,1548,1550],[17,1393,1394],{},"SNS に投稿したい、社内 Wiki に貼りたい、EC サイトの商品画像に使いたい、メールに添付したい。用途ごとに必要な画像サイズは違います。スマホで撮った 4000×3000 ピクセルの写真をそのままアップすると、受け側サーバーで勝手に縮小されたり、表示が重くなったりします。",[17,1396,1397,1400],{},[150,1398,1399],{"href":686},"Zerosend の画像リサイズツール"," は、この「用途に合う寸法に先に揃えておきたい」需要をブラウザ内で完結させます。",[12,1402,1403],{"id":1403},"なぜブラウザ内でリサイズするのか",[17,1405,1406,1407,1012],{},"画像は、送信前に必要な解像度まで落としておくのが基本です。受け側サーバーの自動縮小に任せると、圧縮アルゴリズムを自分で選べず、結果も見えません。何より、",[32,1408,1409],{},"元の高解像度がサーバー側に残ります",[17,1411,1412,1413,1416],{},"顔写真、社員証、内装写真、診断書のスキャン。個人情報が含まれる画像を、ブラウザの「縮小してアップロード」機能付きサービスに投げることは、結果的に",[32,1414,1415],{},"原寸画像をそのままアップロードしている","のと同じです。Zerosend では、リサイズ処理そのものをあなたの端末で行うことで、アップロードする画像が本当に縮小済みであることを保証します。",[12,1418,585],{"id":585},[375,1420,1421,1427,1430,1433,1436],{},[55,1422,1423,594],{},[150,1424,1425],{"href":686},[24,1426,686],{},[55,1428,1429],{},"画像をドラッグ&ドロップ (複数ファイル対応)",[55,1431,1432],{},"目標サイズを指定 — 「幅」「高さ」「長辺」「短辺」のいずれかを固定",[55,1434,1435],{},"「リサイズを開始する」をクリック",[55,1437,806],{},[1439,1440,1441],"h3",{"id":1441},"用途別の推奨サイズ",[52,1443,1444,1450,1456,1462,1468,1474],{},[55,1445,1446,1449],{},[32,1447,1448],{},"X \u002F Twitter",": 長辺 1600px",[55,1451,1452,1455],{},[32,1453,1454],{},"Instagram",": 正方形 1080px",[55,1457,1458,1461],{},[32,1459,1460],{},"LinkedIn \u002F Facebook",": 長辺 1200px",[55,1463,1464,1467],{},[32,1465,1466],{},"ブログ本文",": 幅 800〜1200px",[55,1469,1470,1473],{},[32,1471,1472],{},"メールの添付",": 長辺 1024px 程度 (画質維持しつつ 500KB 以下に収まりやすい)",[55,1475,1476,1479],{},[32,1477,1478],{},"ECサイトのサムネ",": 幅 400〜600px",[12,1481,609],{"id":609},[17,1483,1484,1485,1487],{},"画像リサイズは、Canvas API の ",[24,1486,1069],{}," を使ったブラウザ標準のバイキュービック補間で行っています。外部ライブラリの呼び出しも、サーバーへの問い合わせもありません。",[52,1489,1490,1496,1502,1508],{},[55,1491,1492,1493,1495],{},"画像を ",[24,1494,859],{}," 要素として読み込む",[55,1497,1498,1499,1501],{},"目標サイズの ",[24,1500,866],{}," を作成",[55,1503,1504,1507],{},[24,1505,1506],{},"ctx.drawImage(img, 0, 0, targetW, targetH)"," で描画",[55,1509,1510,1512],{},[24,1511,1248],{}," で出力形式 (JPEG \u002F PNG \u002F WebP) を指定して Blob に",[17,1514,1515],{},"一括処理は Promise.all ではなく順次実行しているため、数十枚でもメモリを圧迫しません。",[12,1517,1518],{"id":1518},"縦横比の維持について",[17,1520,1521],{},"リサイズで気をつけるべき最大のポイントは「アスペクト比の崩れ」です。幅だけを変えて高さはそのままにすると、人物が横に伸びたり商品が歪んだりします。本ツールでは既定で縦横比を維持するため、「幅を指定する」だけで高さは自動計算されます。強制的にトリミングするモードも選べるので、SNS の正方形サムネイルを作る際にも対応できます。",[12,1523,645],{"id":645},[17,1525,1526,1529],{},[32,1527,1528],{},"Q. 縦横比は保持されますか？","\nA. 既定で保持されます。「幅を合わせる」を選べば高さは自動で計算されます。",[17,1531,1532,1535],{},[32,1533,1534],{},"Q. EXIF (撮影情報) は？","\nA. リサイズ時に落ちます。プライバシー保護の観点ではむしろ利点です。",[17,1537,1538,1541],{},[32,1539,1540],{},"Q. 拡大もできますか？","\nA. できますが推奨しません。拡大は情報を増やせないため、AI 超解像を使わない限り画質は改善しません。",[17,1543,1544,1547],{},[32,1545,1546],{},"Q. 複数ファイルを一括処理できますか？","\nA. はい。ドラッグ&ドロップで複数ファイルを投入すると、同じ設定で一括リサイズして ZIP でまとめてダウンロードできます。",[12,1549,672],{"id":672},[52,1551,1552,1557,1562],{},[55,1553,1554,1556],{},[150,1555,680],{"href":679}," — リサイズ後にさらに軽くしたいときに",[55,1558,1559,1561],{},[150,1560,694],{"href":693}," — WebP \u002F JPEG \u002F PNG の変換",[55,1563,1564,1567],{},[150,1565,1566],{"href":956},"画像編集"," — 切り抜き・回転・反転",{"title":194,"searchDepth":195,"depth":195,"links":1569},[1570,1571,1575,1576,1577,1578],{"id":1403,"depth":195,"text":1403},{"id":585,"depth":195,"text":585,"children":1572},[1573],{"id":1441,"depth":1574,"text":1441},3,{"id":609,"depth":195,"text":609},{"id":1518,"depth":195,"text":1518},{"id":645,"depth":195,"text":645},{"id":672,"depth":195,"text":672},"Zerosend の画像リサイズツールは、画像をサーバーに送らず端末内で寸法変更します。用途別の推奨サイズ、一括処理、品質を落とさないリサイズのコツを Zerosend 編集部が解説。",{},"\u002Fblog\u002Fimage-resize-intro",{"title":1389,"description":1579},"image-resize-intro","blog\u002Fimage-resize-intro",[215,216,722],"_Uhop01N2UVvIiAaq5jlsmlRm_wNoZwYVJzFkekar6Y",{"id":1588,"title":1589,"author":7,"body":1590,"category":201,"coverImage":202,"description":1787,"draft":204,"extension":205,"locale":206,"meta":1788,"navigation":208,"noindex":204,"path":1789,"publishedAt":715,"seo":1790,"slug":1791,"stem":1792,"tags":1793,"updatedAt":715,"__hash__":1795},"blog\u002Fblog\u002Fimage-to-pdf-intro.md","画像を 1 つの PDF にまとめる — \u002Ftools\u002Fimage-to-pdf の思想と使い方",{"type":9,"value":1591,"toc":1779},[1592,1595,1601,1604,1630,1633,1636,1643,1650,1652,1675,1677,1683,1714,1717,1719,1725,1734,1740,1749,1751],[17,1593,1594],{},"スマホで撮ったレシート 10 枚を経費精算で PDF にまとめる、スキャンした書類 15 枚を 1 つの PDF にまとめて申請する、商品写真を PDF カタログにする。「画像 → PDF」の変換は、個人から業務まで頻繁に発生する作業です。",[17,1596,1597,1600],{},[150,1598,1599],{"href":700},"Zerosend の画像 → PDF 変換ツール"," は、この作業をブラウザ内で完結させます。",[12,1602,1603],{"id":1603},"主なユースケース",[52,1605,1606,1612,1618,1624],{},[55,1607,1608,1611],{},[32,1609,1610],{},"写真をポートフォリオ PDF に",": デザイナーや写真家が作品画像を選択して 1 ファイルにまとめ、クライアントへの提案や審査用に配布する",[55,1613,1614,1617],{},[32,1615,1616],{},"スキャン画像を 1 ファイルに集約",": 複数ページにわたる契約書・申請書をスキャンした画像を 1 つの PDF にまとめて提出する",[55,1619,1620,1623],{},[32,1621,1622],{},"レシート・領収書の経費精算",": スマホで撮影したレシートをまとめて月次経費書類として提出する",[55,1625,1626,1629],{},[32,1627,1628],{},"複数画像を順番管理して配布",": ドラッグ&ドロップで並び順を調整しながら、説明資料やマニュアルを PDF にまとめる",[17,1631,1632],{},"複数の画像ファイルを 1 回の操作で 1 つの PDF に変換できるため、枚数が多いほど手作業との差が際立ちます。",[12,1634,1635],{"id":1635},"なぜブラウザ内で変換するのか",[17,1637,1638,1639,1642],{},"画像 → PDF 変換の入力は、写真・スキャン・スクリーンショットです。つまり",[32,1640,1641],{},"画像 1 枚ずつが個別の機密情報","を持ちます。レシートなら店名・金額・日時・クレカ下 4 桁、スキャン書類なら本文全体、スクショなら画面に写っているすべて。",[17,1644,1645,1646,1649],{},"それらをまとめてオンライン PDF 化サービスに投げるのは、",[32,1647,1648],{},"機密情報セットをまとめて外に出す","ことに他なりません。Zerosend ではローカルで PDF 組み立てまで行うため、アップロードは発生しません。",[12,1651,585],{"id":585},[375,1653,1654,1660,1663,1666,1669,1672],{},[55,1655,1656,594],{},[150,1657,1658],{"href":700},[24,1659,700],{},[55,1661,1662],{},"画像を複数枚ドラッグ&ドロップ (JPEG \u002F PNG \u002F WebP)",[55,1664,1665],{},"ページサイズ (A4 \u002F レター \u002F 画像原寸) と向きを選ぶ",[55,1667,1668],{},"並び順をドラッグで調整",[55,1670,1671],{},"「PDF 化を開始する」をクリック",[55,1673,1674],{},"1 つの PDF ファイルとしてダウンロード",[12,1676,609],{"id":609},[17,1678,1679,1682],{},[24,1680,1681],{},"pdf-lib"," を使って PDF を組み立てています。",[52,1684,1685,1688,1694,1705,1708],{},[55,1686,1687],{},"各画像を ArrayBuffer で読み込み",[55,1689,1690,1693],{},[24,1691,1692],{},"PDFDocument.create()"," で新規ドキュメントを作成",[55,1695,1696,1697,1700,1701,1704],{},"ページごとに ",[24,1698,1699],{},"pdfDoc.embedJpg()"," または ",[24,1702,1703],{},"embedPng()"," で画像を埋め込み",[55,1706,1707],{},"ページサイズに合わせて自動で縮小・センタリング",[55,1709,1710,1713],{},[24,1711,1712],{},".save()"," で最終的な PDF バイト列に",[17,1715,1716],{},"画像のサイズ指定は縦横比を保持したまま、指定ページサイズに収まるよう計算されます。",[12,1718,645],{"id":645},[17,1720,1721,1724],{},[32,1722,1723],{},"Q. 画像の順序は変えられますか？","\nA. はい。追加した順に並びますが、ドラッグで並べ替えできます。",[17,1726,1727,1730,1731,1733],{},[32,1728,1729],{},"Q. 画像の向き (縦\u002F横) を個別に変えられますか？","\nA. ページ単位の向きは全体で統一されます。個別に回転したい場合は ",[150,1732,1566],{"href":956}," で先に回転してから PDF 化してください。",[17,1735,1736,1739],{},[32,1737,1738],{},"Q. OCR (文字認識) はかかる？","\nA. かかりません。画像はそのまま PDF に埋め込まれます。検索可能 PDF にしたい場合は別途 OCR ツールを通してください (プライバシー観点では、OCR もローカルで完結するツールを選ぶべきです)。",[17,1741,1742,1745,1746,1748],{},[32,1743,1744],{},"Q. 圧縮は？","\nA. 元画像がそのまま埋め込まれるため、PDF が大きくなりがちです。事前に ",[150,1747,680],{"href":679}," してから投入すると、最終 PDF が軽くなります。",[12,1750,672],{"id":672},[52,1752,1753,1758,1765,1772],{},[55,1754,1755,1757],{},[150,1756,680],{"href":679}," — PDF 化前に画像を軽くする",[55,1759,1760,1764],{},[150,1761,1763],{"href":1762},"\u002Ftools\u002Fpdf-compress","PDF 圧縮"," — 生成した PDF をさらに軽くする",[55,1766,1767,1771],{},[150,1768,1770],{"href":1769},"\u002Ftools\u002Fpdf-merge","PDF 結合"," — 既存 PDF と結合する",[55,1773,1774,1778],{},[150,1775,1777],{"href":1776},"\u002Ftools\u002Fpdf-to-image","PDF → 画像"," — 逆変換",{"title":194,"searchDepth":195,"depth":195,"links":1780},[1781,1782,1783,1784,1785,1786],{"id":1603,"depth":195,"text":1603},{"id":1635,"depth":195,"text":1635},{"id":585,"depth":195,"text":585},{"id":609,"depth":195,"text":609},{"id":645,"depth":195,"text":645},{"id":672,"depth":195,"text":672},"Zerosend の画像 → PDF 変換ツールは、複数画像をサーバーに送らず 1 つの PDF にまとめます。スキャン画像の PDF 化・レシートまとめ・申請書類の体裁整え。Zerosend 編集部が解説。",{},"\u002Fblog\u002Fimage-to-pdf-intro",{"title":1589,"description":1787},"image-to-pdf-intro","blog\u002Fimage-to-pdf-intro",[1794,215,942,722],"PDF","W4LB1AnTY2syLdRrdjvKSLPfsnRiA8kspm8q42K-X9g",{"id":1797,"title":1798,"author":7,"body":1799,"category":201,"coverImage":202,"description":2014,"draft":204,"extension":205,"locale":206,"meta":2015,"navigation":208,"noindex":204,"path":2016,"publishedAt":715,"seo":2017,"slug":2018,"stem":2019,"tags":2020,"updatedAt":715,"__hash__":2021},"blog\u002Fblog\u002Fpdf-to-image-intro.md","PDF を画像に変換する — \u002Ftools\u002Fpdf-to-image の思想と使い方",{"type":9,"value":1800,"toc":2004},[1801,1804,1809,1812,1838,1840,1847,1850,1852,1871,1874,1894,1896,1902,1931,1934,1936,1947,1953,1959,1968,1980,1982],[17,1802,1803],{},"プレゼン資料の 1 ページだけスクリーンショット的に使いたい、PDF の一部を SNS 投稿したい、PDF を見れない環境向けに画像で送りたい。「PDF → 画像」の変換は地味に需要があります。",[17,1805,1806,1600],{},[150,1807,1808],{"href":1776},"Zerosend の PDF → 画像変換ツール",[12,1810,1811],{"id":1811},"どんな場面で役立つか",[52,1813,1814,1820,1826,1832],{},[55,1815,1816,1819],{},[32,1817,1818],{},"SNS・ブログへの資料引用",": 講演スライドや報告書の特定ページを画像として切り出し、X や Instagram にそのまま投稿できます",[55,1821,1822,1825],{},[32,1823,1824],{},"サムネイル作成",": PDF ドキュメントの表紙ページを高解像度 PNG に変換し、ウェブサイトのカバー画像として使えます",[55,1827,1828,1831],{},[32,1829,1830],{},"PDF 非対応の環境に送る",": チャットツールや古い CMS が PDF に対応していなくても、画像なら貼れます",[55,1833,1834,1837],{},[32,1835,1836],{},"PDF の内容をすばやく確認・共有",": 受け取った PDF の一部だけを画像にして、コメント付きで関係者に送る用途にも便利です",[12,1839,1635],{"id":1635},[17,1841,1842,1843,1846],{},"PDF から画像を切り出したい場面は、社内資料・顧客提案書・設計図・契約書スナップショットなど、機密度が高いケースが多いものです。「PDF の特定ページを画像にしたいだけ」とオンラインツールに上げるときも、",[32,1844,1845],{},"アップロードされるのは PDF の全ページ","です。",[17,1848,1849],{},"Zerosend は変換処理をローカルで行うため、そもそも PDF が外に出ません。",[12,1851,585],{"id":585},[375,1853,1854,1860,1863,1866,1868],{},[55,1855,1856,594],{},[150,1857,1858],{"href":1776},[24,1859,1776],{},[55,1861,1862],{},"PDF をドラッグ&ドロップ",[55,1864,1865],{},"出力形式 (PNG \u002F JPEG) と解像度を選ぶ",[55,1867,603],{},[55,1869,1870],{},"全ページの画像が ZIP で生成される",[1439,1872,1873],{"id":1873},"解像度の目安",[52,1875,1876,1882,1888],{},[55,1877,1878,1881],{},[32,1879,1880],{},"72 DPI",": ウェブ掲載・SNS 投稿用。画質より軽さ優先",[55,1883,1884,1887],{},[32,1885,1886],{},"150 DPI",": 画面で読む標準品質",[55,1889,1890,1893],{},[32,1891,1892],{},"300 DPI",": 印刷品質。資料の細部が重要なとき",[12,1895,609],{"id":609},[17,1897,1898,1901],{},[24,1899,1900],{},"pdfjs-dist"," を使って各ページを Canvas に描画し、Canvas から画像として書き出しています。",[52,1903,1904,1907,1913,1923,1928],{},[55,1905,1906],{},"PDF を ArrayBuffer として読み込み",[55,1908,1909,1912],{},[24,1910,1911],{},"getDocument()"," で解析",[55,1914,1696,1915,1918,1919,1922],{},[24,1916,1917],{},"getPage(n)"," → ",[24,1920,1921],{},"render(ctx, viewport)"," で Canvas に描画",[55,1924,1925,1927],{},[24,1926,1248],{}," で PNG \u002F JPEG 化",[55,1929,1930],{},"全ページを ZIP にまとめてダウンロード",[17,1932,1933],{},"ブラウザの描画エンジンをそのまま使うため、フォント埋め込み・ベクタ図・透過要素も正確に再現されます。",[12,1935,645],{"id":645},[17,1937,1938,1941,1942,1946],{},[32,1939,1940],{},"Q. 特定のページだけ変換できますか？","\nA. 現状は全ページが対象です。特定ページだけなら ",[150,1943,1945],{"href":1944},"\u002Ftools\u002Fpdf-split","PDF 分割"," で該当ページだけ抽出してから変換するのが確実です。",[17,1948,1949,1952],{},[32,1950,1951],{},"Q. 透過背景の PDF を変換するとどうなる？","\nA. PNG を選べば透過が保持されます。JPEG は透過非対応のため白背景になります。",[17,1954,1955,1958],{},[32,1956,1957],{},"Q. 画像の品質をもっと上げたい","\nA. 解像度を 300 DPI にすると大きく改善します。ファイルサイズとメモリ消費も大きくなります。",[17,1960,1961,1964,1965,1967],{},[32,1962,1963],{},"Q. 全ページを 1 枚にまとめたい","\nA. 本ツールは 1 ページ 1 ファイルです。まとめたい場合はダウンロード後 ",[150,1966,1151],{"href":1150}," で結合してください。",[17,1969,1970,1973,1974,1976,1977,1979],{},[32,1971,1972],{},"Q. PNG と JPEG どちらを選ぶべきか？","\nA. テキストや図表が多い資料は ",[32,1975,822],{}," が高品質です。写真が多いページや SNS 投稿用に軽さを優先するなら ",[32,1978,816],{}," が適しています。",[12,1981,672],{"id":672},[52,1983,1984,1989,1994,1999],{},[55,1985,1986,1988],{},[150,1987,1945],{"href":1944}," — 変換前に必要なページだけ抽出",[55,1990,1991,1993],{},[150,1992,1763],{"href":1762}," — 先に PDF を軽くしてから変換すると出力もコンパクトに",[55,1995,1996,1998],{},[150,1997,680],{"href":679}," — 変換後の画像サイズをさらに削減",[55,2000,2001,2003],{},[150,2002,1151],{"href":1150}," — 変換した複数ページを 1 枚にまとめる",{"title":194,"searchDepth":195,"depth":195,"links":2005},[2006,2007,2008,2011,2012,2013],{"id":1811,"depth":195,"text":1811},{"id":1635,"depth":195,"text":1635},{"id":585,"depth":195,"text":585,"children":2009},[2010],{"id":1873,"depth":1574,"text":1873},{"id":609,"depth":195,"text":609},{"id":645,"depth":195,"text":645},{"id":672,"depth":195,"text":672},"Zerosend の PDF → 画像変換ツールは、PDF の各ページをサーバーに送らずブラウザ内で PNG \u002F JPEG に書き出します。資料の一部だけ共有したいときに便利。Zerosend 編集部が解説。",{},"\u002Fblog\u002Fpdf-to-image-intro",{"title":1798,"description":2014},"pdf-to-image-intro","blog\u002Fpdf-to-image-intro",[1794,215,942,722],"71aq4s1WD6fPtxZpe1EQB5VFETOk05HeofsZ6n-nTXM",{"id":2023,"title":2024,"author":7,"body":2025,"category":201,"coverImage":202,"description":2284,"draft":204,"extension":205,"locale":206,"meta":2285,"navigation":208,"noindex":204,"path":2286,"publishedAt":2287,"seo":2288,"slug":2289,"stem":2290,"tags":2291,"updatedAt":2287,"__hash__":2293},"blog\u002Fblog\u002Fheic-to-jpg-windows.md","Windows で HEIC を JPG に変換する 3 つの方法 — 無料・オンライン・アップロード不要",{"type":9,"value":2026,"toc":2260},[2027,2034,2038,2042,2049,2053,2056,2060,2063,2066,2080,2083,2095,2099,2104,2107,2124,2128,2135,2138,2142,2145,2149,2157,2164,2168,2220,2222,2225,2228,2232,2239,2243,2246,2249],[17,2028,2029,2030,2033],{},"iPhone から送られてきた写真 (",[24,2031,2032],{},".HEIC"," 形式) を Windows で開こうとして「このファイルを開けません」のダイアログで止まった経験がある人向け。3 つの解決方法を比較します。",[12,2035,2037],{"id":2036},"heic-とは何か-30-秒解説","HEIC とは何か (30 秒解説)",[1439,2039,2041],{"id":2040},"apple-が推進する高圧縮画像フォーマット","Apple が推進する高圧縮画像フォーマット",[17,2043,2044,2045,2048],{},"HEIC (High Efficiency Image Container) は、iPhone 7 以降のデフォルト撮影形式です。JPG と比べて",[32,2046,2047],{},"同じ画質で約半分のファイルサイズ","を実現します。写真のストレージ節約目的で採用されています。",[1439,2050,2052],{"id":2051},"windows-が標準対応していない理由","Windows が標準対応していない理由",[17,2054,2055],{},"HEIC の特許関係で、Windows には標準でコーデックが入っていません。対応するには拡張機能の追加 or 変換が必要です。",[12,2057,2059],{"id":2058},"方法-1-microsoft-store-の-heifhevc-拡張機能","方法 1: Microsoft Store の HEIF\u002FHEVC 拡張機能",[17,2061,2062],{},"Windows 10\u002F11 で HEIC を「フォト」アプリで直接開けるようにする方法。",[1439,2064,2065],{"id":2065},"手順",[375,2067,2068,2071,2074,2077],{},[55,2069,2070],{},"Microsoft Store を開く",[55,2072,2073],{},"「HEIF 画像拡張機能」を検索してインストール (無料)",[55,2075,2076],{},"「HEVC ビデオ拡張機能」もインストール (有料の場合あり、~120 円程度)",[55,2078,2079],{},"再起動不要、すぐに HEIC が開けるようになる",[1439,2081,2082],{"id":2082},"注意点",[52,2084,2085,2088],{},[55,2086,2087],{},"HEVC の方は Microsoft Store のポリシー次第で有料化されている期間があります",[55,2089,2090,2091,2094],{},"拡張機能を入れても、",[32,2092,2093],{},"Windows 標準のフォトビューアー","以外では開けないツールがあります (サードパーティ画像編集ソフト等)",[12,2096,2098],{"id":2097},"方法-2-zerosend-でブラウザ内変換-推奨","方法 2: Zerosend でブラウザ内変換 (推奨)",[17,2100,2101,2103],{},[150,2102,527],{"href":527}," は、ブラウザだけで HEIC → JPG 変換を行うツールです。",[1439,2105,2065],{"id":2106},"手順-1",[375,2108,2109,2115,2118,2121],{},[55,2110,2111,2114],{},[150,2112,2113],{"href":527},"Zerosend HEIC → JPG"," にアクセス",[55,2116,2117],{},"HEIC ファイルをドラッグ&ドロップ (複数可)",[55,2119,2120],{},"「変換する」ボタン",[55,2122,2123],{},"JPG をダウンロード",[1439,2125,2127],{"id":2126},"iphone-から送った写真が外に出ないメリット","iPhone から送った写真が外に出ないメリット",[17,2129,2130,2131,2134],{},"HEIC は iPhone の撮影形式、つまり",[32,2132,2133],{},"個人の写真","です。家族のプライベート写真や顔写真が写り込んだ業務資料を、一度クラウド SaaS にアップロードして変換させるのは気持ちの良い行為ではありません。",[17,2136,2137],{},"Zerosend はブラウザ内で完結するため、写真が外部に送られません。DevTools の Network タブで確認できます。",[12,2139,2141],{"id":2140},"方法-3-iphone-側で互換性優先に変更","方法 3: iPhone 側で「互換性優先」に変更",[17,2143,2144],{},"そもそも HEIC ではなく JPG で撮影する設定に変える方法。",[1439,2146,2148],{"id":2147},"手順-ios","手順 (iOS)",[375,2150,2151,2154],{},[55,2152,2153],{},"設定 → カメラ → フォーマット",[55,2155,2156],{},"「高効率」→「互換性優先」に変更",[17,2158,2159,2160,2163],{},"これで以降の撮影は JPG になります。ただし",[32,2161,2162],{},"容量は 1.5〜2 倍","に増えるので、iPhone のストレージとの兼ね合いで判断してください。",[12,2165,2167],{"id":2166},"どの方法が良いか-用途別まとめ","どの方法が良いか (用途別まとめ)",[274,2169,2170,2180],{},[277,2171,2172],{},[280,2173,2174,2177],{},[283,2175,2176],{},"シーン",[283,2178,2179],{},"おすすめ",[293,2181,2182,2190,2198,2206,2213],{},[280,2183,2184,2187],{},[298,2185,2186],{},"1〜2 枚を今だけ開きたい",[298,2188,2189],{},"方法 1 (拡張機能)",[280,2191,2192,2195],{},[298,2193,2194],{},"まとめて JPG 化したい (複数枚)",[298,2196,2197],{},"方法 2 (Zerosend)",[280,2199,2200,2203],{},[298,2201,2202],{},"今後撮る写真は Windows で扱いやすくしたい",[298,2204,2205],{},"方法 3 (iPhone 設定)",[280,2207,2208,2211],{},[298,2209,2210],{},"プライバシーに気を配りたい",[298,2212,2197],{},[280,2214,2215,2218],{},[298,2216,2217],{},"業務で他社に JPG で渡したい",[298,2219,2197],{},[12,2221,645],{"id":645},[1439,2223,2224],{"id":2224},"画質は劣化するか",[17,2226,2227],{},"HEIC → JPG の変換は非可逆同士の変換なので、わずかに劣化します。Zerosend は変換品質を 92% に設定しており、肉眼での判別は困難なレベルです。",[1439,2229,2231],{"id":2230},"exif-撮影日時位置情報-は残るか","EXIF (撮影日時・位置情報) は残るか",[17,2233,2234,2235,2238],{},"iPhone の HEIC に含まれる EXIF は、変換時に基本的に引き継がれます。ただし Zerosend は",[32,2236,2237],{},"プライバシー配慮で EXIF を自動削除","します。撮影日時を残したい場合は、方法 1 (拡張機能で開くだけ) を選ぶか、別ツールで明示的に保持してください。",[1439,2240,2242],{"id":2241},"連写した大量の-heic-も一括変換できるか","連写した大量の HEIC も一括変換できるか",[17,2244,2245],{},"Zerosend は複数ファイルの一括変換に対応しており、結果は ZIP でまとめてダウンロードできます。100 枚単位の処理も問題ありません (ブラウザのメモリ次第)。",[12,2247,2248],{"id":2248},"まとめ",[17,2250,2251,2252,2255,2256,2259],{},"HEIC が開けないという問題は、拡張機能・オンライン変換・撮影設定変更の 3 通りで解決できます。",[32,2253,2254],{},"一度にたくさん + プライバシー重視","なら、ブラウザ内で完結する ",[150,2257,2258],{"href":527},"Zerosend の HEIC → JPG 変換"," が一番実用的です。",{"title":194,"searchDepth":195,"depth":195,"links":2261},[2262,2266,2270,2274,2277,2278,2283],{"id":2036,"depth":195,"text":2037,"children":2263},[2264,2265],{"id":2040,"depth":1574,"text":2041},{"id":2051,"depth":1574,"text":2052},{"id":2058,"depth":195,"text":2059,"children":2267},[2268,2269],{"id":2065,"depth":1574,"text":2065},{"id":2082,"depth":1574,"text":2082},{"id":2097,"depth":195,"text":2098,"children":2271},[2272,2273],{"id":2106,"depth":1574,"text":2065},{"id":2126,"depth":1574,"text":2127},{"id":2140,"depth":195,"text":2141,"children":2275},[2276],{"id":2147,"depth":1574,"text":2148},{"id":2166,"depth":195,"text":2167},{"id":645,"depth":195,"text":645,"children":2279},[2280,2281,2282],{"id":2224,"depth":1574,"text":2224},{"id":2230,"depth":1574,"text":2231},{"id":2241,"depth":1574,"text":2242},{"id":2248,"depth":195,"text":2248},"iPhone の HEIC 写真が Windows で開けない時の解決策を 3 通り解説。Microsoft Store 拡張機能、ブラウザ内変換 (Zerosend)、iPhone の設定変更を比較し、用途別のおすすめを紹介します。",{},"\u002Fblog\u002Fheic-to-jpg-windows","2026-04-19",{"title":2024,"description":2284},"heic-to-jpg-windows","blog\u002Fheic-to-jpg-windows",[720,215,2292],"Windows","980U9DKFglaadPkZ3zjYq5jDasjMkJdPDF9-XLyb51g",{"id":2295,"title":2296,"author":7,"body":2297,"category":201,"coverImage":202,"description":2721,"draft":204,"extension":205,"locale":206,"meta":2722,"navigation":208,"noindex":204,"path":2723,"publishedAt":2287,"seo":2724,"slug":2725,"stem":2726,"tags":2727,"updatedAt":2728,"__hash__":2729},"blog\u002Fblog\u002Fimage-compress-guide.md","オンライン画像圧縮 完全ガイド 2026 — 画質を落とさず最大限軽くする方法",{"type":9,"value":2298,"toc":2689},[2299,2306,2309,2313,2320,2324,2327,2330,2334,2347,2350,2354,2361,2372,2376,2390,2397,2401,2405,2412,2415,2497,2504,2508,2515,2519,2529,2536,2540,2547,2551,2558,2561,2565,2568,2583,2586,2593,2596,2599,2603,2621,2624,2628,2646,2649,2653,2660,2663,2670,2674,2681,2683],[17,2300,2301,2302,2305],{},"Web サイトに画像を載せるとき、「軽くしたいけど画質は落としたくない」という悩みは共通です。本記事では、画像圧縮の基本と実用的なコツ、そしてファイルをサーバーに預けずに処理できる ",[150,2303,2304],{"href":679},"Zerosend の画像圧縮ツール"," の使い方を整理します。",[12,2307,2308],{"id":2308},"なぜ画像圧縮が必要か",[1439,2310,2312],{"id":2311},"表示速度と-seo-core-web-vitals","表示速度と SEO (Core Web Vitals)",[17,2314,2315,2316,2319],{},"Google の Core Web Vitals では、ページ内の最大コンテンツの表示時間 (LCP) を評価軸にしています。LCP の遅延原因の多くは",[32,2317,2318],{},"巨大な画像","です。未圧縮の写真を 1 枚置くだけで、モバイル回線ではページ全体の表示が数秒遅れます。検索順位にも影響します。",[1439,2321,2323],{"id":2322},"サーバー費用ストレージ節約","サーバー費用・ストレージ節約",[17,2325,2326],{},"画像 1 枚あたり数 MB を 100 枚置けば数 GB。配信帯域・ストレージ・CDN 費用は使い手がその画像を見る回数だけ上乗せで発生します。初期の圧縮コストをサボるほど、後でお金と速度の両方で払うことになります。",[12,2328,2329],{"id":2329},"主要な画像フォーマットと圧縮方式",[1439,2331,2333],{"id":2332},"jpg-と-png-の使い分け","JPG と PNG の使い分け",[52,2335,2336,2342],{},[55,2337,2338,2341],{},[32,2339,2340],{},"JPG",": 写真向け。非可逆圧縮 (情報を捨てて軽くする)。透過不可。",[55,2343,2344,2346],{},[32,2345,822],{},": ロゴ・スクリーンショット・透過が必要な画像向け。可逆圧縮。",[17,2348,2349],{},"写真を PNG で保存すると JPG の 5〜10 倍の容量になります。まずこの判断を間違えないこと。",[1439,2351,2353],{"id":2352},"webp-avif-の現在地","WebP \u002F AVIF の現在地",[17,2355,2356,2357,2360],{},"2026 年時点では ",[32,2358,2359],{},"WebP は実質全ブラウザで使えます","。AVIF も主要ブラウザが対応済みで、JPG の 2〜3 割小さい容量を実現できます。",[17,2362,2363,2364,2367,2368,2371],{},"互換性が不安なら、WebP を第一選択にしつつ、フォールバックで JPG \u002F PNG を用意するのが安全です。",[24,2365,2366],{},"\u003Cpicture>"," タグの ",[24,2369,2370],{},"srcset"," で自動切替できます。",[1439,2373,2375],{"id":2374},"可逆圧縮-vs-非可逆圧縮","可逆圧縮 vs 非可逆圧縮",[52,2377,2378,2384],{},[55,2379,2380,2383],{},[32,2381,2382],{},"可逆 (lossless)",": ファイルを小さくするが画質は 1 ピクセルも失わない。PNG \u002F WebP lossless \u002F AVIF lossless。",[55,2385,2386,2389],{},[32,2387,2388],{},"非可逆 (lossy)",": 人間の目に目立ちにくい情報を捨てて大幅に軽くする。JPG \u002F WebP lossy \u002F AVIF。",[17,2391,2392,2393,2396],{},"Web 配信用は",[32,2394,2395],{},"基本的に非可逆で十分","。ロゴやイラストのような「元画像が重要」なものだけ可逆を選びます。",[12,2398,2400],{"id":2399},"画質を落とさず圧縮する-5-つのコツ","画質を落とさず圧縮する 5 つのコツ",[1439,2402,2404],{"id":2403},"_1-品質-8085-の黄金点","1. 品質 80〜85 % の黄金点",[17,2406,2407,2408,2411],{},"JPG の品質設定は 100% ではなく ",[32,2409,2410],{},"85% がベスト","です。体感の画質差はほぼ分かりませんが、ファイルサイズは 100% の約 40% まで落ちます。70% まで下げると輪郭にノイズが出始めるので、そこが下限の目安です。",[17,2413,2414],{},"具体的な目安は次の通りです (元画像比のおおよその容量)。",[274,2416,2417,2430],{},[277,2418,2419],{},[280,2420,2421,2424,2427],{},[283,2422,2423],{},"品質",[283,2425,2426],{},"体感画質",[283,2428,2429],{},"容量目安 (元比)",[293,2431,2432,2443,2453,2464,2475,2486],{},[280,2433,2434,2437,2440],{},[298,2435,2436],{},"100",[298,2438,2439],{},"最高",[298,2441,2442],{},"100%",[280,2444,2445,2448,2450],{},[298,2446,2447],{},"95",[298,2449,2439],{},[298,2451,2452],{},"70%",[280,2454,2455,2458,2461],{},[298,2456,2457],{},"85",[298,2459,2460],{},"ほぼ最高",[298,2462,2463],{},"40%",[280,2465,2466,2469,2472],{},[298,2467,2468],{},"75",[298,2470,2471],{},"良好",[298,2473,2474],{},"30%",[280,2476,2477,2480,2483],{},[298,2478,2479],{},"60",[298,2481,2482],{},"ノイズが見え始める",[298,2484,2485],{},"22%",[280,2487,2488,2491,2494],{},[298,2489,2490],{},"40",[298,2492,2493],{},"明らかに劣化",[298,2495,2496],{},"15%",[17,2498,2499,2500,2503],{},"85% より上は容量効率が悪く、これより下はブロックノイズが目立ち始めます。",[32,2501,2502],{},"85% が黄金点","である理由がここにあります。",[1439,2505,2507],{"id":2506},"_2-不要なメタデータを削る","2. 不要なメタデータを削る",[17,2509,2510,2511,2514],{},"スマホで撮った写真には EXIF (撮影日時・GPS 位置情報・カメラ機種) が埋め込まれています。サイズ的にわずか数十 KB ですが、",[32,2512,2513],{},"プライバシー面でも削るべき","です。Zerosend の画像圧縮は保存時に EXIF を自動で除去します。",[1439,2516,2518],{"id":2517},"_3-画像サイズを先にリサイズ","3. 画像サイズを先にリサイズ",[17,2520,2521,2522,2524,2525,2528],{},"圧縮前に画像サイズ (ピクセル) を表示サイズに合わせることが、品質と容量を両立する最強の施策です。300px で表示する画像を 3000px のまま圧縮しても、帯域の無駄でしかありません。",[150,2523,155],{"href":686}," で",[32,2526,2527],{},"先に縮めてから","圧縮してください。",[17,2530,2531,2532,2535],{},"なお、",[32,2533,2534],{},"元画像より大きいサイズに拡大しても画質は上がりません","。800px の画像を 1600px にリサイズすると、補間で輪郭がぼやけるだけで情報量は増えません。リサイズは「元画像の最大サイズを上限」にして縮小方向だけに使うのが鉄則です。",[1439,2537,2539],{"id":2538},"_4-複数ツールを重ねがけしない","4. 複数ツールを重ねがけしない",[17,2541,2542,2543,2546],{},"非可逆圧縮は毎回わずかに画質が落ちます。「JPG を圧縮 → またアップ → また圧縮」を繰り返すと、ジワジワ劣化が積み重なります。元画像から ",[32,2544,2545],{},"1 回だけ"," 圧縮する運用にしましょう。",[1439,2548,2550],{"id":2549},"_5-重要な画像だけ手動で確認","5. 重要な画像だけ手動で確認",[17,2552,2553,2554,2557],{},"自動処理で全部済ませてよい画像と、見出し画像やアイキャッチのように",[32,2555,2556],{},"手動で結果を確認すべき画像","を分けます。後者は品質 85% に加えて、元画像とのスライダー比較を挟むと事故を防げます。",[12,2559,2560],{"id":2560},"オンライン画像圧縮ツールの選び方",[1439,2562,2564],{"id":2563},"アップロードされるされないを見分ける","アップロードされる\u002Fされないを見分ける",[17,2566,2567],{},"「オンラインで無料で使える」と謳うツールの多くは、一度ファイルをサーバーに送って処理しています。画像のロゴや社内資料では、これが問題になる場面があります。",[17,2569,2570,2571,2574,2575,2578,2579,2582],{},"見分け方はシンプルです。ブラウザの ",[32,2572,2573],{},"DevTools を開き Network タブを表示","してからツールを使ってみてください。アップロード時に大きなデータを伴う POST リクエストが出ていれば、そのツールは送信型です。",[150,2576,2577],{"href":679},"Zerosend の画像圧縮"," はこの検証で",[32,2580,2581],{},"送信ゼロ","が確認できます。",[1439,2584,2585],{"id":2585},"画質コントロールの柔軟性",[17,2587,2588,2589,2592],{},"品質スライダーがあるか、形式を選べるか、出力プレビューがあるかは必ずチェックしましょう。プリセット一択のツールは",[32,2590,2591],{},"過剰圧縮","に陥りがちです。",[1439,2594,2595],{"id":2595},"バッチ処理に対応しているか",[17,2597,2598],{},"1 枚ずつでは時間がかかる業務向けに、複数ファイルの一括処理 + ZIP ダウンロードに対応したツールを選びます。",[12,2600,2602],{"id":2601},"zerosend-でブラウザ内完結の画像圧縮をする手順","Zerosend でブラウザ内完結の画像圧縮をする手順",[375,2604,2605,2609,2612,2615,2618],{},[55,2606,2607,2114],{},[150,2608,679],{"href":679},[55,2610,2611],{},"画像をドラッグ&ドロップ (JPG \u002F PNG \u002F WebP、複数可)",[55,2613,2614],{},"品質スライダーを調整 (推奨は 80)",[55,2616,2617],{},"「圧縮する」ボタン",[55,2619,2620],{},"1 枚ならそのまま、複数なら ZIP でダウンロード",[17,2622,2623],{},"すべての処理がブラウザ内で完結するので、機密画像も安心して扱えます。",[1439,2625,2627],{"id":2626},"devtools-の-network-タブで検証する方法","DevTools の Network タブで検証する方法",[375,2629,2630,2633,2636,2639],{},[55,2631,2632],{},"圧縮する前に DevTools を開く (右クリック → 検証)",[55,2634,2635],{},"Network タブに切り替え、「Preserve log」をオンに",[55,2637,2638],{},"画像をドラッグ&ドロップして処理を走らせる",[55,2640,2641,2642,2645],{},"表示される通信が CDN \u002F GA \u002F AdSense だけで、",[32,2643,2644],{},"画像自体を POST している通信がない"," ことを確認",[12,2647,2648],{"id":2648},"よくある落とし穴",[1439,2650,2652],{"id":2651},"透過-png-が白背景になる","透過 PNG が白背景になる",[17,2654,2655,2656,2659],{},"JPG は透過を扱えません。PNG の透過画像を「形式変換: JPG」で処理すると、透過部分が白で埋まります。透過を保ちたい場合は PNG のまま \u002F WebP に変換してください。",[150,2657,2658],{"href":693},"画像形式変換ツール"," を参照。",[1439,2661,2662],{"id":2662},"圧縮後に色がくすむ",[17,2664,2665,2666,2669],{},"sRGB 以外のプロファイル (Adobe RGB \u002F Display P3) で保存された画像は、非対応ブラウザで色がくすんで見えることがあります。Web 配信は ",[32,2667,2668],{},"sRGB に統一","するのが無難です。",[1439,2671,2673],{"id":2672},"sns-側で再圧縮される","SNS 側で再圧縮される",[17,2675,2676,2677,2680],{},"Twitter \u002F Instagram \u002F LINE では、投稿された画像がプラットフォーム側でさらに圧縮されます。自分で極限まで圧縮するよりも、",[32,2678,2679],{},"そこそこで止めて SNS の再圧縮に任せる","方が綺麗に見えるケースもあります。",[12,2682,2248],{"id":2248},[17,2684,2685,2686,1012],{},"画像圧縮は「JPG 品質 85% を目安に、先にリサイズ、メタデータは削る」の 3 原則で大半がうまくいきます。Zerosend の画像圧縮は、この原則をブラウザ内で実現します。機密画像でも気兼ねなく使えるので、",[150,2687,2688],{"href":679},"試してみてください",{"title":194,"searchDepth":195,"depth":195,"links":2690},[2691,2695,2700,2707,2712,2715,2720],{"id":2308,"depth":195,"text":2308,"children":2692},[2693,2694],{"id":2311,"depth":1574,"text":2312},{"id":2322,"depth":1574,"text":2323},{"id":2329,"depth":195,"text":2329,"children":2696},[2697,2698,2699],{"id":2332,"depth":1574,"text":2333},{"id":2352,"depth":1574,"text":2353},{"id":2374,"depth":1574,"text":2375},{"id":2399,"depth":195,"text":2400,"children":2701},[2702,2703,2704,2705,2706],{"id":2403,"depth":1574,"text":2404},{"id":2506,"depth":1574,"text":2507},{"id":2517,"depth":1574,"text":2518},{"id":2538,"depth":1574,"text":2539},{"id":2549,"depth":1574,"text":2550},{"id":2560,"depth":195,"text":2560,"children":2708},[2709,2710,2711],{"id":2563,"depth":1574,"text":2564},{"id":2585,"depth":1574,"text":2585},{"id":2595,"depth":1574,"text":2595},{"id":2601,"depth":195,"text":2602,"children":2713},[2714],{"id":2626,"depth":1574,"text":2627},{"id":2648,"depth":195,"text":2648,"children":2716},[2717,2718,2719],{"id":2651,"depth":1574,"text":2652},{"id":2662,"depth":1574,"text":2662},{"id":2672,"depth":1574,"text":2673},{"id":2248,"depth":195,"text":2248},"画像圧縮で画質を落とさず最大限軽くするための実用テクと、ファイルをサーバーに送らずブラウザだけで圧縮する方法を解説。品質 85% の黄金点・フォーマット選び・リサイズとの順序まで。",{},"\u002Fblog\u002Fimage-compress-guide",{"title":2296,"description":2721},"image-compress-guide","blog\u002Fimage-compress-guide",[215,218,513],"2026-05-14","WgkSGzLGGIWj-RYIlFVIe_Mx6myS-glWbsNMBp0XNvU",1778757806133]