アート・写真

Philippe Reynaud

写真家にとって最良のデザインとは、目に見えないデザインです。

年
2026
制作期間
2週間
技術スタック
React · Vite · Tailwind · Vercel
  • デザイン
  • 開発
  • SEO
https://www.philippe-reynaud.fr/
Philippe ReynaudのWebサイトのトップページ――アート・写真、Kayzen Web制作
つのフォントファミリー
1
アクセントカラー
0
Lighthouse SEO
100/100
出発点

解決すべき課題。

背景

Philippe Reynaudは、ファインアートの写真家です。モノクロのプリント、展覧会、オリジナル作品の販売を手がけています。

制約

写真家のポートフォリオは、デザインが消えなければならない唯一の種類のサイトです。あらゆる色、主張の強いタイポグラフィ、あらゆる効果が画像と競合します。そして売れるのは画像なのです。

解決策

骨組みだけにそぎ落としたインターフェース。ニュートラルグレー、控えめなタイポグラフィ、最小限のナビゲーション。プリントはニュートラルな背景の上に大きく表示し、用紙、サイズ、エディションといったプリントの仕様を添えています。販売はカートではなく、お問い合わせとして扱っています。

自己申告ではなく、計測値

納品時に計測したスコア。

本番環境のサイトのLighthouseスコアです。数値はそのまま公開しています。低いスコアがあれば、その原因と改善計画を下に記載しており、伏せることはしません。

PageSpeed
89
パフォーマンス:100点中89点
88
アクセシビリティ:100点中88点
100
ベストプラクティス:100点中100点
100
SEO:100点中100点
デザイン・アートディレクション

すべての判断に、理由がある。

  1. 完全なニュートラルグレー

    画像のまわりに色味は一切ありません。わずかに暖色や寒色に寄った背景でも、モノクロプリントの見え方は変わってしまいます。ファインアートの写真家にとって、それは致命的です。

  2. 存在を消したタイポグラフィ

    フォントファミリーはひとつ、サイズは2つ、ウェイトはミディアムまで。作品タイトルは控えめにし、画像の上ではなく下に置いています。

  3. プリントの仕様を表示

    用紙、サイズ、エディション番号。アートプリントの購入者は、画像と同じくらいモノとしての作品を買っています。これらの情報は作品の一部です。

プロジェクトのカラーパレット

  • グレー950

    #111111

    テキスト

  • グレー100

    #F2F2F2

    ギャラリーの背景

  • グレー500

    #7A7A7A

    補助的なラベル

  • ホワイト

    #FFFFFF

    ページの面

タイポグラフィ体系

見出し用書体

Inter 500

本文用書体

Inter 400

フォントファミリーはひとつだけで、太いウェイトは使いません。ポートフォリオにおいて、タイポグラフィは奉仕するものであり、署名ではありません。

エンジニアリング

その裏側にある技術。

  • React
  • Vite
  • Tailwind
  • Vercel
  1. 必要十分な解像度の画像

    各プリントは、実際に表示されるサイズで、モダンなフォーマットで配信しています。写真のサイトでは再現品質こそが商品です。圧縮不足もばかげていますが、過剰なデータ量も同じです。

  2. 特定済みのアクセシビリティ課題

    スコアは88です。一部の補助的なラベルのコントラストが基準を下回っており、タイポグラフィを控えめにするという方針の直接の結果です。修正方法は特定済みで、見た目の上で実質的な妥協は伴いません。

SEO対策

検索で見つけてもらうための仕組み。

  1. 作家名とシリーズ名

    作家の名前が主要なクエリで、シリーズや展覧会のタイトルがそれに続きます。アーティストのポートフォリオは、汎用的なキーワードではなく固有名詞で検索されるものです。

  2. VisualArtworkのマークアップ

    各プリントに、種類、作者、サイズを記述しています。作品に期待されるマークアップであり、画像検索にも情報を提供します。

サイト構成

納品したもの。

  • トップ
  • シリーズ
  • 販売中のプリント
  • 展覧会
  • 経歴
  • お問い合わせ
進め方

プロジェクトの流れ。

  1. 基本方針

    画像のためにデザインの存在を消す。

  2. デザイン

    ニュートラルグレー、単一のタイポグラフィ、プリント情報。

  3. 開発

    必要十分な解像度の画像、モダンなフォーマット。

Q&A

よくいただくご質問。

プリントの情報も、経歴も、明確な連絡先もないなら、内容が乏しすぎるということはあり得ます。しかし、視覚的に控えめすぎるということはあり得ません。画像の外に目を引くものはすべて、販売の妨げになります。

同じ水準のこだわりを、あなたのサイトにも。

現在のサイトの無料診断、24時間以内のお見積もり、そして今お読みいただいたような書面での解説をお届けします。3回分割払い(手数料無料)に対応し、利用できる地域の補助金は契約前に確認します。

共有