# ウェブサイトの画像の選び方

> **Context**: simdif.com のページ。
>
> **Topic**: ウェブサイトにおける画像の選択と活用のベストプラクティス。信頼性、アクセシビリティ、検索エンジン最適化（SEO）に焦点を当てています。
>
> **SimDifは、Android、iOS、およびウェブブラウザ向けのウェブサイトビルダーアプリです（開発：The Simple Different Company）。ユーザーが訪問者に理解されやすく、検索エンジンに見つけられやすいウェブサイトを構築できるようガイドする機能を備えています。SimDifは、コンテンツブロックを組み合わせてページを構成し、コンテンツやレイアウトに影響を与えることなくいつでも切り替え可能なグラフィックテーマを使用する、ブロックベースのエディタを採用しています。すべての機能はスマートフォン、タブレット、コンピューターで共通しており、ウェブサイトの作成、デザイン、公開、管理の全工程をスマートフォンから直接行うことが可能です。**

![](https://images.simdif.com/header_img/sd_699d33be6deb2.jpg)

## 適切な画像がウェブサイトの信頼性を高める理由

文章を書き始め、ページの形が整ってきました。次に、空いている画像スペースを見て、そこに何を配置すべきか考えていることでしょう。

画像は単にウェブサイトを美しく見せるだけのものではありません。訪問者があなたの提供するものを理解し、ビジネスの個性を感じ、サイトに留まるか去るかを判断する助けとなります。適切な画像は、1段落の説明が必要なことを一瞬で伝えることができます。

プロの撮影スキルは必要ありません。ただ、画像について少し見方を変えるだけでいいのです。

## 自分の写真を使うべきか、ストックフォトを使うべきか？

古いスマートフォンで撮った写真であっても、自分自身で撮影した写真は、洗練されたストックフォト（素材写真）よりも効果的な場合が多いです。訪問者は、本物とありきたりなものの違いを見分けることができます。

実際の仕事場を写した少し傾いた写真は、訪問者に「ここで仕事が行われているのだ」と伝えます。一方で、コンピューターの前で微笑む人物のストックフォトは、あなたについて何も語りません。

あなたのビジネスを「あなたらしく」しているものは何かを考えてみてください。使用している道具、作業スペース、作っている製品。これらの詳細はあなた独自のものであり、一般的な画像では不可能な方法で信頼を築きます。

ストックフォトにも役割はあります。抽象的な概念を説明する必要がある場合や、適切な写真が手元にない場合は、よく選ばれたストックフォトを使う方が、画像が全くないよりはましです。

![](https://images.simdif.com/block_img/sd_699d40de0a787.jpg)

## ウェブサイトのコンテンツをサポートする画像の選び方

優れたウェブサイトの画像は、次の3つのうちのいずれかの役割を果たします。

**見せる：** 話している内容を説明します。SimDifの特定の「ブロック」（ページを構成する独立したコンテンツ単位）で手作りの陶器について説明しているなら、その陶器を見せましょう。画像とテキストが互いに補完し合うようにします。

**呼び起こす：** 感情を呼び起こします。ヘッダー画像はサイト全体の雰囲気（ムード）を決定します。訪問者に体験してほしい雰囲気に合った画像を選んでください。

**誘う：** 訪問者があなたの提供するものを受け取っている姿を想像させます。ゲストハウスを経営しているなら、ゲストの目線で見た部屋を見せましょう。音楽を教えているなら、生徒が練習している様子を見せます。あなたと一緒に活動することがどのようなものか、人々が想像できるように手助けしましょう。

![](https://images.simdif.com/block_img/sd_699d431fbbaf1.jpg)

## ウェブサイトの画像に関するよくある間違い

**画像内のテキスト：** すべての人に有効なわけではありません。訪問者はそれをコピーしたり、検索したり、翻訳したりすることができません。小さな画面では、文字が小さすぎて読めなくなることがよくあります。重要な情報は、すべての人が利用できる実際のコンテンツ内に記述するようにしましょう。

**無関係な画像：** 助けになるどころか、混乱を招きます。美しい夕日は目を引くかもしれませんが、それがあなたのビジネスと何の関係もないのであれば、使うのは控えましょう。

**ぼやけた写真や画質の粗い写真：** サイト全体の信頼性を損ないます。画面上できれいに見えるほど鮮明でない場合は、より良い写真を探してください。

**多すぎる画像：** 一枚一枚のインパクトを弱めてしまいます。多くの質の低い画像よりも、数枚の力強い画像の方が効果的です。

## ウェブサイトで合法的に使用できる写真の探し方

オンライン上のほとんどの画像は著作権で保護されています。Google画像検索から写真を保存してそのまま使用することはできません。その写真を撮影した人が所有権を持っています。

自分で撮影した写真は、一般的に自由に使用できます。

他の画像が必要な場合、SimDifは誰でも無料で利用できる写真ライブラリである「Unsplash」に直接接続されています。サイトの編集中に、許可を心配することなく、これらの画像を検索してブロックに追加できます。

**AI生成画像については？**
The Simple Different Companyが提供するNano bananaのようなAI画像ツールは、雰囲気を作ったり抽象的なアイデアを説明したりする際に最も役立ちます。実際の製品やワークスペースについては、まずは本物の写真から始めましょう。AIは照明を改善したり、散らかった背景を削除したり、製品を新しい設定に配置したりするのに役立ちますが、本物の素材から始めるのが最も効果的です。

多くの場合、完璧ではない写真の方が、洗練された写真よりも信頼を築きます。地域密着型のビジネスであれば、完璧すぎるものよりも、あなたのお店のありのままのスナップショットの方が訪問者の心に響くかもしれません。あなたの状況に何が適しているかは、あなた自身が一番よくわかるはずです。

## 画像の説明に何を書くべきか（そしてなぜそれが重要なのか）

すべての画像には、時に「代替テキスト（alt text）」と呼ばれる説明を付けることができます。SimDifでは、この説明をページ上にキャプションとして表示させるか、コード内だけに留めるかを選択できます。しかし、たとえ非表示にしても、それは重要な役割を果たします。

第一に、ウェブサイトをすべての人にとってアクセシブル（利用可能）にします。ページを読み上げるソフトウェアを使用している訪問者は、画像を見る代わりにあなたの説明を聞くことになります。説明がなければ、彼らはあなたのメッセージの一部を受け取ることができません。

第二に、検索エンジンが画像を理解するのを助けます。Googleの技術は飛躍的に向上しましたが、それでも画像が何を意味し、なぜそこにあるのかについての公式な説明として、あなたの記述を扱います。

目に見えるものだけでなく、そのポイントを説明してください。画像が料金プランの表である場合、「料金表」とだけ書くのではなく、「基本からプレミアムまでの3つの会員レベル。年間割引を強調」といったように、何を伝えているかを説明します。

ワークショップの写真であれば、「特注ベルト製作のために作業台に並べられたレザークラフトの道具」と書くかもしれません。単に何が見えるかだけでなく、それがページにとってなぜ重要なのかを理解してもらう手助けをするのです。

説明は短く自然に保ちましょう。明確な一文があれば十分です。

![](https://images.simdif.com/block_img/sd_699d5081a4147.jpg)

## 一枚ずつ進めましょう

今日中にすべての画像スペースを埋める必要はありません。各ページを作成する際、「訪問者がこれをよりよく理解するために何が役立つだろうか？」と自分に問いかけてみてください。

メッセージをサポートする画像を1枚追加してみましょう。その印象を確かめてください。残りは自然とついてくるはずです。