- コラム
Webサイトから画像を保存する方法｜右クリックできない時の対処法
ウェブサイトを見ていて「この画像、保存したい」と思う場面は誰にでもあります。旅行先の参考写真、気に入ったデザインのキャプチャ、仕事で使う素材の確認——理由はさまざまですが、画像を保存する操作は日常的に発生します。
多くの場合は画像を右クリックして「名前を付けて画像を保存」するだけで完結しますが、サイトによっては右クリックが無効化されていたり、スマートフォンでは操作方法が異なったりと、少し戸惑う場面も出てきます。
本記事では、PC・スマホそれぞれの基本的な画像保存方法から、右クリックできないときの対処法、そして保存する際に必ず知っておきたい著作権の注意点まで、現場目線でわかりやすく解説します。
PCで画像を保存する基本的な方法
Windowsでもmacでも、最もシンプルな方法は保存したい画像の上で右クリックすることです。表示されたメニューから「名前を付けて画像を保存」（Chromeの場合）や「画像を保存」（Safariの場合）を選ぶと、ダウンロードフォルダなどに保存されます。
保存先や保存ファイル名を指定するダイアログが表示されるブラウザと、自動的にダウンロードフォルダに保存されるブラウザがあります。Chromeは設定によって動作が変わり、デフォルトでは「ダウンロード」フォルダに自動保存されます。
| ブラウザ | 右クリック時のメニュー表示 | デフォルトの保存先 |
|---|---|---|
| Google Chrome | 「名前を付けて画像を保存」 | ダウンロードフォルダ（自動） |
| Microsoft Edge | 「画像に名前を付けて保存」 | ダウンロードフォルダ（自動） |
| Firefox | 「名前を付けて画像を保存」 | 保存先を選ぶダイアログが表示 |
| Safari（Mac） | 「イメージを保存」または「リンク先のファイルを保存」 | ダウンロードフォルダ（自動） |
保存した画像がどこに行ったかわからなくなった場合は、ブラウザのダウンロード履歴（Chromeは「Ctrl＋J」、Macは「Command＋J」）を開くと、保存したファイルの場所を確認できます。
iPhoneで画像を保存する方法
iPhoneでウェブページの画像を保存する場合、Safariを使っているときとChromeを使っているときで手順が若干異なります。
Safariの場合
保存したい画像を長押しします。しばらくするとメニューが表示されるので「写真に追加」をタップします。これでiPhoneの「写真」アプリのカメラロールに保存されます。「ファイルに保存」を選ぶと、iCloudドライブやiPhone本体のファイルアプリに保存することもできます。
Chromeの場合
画像を長押しすると「画像を保存」または「写真に追加」というメニューが表示されます。タップすると写真アプリのカメラロールに保存されます。
なお、初めて画像を保存する際に「写真へのアクセスを許可しますか？」という確認が表示されます。「すべての写真へのアクセスを許可」または「追加のみ許可」を選んでください。「許可しない」にしてしまうと保存できなくなるため、設定アプリから変更が必要になります。
Androidで画像を保存する方法
Androidでの基本的な手順はiPhoneと近いですが、保存先がやや異なります。
保存したい画像を長押しすると、メニューが表示されます。「画像をダウンロード」または「画像を保存」をタップすると、本体の「ダウンロード」フォルダに保存されます。保存した画像は「フォト」アプリや「ギャラリー」アプリ、またはファイルマネージャーの「ダウンロード」フォルダから確認できます。
機種やAndroidのバージョンによって表示されるメニューの文言が若干異なる場合がありますが、「ダウンロード」「保存」に関するメニューを選べば問題ありません。
| 端末 | 操作 | 保存先 | 確認場所 |
|---|---|---|---|
| iPhone | 画像を長押し→「写真に追加」 | 写真アプリ（カメラロール） | 写真アプリ |
| Android | 画像を長押し→「画像をダウンロード」 | ダウンロードフォルダ | フォトアプリ・ファイルマネージャー |
右クリックできない・長押しメニューが出ない場合の対処法
サイトによっては、画像の右クリックや長押しを意図的に無効化していることがあります。著作権保護や不正利用防止のためにJavaScriptで制限をかけているケースがほとんどです。そのような場合でも、いくつかの方法で画像を取得できる場合があります。
方法① スクリーンショットを撮る
最もシンプルな代替手段です。画面に表示されている内容をそのまま画像として保存できます。画質は画面解像度に依存しますが、個人的な参考用途であれば十分です。
- Windows：「PrintScreen」キー（またはWindows＋Shift＋S でトリミング可能）
- Mac：Command＋Shift＋4 でエリアを指定してスクリーンショット
- iPhone：サイドボタン＋音量アップボタンを同時押し
- Android：電源ボタン＋音量ダウンボタンを同時押し（機種によって異なる）
方法② ブラウザの開発者ツールから画像URLを取得する（PC）
PCのChromeやEdgeでは、「F12」キーまたは右クリック→「検証」で開発者ツールを開けます。「Elements」タブでHTMLの構造を確認し、画像のURLを直接探す方法です。img要素の「src」属性に書かれているURLをコピーしてアドレスバーに貼り付けると、画像単体が表示され、そこから保存できます。
方法③ ページのソースから画像URLを探す（PC）
「Ctrl＋U」（Macは「Command＋Option＋U」）でページのHTMLソースを表示し、「Ctrl＋F」で「.jpg」「.png」「.webp」などの拡張子を検索すると画像ファイルのURLを見つけられる場合があります。
方法④ ブラウザのキャッシュから取得する
ブラウザはページを表示する際に画像データをキャッシュ（一時保存）しています。ChromeやEdgeでは開発者ツールの「Network」タブを開いてページを再読み込みすると、読み込まれた画像ファイルが一覧表示されます。対象の画像ファイルを選んで右クリック→「Open in new tab」などで直接開くことができます。
| 対処法 | 難易度 | PC対応 | スマホ対応 | 向いているシーン |
|---|---|---|---|---|
| スクリーンショット | ★☆☆ 簡単 | ○ | ○ | 参考用・手軽に保存したいとき |
| 開発者ツールでURL取得 | ★★☆ 中級 | ○ | △（制限あり） | 元画質のまま保存したいとき |
| ページソースから検索 | ★★☆ 中級 | ○ | ✗ | URLを直接確認したいとき |
| キャッシュから取得 | ★★★ 上級 | ○ | ✗ | 複数の画像をまとめて確認したいとき |
画像が保存できないその他のケースと原因
右クリックが使えること以外の理由でも、画像がうまく保存できないことがあります。よくある原因を整理しました。
画像がCSSで背景として設定されている
HTMLの「img」タグではなく、CSSの「background-image」として設定されている画像は、右クリックしても「画像を保存」メニューが表示されません。開発者ツールでCSS側のURLを確認する必要があります。
Canvas要素で描画されている
JavaScriptのCanvasを使って動的に描画されている画像は、通常の方法では保存できない場合があります。スクリーンショットが現実的な手段です。
動画の一部フレームが表示されている
動画プレイヤー上に表示されている静止フレームは、画像ではなく動画データとして扱われるため、画像として右クリック保存はできません。スクリーンショットで対応しましょう。
iframeで埋め込まれたコンテンツ
別ドメインのiframeで埋め込まれた画像は、セキュリティの制約でアクセスが制限されている場合があります。
画像保存で必ず知っておきたい著作権の注意点
技術的に画像を保存できたとしても、それを自由に使っていいとは限りません。ウェブサイトに掲載されている画像のほとんどは、サイト運営者やカメラマン・デザイナーに著作権があります。
著作権のある画像を無断で以下のような用途に使用することは、法律上の問題になる可能性があります。
- 自分のウェブサイトやブログに転載する
- SNSに投稿する
- 商業目的の資料・印刷物に使用する
- 加工・編集して別の用途に使う
「参考にするために手元に保存しておく」個人的な利用は一般的に許容される範囲とされていますが、外部への公開・配布・商用利用は原則として権利者の許可が必要です。
| 利用シーン | 著作権上の扱い | 注意点 |
|---|---|---|
| 個人的な参考・閲覧用に保存 | 原則として問題ない範囲 | 外部への公開・配布はNG |
| 自分のサイト・ブログに掲載 | 原則として無断使用はNG | 権利者の許可または引用要件を満たすことが必要 |
| SNSへの投稿・シェア | 原則として無断使用はNG | 公式シェアボタンの利用は問題ない場合が多い |
| 商用資料・印刷物への使用 | 無断使用はNG | 商用利用可のフリー素材サイトの活用を推奨 |
| 著作権フリー・CC0素材 | 条件付きで利用可能 | ライセンスの条件をよく確認すること |
ウェブ制作や資料作成に使う素材を探すなら、Unsplash・Pixabay・ACイラストなど、商用利用可能なフリー素材サイトを利用するのが安全で確実です。
まとめ
ウェブサイトからの画像保存は、基本的な操作から少し踏み込んだ対処法まで、知っておくと場面に応じて使い分けができます。
本記事のポイントを振り返ります。
- PCは右クリック→「画像を保存」が基本。ブラウザによってメニューの文言が若干異なる
- iPhoneは長押し→「写真に追加」、Androidは長押し→「画像をダウンロード」が基本操作
- 右クリックが無効化されている場合は、スクリーンショット・開発者ツール・ページソースからの取得などの代替手段がある
- CSSの背景画像やCanvas描画・動画フレームは通常の方法では保存できないことがある
- 技術的に保存できても、著作権のある画像を無断で外部公開・商用利用することは法律上の問題になりうる
画像の扱いひとつとっても、正しい知識を持っておくことでトラブルを防げます。ホームページ制作や素材の活用でご不明な点があれば、お気軽にご相談ください。
投稿者プロフィール
株式会社デジタルダイブ サービス担当者
1995年に愛知県で創業したホームページ制作会社です。
名古屋をはじめ、東京や大阪を拠点に全国の企業・官公庁の Web サイトを多数手掛け、幅広い分野で制作実績を積み重ねてきました。
創業以来、専門性の高いクリエイティブで信頼を築いています。
また、webデザインをはじめとしたクリエイタースクール「デジタルハリウッドSTUDIO名古屋」を運営しています。
【許認可】
一般社団法人 日本Web協会、日本セイバーメトリクス協会(理事)、愛知県「あいちロボット産業クラスター推進協議会」(無人飛行ロボット活用WG)、JETRO(日本貿易振興機構)、名古屋市 SDGs 推進プラットフォーム 他
【有資格】
愛知県 競争入札参加資格、名古屋市 競争入札参加資格、全国 競争入札参加資格、全省庁 競争入札参加資格 他