ブログ画像の基本|サイズ・フリー素材・引用ルールを解説

当ページのリンクには広告が含まれています。
ブログ画像の基本|サイズ・フリー素材・引用ルールを解説

記事に画像を入れたいけど、サイズはどれくらいが正解?フリー素材はどこで探せばいいの?あと、他のサイトの画像や文章って使ったらダメなのかな…。引用の書き方も分からない。

といった悩みにお答えします。

本記事の内容

  • ブログに画像を入れる意味と適切な枚数
  • ブログ画像の最適なサイズと容量
  • ブログで使えるフリー素材サイトと注意点
  • 他サイトの画像・文章を使うときの引用ルール
  • ブログの図解の作り方の基本
  • ブログ画像をAIで作る方法【プロンプト付き】
  • ブログ画像の設定で忘れがちな3つ
  • ブログの画像についてよくある質問

本記事の信頼性

この記事を書いている僕はブログ歴7年。「AIに仕事を奪われる!?」という危機感を抱いて、AIを必死に学びAIを使ったライター業務やブログなどの副業で月10万円を達成。現在はClaude Codeで業務効率化や会社の仕組みを作って、AIを活用した事業を行っています。この経験をもとに、AIに関する情報やノウハウを発信しています。

結論から言うと、ブログ画像は「横1,200px前後・200KB以下・H2ごとに1枚」が実務の目安です。

そして他サイトの画像は、引用の要件を満たさない限り使ってはいけません。

この記事では、500記事分の画像を扱ってきた僕が、サイズ・フリー素材・引用ルール・図解まで、画像まわりの実務を1本にまとめて解説します。

読み終わるころには、画像のたびに検索して回る状態から卒業して、迷わず記事に画像を入れられるようになっているはずです。

りょうた

画像のルールは一度覚えたら一生モノです。この記事をブックマークして、画像で迷ったら戻ってくる使い方をしてくださいね。

目次

ブログに画像を入れる意味と適切な枚数

ブログに画像を入れる意味と適切な枚数

まず前提として、ブログに画像を入れる目的は「飾り」ではありません。

役割は3つあります。

  • 文章の塊を分割して、スマホでの読み疲れを防ぐ
  • 図解で理解を助ける
  • アイキャッチとして検索結果やSNSでクリックを誘う

適切な枚数の目安は、H2見出しごとに1枚です。

5,000字の記事なら5〜8枚ほどです。

それ以上入れても効果は薄く、ページが重くなるデメリットのほうが大きくなります。

「とりあえずおしゃれな写真を挟む」より、「説明が難しい箇所に図解を1枚」のほうが読者の役に立ちます。

枚数より配置で考えましょう。

なお、記事の顔になるアイキャッチ画像だけは全記事必須です。

検索結果・SNS・記事一覧のあらゆる場所で表示されるので、ここだけは省略しないでください。

ブログ画像の最適なサイズと容量

ブログ画像の最適なサイズと容量

WordPressでの実務的な目安はこの表のとおりです。

項目目安
横幅1,200px前後
アイキャッチ比率16:9(1200×630pxなど)
1枚の容量200KB以下
形式JPEGまたはWebP(写真系)、PNG(図解・スクショ)

サイズより「容量」が大事

初心者が見落としがちなのは、ピクセル数より容量(KB)です。

スマホで撮った写真は数MBあり、そのままアップするとページの表示が一気に遅くなります。

表示速度は読者の離脱とSEOに直結するので、アップ前に圧縮するのを習慣にしてください。

無料の圧縮サイトに通すだけで、見た目の劣化なく容量が数分の1になります。

体感で言うと、圧縮なしの画像を10枚並べた記事と、圧縮済みの記事では、スマホでの表示の「もたつき」がはっきり違います。

読者は待ってくれません。

WordPressなら圧縮は自動化できる

毎回手動で圧縮するのが面倒なら、アップロード時に自動圧縮するプラグインを1つ入れておく方法もあります。

最初に仕組み化しておくと、以降は何も考えなくてよくなりますよ。

ブログで使えるフリー素材サイトと注意点

ブログで使えるフリー素材サイトと注意点

「画像はどこで手に入れるの?」の答えは、フリー素材サイトと自作の2択です。

まずはフリー素材からいきましょう。

定番のフリー素材サイト

写真なら「写真AC」「Unsplash」「O-DAN」、イラストなら「いらすとや」「ソコスト」「Loose Drawing」あたりが定番です。

どれも無料で商用利用できる素材が見つかります。

大事なのは、有名サイトでも素材ごとに利用条件が違うことです。

ダウンロード前に「商用利用の可否」「クレジット表記の要否」の2点だけ確認する癖をつけてください。

サイト選びで迷ったら、まず写真1つ・イラスト1つの計2サイトをブックマークして固定するのがおすすめです。

毎回探し回るより、いつもの2ヶ所から選ぶほうが記事のテイストも揃います。

フリー素材の注意点3つ

  • 「フリー=著作権放棄」ではない。利用規約の範囲内で使える、という意味
  • 人物写真は肖像権・モデルリリースの記載を確認する
  • 「無料ダウンロード」をうたう海賊版サイトには近寄らない

この3つを守れば、フリー素材でトラブルになることはまずありません。

他サイトの画像・文章を使うときの引用ルール

他サイトの画像・文章を使うときの引用ルール

ここが一番大事な章です。他サイトの画像や文章は、原則として無断で使えません。

使えるのは、著作権法の「引用」の要件を満たす場合だけです。

引用が認められる主な条件

一般に、引用として認められるには次の条件を満たす必要があるとされています。

  • 自分の文章が「主」、引用部分が「従」であること
  • 引用部分が本文と明確に区別されていること(引用ブロックなど)
  • その引用を使う必然性があること
  • 出典(サイト名・URL・著者など)を明記すること
  • 改変せず、そのまま使うこと

逆に言うと、「本文の穴埋めに他サイトの画像を貼る」「見栄えのためにアニメの画像を使う」は引用にならず、著作権侵害になり得ます。

※法律の適用は個別のケースで異なります。判断に迷う場合は文化庁の公開情報や専門家の解説を確認してください。

引用の書き方の実例

WordPressなら「引用ブロック」を使って、こう書きます。

引用したい文章をここに入れる

出典:サイト名「記事タイトル」(URL)

画像を引用する場合も同じで、画像の直下に出典を明記します。スクリーンショットを使うときも、サービス名と出典を添えるのが基本マナーです。

迷ったら「引用しない」が正解

実務的な結論を言うと、初心者のうちは引用に頼らない記事づくりをおすすめします。

フリー素材と自作図解だけで、記事は十分成立するからです。

引用が本当に必要なのは、公的データや公式発表を根拠として示すときくらいです。「便利だから使う」ではなく「必要だから使う」の感覚でいきましょう。

僕も500記事書いてきて、引用が必要だった場面は数えるほどしかありません。

それくらい、フリー素材と自作で完結できるものなんです。

りょうた

著作権は「知らなかった」が通用しない世界です。でも、今日この章を読んだあなたは、9割のトラブルを回避できるはずです。

ブログの図解の作り方の基本

ブログの図解の作り方の基本

フリー素材より記事の価値を上げるのが、自作の図解です。

難しく考える必要はなく、基本は3つだけです。

  • 1枚の図解で伝えることは1つに絞る
  • 色は記事のテーマカラーに合わせて2〜3色
  • 文字は大きく、要素は少なく

無料のデザインツール(Canvaなど)にはブログ用のテンプレートが揃っているので、ゼロから作る必要はありません。

「比較」「手順」「構造」の3パターンのテンプレを持っておくと、大半の記事に対応できます。

図解が1枚あるだけで、記事のオリジナリティも滞在時間も変わります。

フリー素材は他のブログと被りますが、自作図解は世界に1枚だけの画像です。

検索エンジンから見たオリジナリティにも貢献します。

全記事でなくていいので、「ここは文章だけだと伝わりにくいな」という箇所から試してみてください。

プロフィール用のアイコン画像も、同じノリで自作できます。

作り方はブログアイコンの作り方をどうぞ。

ブログ画像をAIで作る方法【プロンプト付き】

ブログ画像をAIで作る方法【プロンプト付き】

フリー素材の弱点は「他のブログと被る」ことです。

それを解決するもう1つの選択肢が、AIでの画像生成です。

当ブログのアイキャッチや挿絵も、AI生成を取り入れています。

記事の文章づくりはClaude推しの当ブログですが、画像生成に関してはChatGPTが手軽です。

無料プランでも枚数制限つきで試せます。

コピペで使えるブログ画像の生成プロンプト

以下をコピーして、(例:〜)の部分を自分の記事に合わせて書き換えて送ってください。

ブログ記事の挿絵用の画像を1枚作ってください。

【記事の内容】
・記事のテーマ:(例:初心者向けのブログの始め方)
・この画像で伝えたいこと:(例:パソコンでブログを書き始めるワクワク感)

【画像の条件】
・横長(16:9)
・テイスト:(例:シンプルなフラットイラスト)
・メインの色:(例:青系)+背景は白
・文字やロゴは絶対に入れない
・実在の人物・キャラクター・ブランドに似せることは絶対にしない

1回で理想の画像が出なくても大丈夫です。

「もっと色を薄く」「人物を右側に寄せて」のように、続けて日本語で注文すれば調整できます。

3案ほど出させて選ぶ使い方も便利ですよ。

AI画像で失敗しないコツ3つ

①禁止事項は「絶対に」を付けて強く書く

AIは「入れないで」のような弱い否定を無視することがあります。プロンプト例に「絶対に」と入れているのはこのためで、当ブログの運用でも失敗が目に見えて減りました。

②文字入れはAIにやらせない

AI生成の弱点は、日本語の文字が崩れやすいところです。画像内にタイトルなどを入れたい場合は、AIには文字なしの背景だけ作らせて、文字はCanvaなどで後から乗せるのがきれいに仕上がります。

③生成後のルールは通常の画像と同じ

生成した画像も、この記事で解説した「横1,200px前後・200KB以下・alt記入」のルールをそのまま適用します。商用利用の規約と、実在の人物・キャラに似せない原則は、よくある質問のQ7も参考にしてください。

ChatGPTをまだ使ったことがない方は、【初心者向け】ChatGPTの始め方を超わかりやすく解説!から5分で準備できます。

りょうた

フリー素材サイトで1時間さまよった挙げ句、しっくり来ない…という日は、AIに3案出させて選ぶほうが早いです。素材探しの時間も、立派な時短の対象ですよ。

ブログ画像の設定で忘れがちな3つ

ブログ画像の設定で忘れがちな3つ

画像を挿入するときにセットでやるべき設定を3つ紹介します。

①alt属性(代替テキスト)を入れる

altは「画像の内容を説明する文字」のことです。

画像が表示されない環境や音声読み上げで使われるほか、Googleに画像の内容を伝えるSEOの役割もあります。

「ブログ画像の最適なサイズの目安表」のように、画像の中身をそのまま短く書けばOKです。

②アップ前に圧縮する

前述のとおり、容量200KB以下を目安に圧縮します。

自動化プラグインを入れているなら不要な作業です。

③ファイル名を英語にする

「スクリーンショット2026-07-27.png」のような日本語ファイル名は、文字化けの原因になります。

「blog-image-size.png」のように、内容が分かる英語にしておくのが安全です。

3つとも1枚あたり30秒の作業ですが、あとからまとめて直すのは大仕事になります。

100記事分のaltを後付けする作業を想像してみてください。ゾッとしますよね。

最初から習慣にしてしまいましょう。

ブログの画像についてよくある質問

ブログの画像についてよくある質問

最後に、ブログの画像についてよくある質問にお答えしていきます。

画像なしのブログ記事はダメですか?

ダメではありませんが、スマホでの読みやすさで不利になります。

最低でもアイキャッチ1枚と、長いセクションの区切りに数枚は入れるのがおすすめです。

WordPressの画像サイズ設定はどうすればいいですか?

テーマ側が表示サイズを自動調整してくれるので、アップする元画像を「横1,200px前後・200KB以下」に整えることに集中すればOKです。

細かい設定はテーマの標準のままで問題ありません。

スマホで撮った写真をそのまま使ってもいいですか?

サイズと容量を落とせば使えます。

ただし位置情報(Exif)が含まれる場合があるので、自宅などが特定されないよう、アップ前に削除される設定・ツールを確認しておくと安心です。

なおWordPress側で自動削除されるケースも多いですが、過信せず一度確認しておきましょう。

芸能人やアニメの画像を使いたいのですが

やめてください。

肖像権・著作権の侵害になり、引用の要件も満たしにくい典型例です。

どうしても必要なら、公式が配布している素材や埋め込み機能を使いましょう。

参考文献はどう書けばいいですか?

文章の引用と同じで、「著者名・サイト名や書籍名・記事タイトル・URL(書籍なら出版社)」を明記します。

記事末尾にまとめる形でも、引用箇所の直下に書く形でもOKです。

X(旧Twitter)の投稿は載せていいですか?

公式の埋め込み機能を使えば問題ありません。

スクリーンショットを撮って画像として貼る方法は、規約・著作権の両面でリスクがあるため避けてください。

AIで生成した画像は使えますか?

hし、使えます。

当ブログでもAI生成画像を活用しています。

ただし生成ツールごとに商用利用の規約が違うので、使っているツールの利用規約だけ確認してください。

実在の人物やキャラクターに似せた生成は避けるのが原則です。

まとめ:ブログ画像は「目安とルール」を覚えれば迷わない

まとめ:ブログ画像は「目安とルール」を覚えれば迷わない

今回は、ブログ画像の実務を解説しました。

最後にポイントを振り返ります。

✅ 画像はH2ごとに1枚が目安。枚数より配置で考える
✅ サイズは横1,200px前後・容量200KB以下・圧縮を習慣に
✅ フリー素材は利用条件を2点(商用可否・クレジット)だけ確認
✅ 他サイトの画像は引用要件を満たす場合のみ。迷ったら使わない
✅ 被らない画像がほしければAI生成。禁止事項は「絶対に」を付けて指示
✅ alt・圧縮・英語ファイル名の3点セットを最初から習慣化

画像まわりの迷いが消えると、記事づくりのスピードは確実に上がります。

ルールは今日覚えた分で十分です。

あとは書きながら体に馴染ませていきましょう。

りょうた

画像は記事の「化粧」ではなく「案内板」です。読者が迷わないための1枚を置く意識で選ぶと、センスがなくても伝わるブログになりますよ。

次にやること
  • 圧縮ツール(またはプラグイン)を1つ決める
  • フリー素材サイトを2つブックマークする
  • プロンプトをコピペしてAI画像を1枚試してみる
  • 次の記事から「H2ごとに1枚・図解1枚」を試す
よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

ブログ歴7年の40代、2児の父です。AIアノテーター、Webライター、コミュニティコンサルタントとして活動しています。最近はClaude Codeで業務効率化・自動化がメインです。主に使っているAIはClaude、ChatGPT、Manusです。AIは今始めることが先行者だと思うので皆さんのためになる記事を心がけて当ブログを運営しています。

目次