ホームページ用の写真やイラストを探せる画像配布サイト12選【画像サイズや容量の最適化についても解説】

「自社のイメージを画像でわかりやすく伝えたい」「もっとホームページを華やかにしたい」…なのに、掲載できる写真やイラストがない!そんな悩みをお持ちの方に、今回はおすすめの画像配布サイトを12個と、選んだ画像をホームページに掲載する方法をご紹介します。

その上で、重要な注意点として画像のサイズや容量を最適化する方法についても解説します。

簡単に自分で作れるホームページ作成ソフト
目次
  1. 画像配布サイトって?
  2. 無料の画像配布サイト7選
  3. 有料の画像配布サイト5選
  4. ホームページで写真やイラストを効果的に使うためのポイント
  5. 画像をホームページに載せる方法
  6. 画像を載せるときはサイズや容量に注意すべき
  7. まとめ

画像配布サイトって?

画像配布サイトとは、多種多様な場面で使用できるイメージ写真やイラストなどの画像が揃った素材サイトのことです。
ホームページだけでなく、チラシや資料など、画像が必要になるものを作るときにはとっても役に立ちます。

無料の画像配布サイト7選

この章では、基本的に無料で画像を利用することができ、著作権表示が必要でないサイトをご紹介します。(※2022年1月現在)

イラスト

いらすとや

絵本のようなタッチのかわいいイラストがたくさん配布されています。いろんな場面で使える人物や動物のイラストから、「お漬け物」「ウミガメ」のようなかなりニッチなものまで、多種多様なイラストがあるので見ているだけでも楽しくなります。

たくさんあるので目的のイラストがどこにあるのか迷ってしまうかもしれませんが、検索のコツといったページも用意されているので、参考にしてみてください。

素材を21点以上使った商用デザインの場合は有償になります。

いらすとや

8sukeの人物イラスト屋

人物イラストに特化した画像配布サイトです。配布されている人物イラストはシンプルなので、どんなテンプレートにも馴染みそうです。様々な職種、年齢の人物イラストが配布されています。

※金額が表示されますが、「PNG」データはサイトからそのままダウンロードして利用可能です(ベクターデータは有料です)。

8sukeの人物イラスト屋

ガーリー素材

女性らしい雰囲気のおしゃれなイラストが配布されているので、女性向けのサロンやお店、習い事などのホームページにとてもおすすめです。

人物だけでなく、お花やケーキ、チワワやプードルなど、「かわいい」が連想されるようなアイテムのイラストもあります。

ガーリー素材

写真

ぱくたそ

平日は毎日更新されている写真配布サイトです。おもしろい写真や時事ネタ写真が豊富なので、ブログにも使えそうです。

キャッチーな写真だけでなく、風景や動物、機器類などの写真も高品質なものがたくさん配布されています。

ぱくたそ

photo AC

写真をダウンロードするにはユーザー登録が必要ですが、無料とは思えない高品質な写真を提供しています。

姉妹サイトには、イラストを配布しているイラストACシルエットACがあるので、あわせてチェックしてみてください。

※ダウンロードには会員登録が必要です(photoACの透かしロゴが入っている画像をそのまま使用することはできませんので、ご注意ください)。

photo AC

Pixabay

写真、イラスト、動画などを無料でダウンロードできるサイトです。登録なしでダウンロード可能!

※無料素材の関連画像として「iStock(有料版)」の画像素材が表示されるため、ご注意ください(「無料ダウンロード」と表示されているもののみ無料で使用できます)。

Pixabay

足成

アマチュアカメラマンが撮影した写真を素材として無料で提供しています。

毎日更新されており、掲載数は数千枚と膨大な量の写真が配布されています。ジャンルも風景から人物まで幅広く、困ったときにはまず覗いてみることをおすすめします。

足成

有料の画像配布サイト5選

無料サイトでも素敵な素材を探すことはできますが、有料のサイトを使うとやはり選択肢がグッと広がります

できるだけ費用を抑えたい方は、「全体的には無料のサイトで探しつつ、トップページのメインビジュアルなどの特に重要な画像のみ有料のものを使う」などの方法もありますので、ぜひ検討してみてください。

(有料の素材サイトではイラストと写真の両方が扱われていることが多いため、無料サイトの章と異なりパートは分けずにご紹介します)

Adobe Stock

PhotoshopやIllustratorなどで有名なAdobe社が提供する画像サイトです。もっともメジャーな有料画像配付サイトの一つで、素材の幅が非常に広いです。
また、写真やイラストの他に、動画や音声もダウンロードできます。

2022年1月現在、無料体験として30日間で最大10個のデータを費用無しでダウンロードできるようになっています。

Adobe Stock

PIXTA

PIXTAの最大の特徴は日本人の写真を探しやすい点です。上述のAdobe Stockなどでは被写体が外国人の写真も多いので素材を探す時に少しコツもいりますが、PIXTAであればそういったことを気にする必要はありません。

画像は1枚から購入することもでき値段も550円〜とリーズナブルなので、初心者の方にもおすすめのサイトです。

PIXTA

アフロ

アフロは写真のクオリティが非常に高く、ホームページのメインビジュアルを選ぶ際などに特に活用しやすいです。

質が高い分値段は高めで、1枚1万円〜3万円程度の価格帯のものが多いです。

アフロ

スナップマート

スナップマートの特徴は広告感の薄い写真が充実している点です。自然な雰囲気の写真を掲載したい場合にはピッタリな画像配布サイトです。

価格も1枚330円〜と非常にリーズナブルな設定になっています。

スナップマート

ペイレスイメージズ

ペイレスイメージズでは、1枚数百円〜数千円と比較的安価な値段で高品質の画像素材を購入することができます。

また、無料でダウンロードできる素材も5,000件以上(2022年1月現在)用意されています。

ペイレスイメージズ

ホームページで写真やイラストを効果的に使うためのポイント

この章では、ホームページで写真やイラストを効果的に使うためのポイントについてを解説します。

ターゲット像に近い人物の画像を使う

一つ目のポイントは「ターゲット像に近い人物の画像を使う」です。

こうすることで、ホームページを訪れた人が「これは自分のような人向けのページだ」と認識しやすくなり、内容をしっかり見てもらえる可能性が高くなります

この点は、個人向けのサービスのHPであれば、特に意識せずとも実施している方が多いと思います(例えば、「ホームページで扱っている商品が若い男性向けのものであれば、20代男性の写真を載せる」など)。

一方、法人向けのサービスの場合は、ともすれば実際のターゲットから少し逸れたイメージの画像を選んでしまうケースも中にはあるかと思います。例えば、小規模企業がターゲットなのに、ビジネス感を出すことが先行してしまい、高層ビル群などのビジュアルを掲載してしまうようなケースです。

小規模法人向けのページでそのようにしてしまうと、ターゲット企業が「自分たちよりも大きめの会社向けなのかも」と感じて離脱してしまう恐れがあるので、注意が必要です。

サービス内容を想起しやすい画像を使う

二つ目のポイントは「サービス内容を想起しやすい画像を使う」です。

例えば塾であれば教材や教室、授業イメージなどが考えられるでしょう。やはりテキストのみで説明するよりも、画像が添えられていた方がはるかにイメージがつきやすくなります。

実物を撮影できれば理想的ですが、「自分ではうまく撮れない」「プロのカメラマンに頼む費用を出すのは難しい」という場合は上述した画像配付サイトを使う選択肢もあるので、検討してみてください。

画像をホームページに載せる方法

この章では画像をホームページに載せる方法について解説します。

まずは一般的に方法を説明した上で、「専門的でよくわからないな...」とお感じになった方向けに簡単ホームページ作成ソフトの「とりあえずHP」を使った方法も紹介します。

一般的な方法

まずは一般的なホームページに画像を載せる方法を解説します。

画像をサーバーにアップする

まずはサーバーに画像をアップロードする必要があります。

サーバーとはホームページのデータを置くことができるコンピューターのことです。ホームページをインターネット上で一般公開するには必須のものになります。

まずはあなたのパソコンとサーバー間でデータのやりとりをできるようにする必要があり、そのためにはFTPという仕組みを使います。FTPでデータをサーバーに転送する方法は下記の記事で具体的に解説しているのでご参照いただけると幸いです。

なお、画像をアップロードする場所はサイトによって異なりますが、多くの場合は/images/など画像用のフォルダだとわかる名前がついているので、それを手がかりに探されてみてください。

HTMLを入れる

画像をサーバーにアップロードできたら、それをホームページ上に表示させるために下記のHTMLを書きます。

<img src="画像のURL" width="画像の横幅" height="画像の高さ" alt="画像の説明テキスト">

HTMLの説明は下記の通りです。

<img ... >
画像を表示させるためのHTMLタグです。
src
imgタグで読み込む画像のURLを指定する属性です。
width
画像の横幅を指定する属性です。
height
画像の高さを指定する属性です。
alt
画像を説明する文字列を指定する属性です。通常はHP上に表示されませんが、画像が読み込めなかった際には代わりにaltで指定したテキストが掲載されます。また、スクリーンリーダー(画面を音声化するソフト)はaltのテキストを読み上げます。

とりあえずHPを使う方法

上記でサーバーへのアップロードやHTMLの記述を伴う一般的な方法について解説しましたが、ホームページ制作についての知識が無い方にとってはとっつきづらい内容だったかと思います。

「画像を一つホームページに載せるだけで、こんなに大変だなんて...」とガックリきてしまった方は、ホームページ作成ソフトを検討されるのがよいかもしれません。

ホームページ作成ソフトは、HTMLなどの専門知識が一切なくてもページの作成や編集ができるサービスで、もちろん画像の掲載も簡単におこなえます。

例えば、ホームページ作成ソフトの中でも特に簡単さにこだわった「とりあえずHP」は、イラストや写真を下記のようなジンプルな手順でHPに載せることができます。

とりあえずHPについて詳しく知りたい方は、↓から公式サイトをご覧ください。今なら無料トライアルも実施中です。

簡単に自分で作れるホームページ作成ソフト

画像を載せるときはサイズや容量に注意すべき

ホームページに画像を掲載するときに要注意なのが、大きすぎるサイズ(ピクセル数)や容量(バイト)のままで使わないということです。

なぜなら、大きすぎる画像は読み込みに時間がかかってしまい、せっかくホームページに訪れてくれた人が離脱してしまう可能性が高くなるからです。

まずサイズ(ピクセル数)についてですが、この概念は初心者の方には少しわかりづらく、ちょうどよいサイズで使っているつもりでも実際は大きな画像になってしまっていることも珍しくないため、注意が必要です。

というのも、「ホームページ上での画像の表示サイズ」と「画像そのもののサイズ」は別物なのです。つまり、すごく大きな画像でもHP上の見た目だけ小さくすることが可能で、その場合、実態としては大きな画像を使っているので、読み込みに時間がかかってしまうリスクあります。

そういった状態を避けるために、「画像そのもののサイズ」をちょうどよい状態にしてからホームページに掲載しましょう。

画像のサイズ変換は下記のサイトなどで簡単におこなうことができます。

画像サイズ変更ツール

また、容量(バイト)という概念はさらに専門的で、同じピクセル数の画像でも容量がまったく異なる場合もあります。仕組みについての詳しい説明は割愛しますが、「どうも画像の表示に時間がかかるな」ということがあれば、下記のサイトで容量(バイト)を小さくすることで解決する可能性があるので、試してみてください。

TinyPNG

まとめ

ホームページに掲載できる写真やイラストを用意するのはなかなか難しいですが、この記事でご紹介したような画像配布サイトという便利なサイトがあります。

ぜひ、今回ご紹介した掲載方法や注意点も踏まえつつ、あなたのホームページに画像を上手に掲載して、さらに充実させてみてください!

※今回ご紹介したサービスは他社様のサービスです。注意事項をよくお読みになった上で、お客様ご自身の責任においてご利用下さい。

気軽につくれる、素敵なホームページ「とりあえずHP」

とりあえずHPは、素敵なホームページを気軽につくることができるホームページ作成サービスです。
「メールを送る」程度のパソコンスキルがあれば、驚くほど簡単にホームページを作成することができます。
業種ごとに作り込まれたテンプレートデザインや文章のサンプルもあるので、ホームページづくりにあまり時間が割けない人にもおすすめ。大切な時間をホームページ作成に費やすのではなく、本業に集中させることができます。

無料オンラインサポート実施中

\まずは、どんなサービスか知りたい/

とりあえずHPサービス説明

無料個別相談・申込

\ホームページ制作のプロに個別相談/

とりあえずHP無料個別レッスン

個別レッスンの詳細

PAGE TOP