# 写真、文字、色の選び方

視覚表現は認識と読みやすさを支えるものです。利用権と十分なコントラストを確認します。 カフェは温かな写真と読みやすい文字のメニューを組み合わせられます。 許諾済み写真でも存在しない店舗を示すと誤解を招きます。

## 視覚を一つの仕組みとして考える

写真、文字、色は、それぞれ美しいだけでなく協力する必要があります。実際の内容と、丁寧な専門性、親しみやすさ、作品中心などの表現から役割を決めます。見出しと本文、操作と装飾が区別できる構成にします。

主要な書体は絞り、長い原稿で試します。二つ目の書体が有用でも、各言語の文字と読みやすさを確認してください。英語の見本だけで日本語やアラビア語の対応を判断しません。

背景、面、文字、境界、行動の色を決め、実際の組み合わせを見ます。明るいブランド色はアクセントに良くても、小さい白文字の背景に適するとは限りません。フォーカスやエラーも確認します。

## 写真の権利と意味を確かめる

出所、作者、許可、必要なクレジットを保存します。検索で見つかることは使用許可ではありません。次の管理者が再調査せず扱えるよう、納品資料にも残します。

権利だけでなく印象も重要です。一般の事務所写真が自社の場所、集合写真がスタッフに見えることがあります。内容を正直に表し、概念の画像には必要な文脈を与えます。

バナー、作品見本、製品詳細では必要なサイズが違います。重要部分を保つ切り抜きと圧縮を確認し、寸法を予約して読み込み時の移動を防ぎます。代替文は文脈上の情報を伝え、装飾を無意味に読み上げさせないようにします。

## 実際のページへ適用する

カフェは温かい写真と平易な文字メニューを組み合わせられます。時間と住所は画像の中だけに閉じ込めません。建築作品では大きな写真が適しても、説明と担当範囲は読みやすく残します。

最長の見出し、二行のボタン、細い画面、翻訳を試します。画像が読み込めないときにも、サービス名と連絡行動が残るかを確認してください。必要情報が写真頼みでは不十分です。

色、文字の役割、余白、画像比率、許可記録の場所を小さな規則として残します。画像を選ぶ人が目的を知っている間に、なぜ使うかも記録します。

目的は区画ごとの派手な変化ではなく、後の更新でも情報を理解しやすい一貫性です。最初の短い見本だけでなく、新しい実内容を支えられる視覚の仕組みを作りましょう。

## 実務の確認項目

- 許諾を保管する
- 長い見出しを試す
- 明暗差を確認する

**具体例:** カフェは温かな写真と読みやすい文字のメニューを組み合わせられます。

**守りたい範囲:** 許諾済み写真でも存在しない店舗を示すと誤解を招きます。

## 次の一歩

[Orvunwebにプロジェクトを相談する](/ja/制作相談/)

## 関連する記事

- [テンプレートと事業に合わせたデザイン](/ja/ブログ/テンプレートと事業に合わせたデザイン/)
- [Web用画像の準備](/ja/ブログ/web用画像の準備/)
- [建築ポートフォリオの見せ方](/ja/ブログ/建築ポートフォリオの見せ方/)
- [企業サイト制作](/ja/サービス/事業紹介サイト/)
- [プランを比較する](/ja/料金/)


## 関連サービス

- [事業紹介サイト](/ja/サービス/事業紹介サイト/)

---

Locale: ja
Canonical: https://orvunweb.com/ja/ブログ/写真-文字-色の選び方/
Updated: 2026-09-16


- [W3C WAI — Images](https://www.w3.org/WAI/tutorials/images/)