お困りのことはありますか?

イメージ画像を使う際のポイント

Webサイトにはメインビジュアルやバナー、アイコンなど、あらゆるところで画像が使われています。このページでは画像利用時のヒントや注意点、フリー素材サイトの紹介など、ホームページで利用する画像について記載します。

Webサイトに最適な画像ファイル

画像ファイルには数多くの拡張子がありますが、最も多く使われるのが、PNG、JPEG(または、JPG)です。一般的にPNGファイルは高画質でロゴや文字画像の入ったビジュアルに多く使われます。PNGは画質が良い一方、ファイルサイズが大きくなってしまい、ネット回線の遅い環境では読み込みに時間がかかります。JPEGはWebに最適な拡張子でPNGほどのクオリティではないですが、高画質の画像を小さな容量で利用することができます。画像の拡張子で困った際は、下記のルールを意識してみてください。

 

  • グラフィックやロゴ画像にはPNGを利用
    ロゴやインフォグラフィックなど、自社のブランドイメージに大きく関わり高画質で表示させることが重要なデータはPNGを利用しましょう。
  • 写真画像はJPEG形式を利用すること
    JPEG形式は高画質でかつサイズも小さいためホームページを閲覧した際の表示も早く、ホームページでの利用に最適です。そのため、ロゴやインフォグラフィック以外の写真データにはJPEGを利用しましょう。

各コンテンツの最大画像サイズと利用可能なフォーマット形式

コンテンツ 画像サイズ  (Pixel) フォーマット
画像 30x30 から 1820 x 10000 png, jpg または gif
画像付き文章 30x30 から 1280 x 1024 png, jpg または gif
フォトギャラリー 30x30 から 1820 x 1280 png, jpg または gif
商品 30x30 から 1280 x 1024 (商品画像を拡大した際のサイズ) png, jpg または gif
背景画像 1600 x 1000 以上 png, jpg または gif
ロゴ

ロゴのサイズはレイアウトによって異なります。

各レイアウトのロゴサイズは こちら からご確認ください

png, jpg または gif

*2016年8月16日現在

アップロード可能な画像の大きさ

アップロードできる画像の大きさはご利用中のプランによって異なります。

  • すべての画像コンテンツ: JimdoFree:10MB / JimdoProおよびJimdoBusiness:100MBまでアップロード可能
  • ロゴ:5MBまでアップロード可能
  • 背景画像:10MBまでアップロード可能

画像には代替テキスト

多くの人が見過ごしがちですが、Webサイトで使われる画像には代替テキストが存在しています。代替テキストは別名Altタグとも呼ばれ、画像を識別しない検索エンジンに対してWebサイトにアップロードされた画像がどんな画像であるかを記す役割があります。SEOに有効です。

 

アップロードした画像に代替テキストを入力するには、タグのアイコンをクリックし、「代替テキスト」と書かれたところにテキストを入力するだけです。

代替テキスト

背景画像の提供

以下の背景画像はCC0ライセンスと呼ばれるもので、自由に利用できます。リンクをクリックすると、リンクのタイトルに関連した背景画像(パターン)が複数含まれたZipファイルがダウンロードされます。各リンクをクリックするとZipファイルがダウンロードされるので、パソコンに保存してご利用ください。あなたのWebサイトに利用できる画像が見つかるかもしれません。

背景画像のダウンロード

無料背景画像一例
背景画像の一例

背景パターンのダウンロード

無料背景パターン一例
背景パターンの一例

写真素材提供サービス

プロの写真素材は有料で購入するものや、無料で提供しているフリー素材サイトがあります。ここでは、無料も含めた高画質の写真画像が利用できるサービスをご紹介します。

フリー素材
フリー素材サイトからダウンロードした写真例

画像を使用される際は、各サービスの利用規約を必ず確認し、利用規約に従いご利用ください。

画像を加工する

画像に文字を入れたり、編集をするには、PhotoshopやIllustratorのようなデザインソフトが有名ですが、ソフト購入にはお金がかかります。無料で画像を加工できるソフトをご紹介します。

写真以外の画像をアップする

Jimdoでは写真だけでなくアイコンやバナーなどの画像もアップロードすることができます。

フリーアイコン、バッジ

アイコンはホームページを訪れた人に伝えたいことを一目で伝えることができるグラフィックとして有効です。ホームページ上のちょっとした誘導にアイコンを活用することで見た人にわかりやすいホームページにすることができます。

フリーアイコン

ロゴ

Jimdoで提供している各レイアウトにはロゴエリアがあり、ホームページにロゴをアップロードすることができます。

ロゴ作成については、自作で作成するのも良いですが、外部のロゴ作成サービスを利用することをオススメします。

プロのデザイナーに手頃な値段でロゴのデザインを依頼できるサービスをご紹介します。

 

99designで制作されたロゴの例
99designで制作されたロゴの例

関連ページ