業種別ホームページカラーガイド（全12回）

【医療のイメージカラー】病院・福祉・介護で使える優しい配色一覧

病院・福祉・介護のイメージにピッタリの配色について解説します。多く使われるのは、緑から青の爽やかな色、ピンクやベージュといった優しい色、明るくカラフルな色。鮮やかすぎる色や血液・痛みを連想させる赤は避け、カラフルにしたい場合には一部にとどめるようにします。また、黄色・オレンジを使う場合には読みにくくならないように注意することが大切です。

坂本邦夫（フォルトゥナ） 2017/2/10 7:00 Web担当者／仕事 | 解説／ノウハウ

78 39 10

※「はじめてWEB」は2020年10月13日をもってサービスを終了しました。

このコラムでは、業種ごとに「合う色と合わない色」「注意すべきこと」をまとめています。

毎回、異なる業種を取り上げて解説しますが、それらの業種でよく使われる色やたびたび見られる失敗があり、それにはきちんとした理由があります。それに加え、ホームページの色は、看板や紙のパンフレットと同じ色の場合であっても、画面の構成や使い方のポイントも異なります。

第2回目は病院・福祉施設・介護用品のホームページの配色です。

病院・福祉施設・介護用品でよく使われている色

病院・福祉施設のような人の支えになるサービスのホームページでは、主に3つの系統の色が使われています。

緑から青にかけての爽やかな色
ベージュやピンクなどの優しい色
明るめのカラフルな色

病院・福祉施設・介護用品などで多く見られる色

最も多いのが1の緑・青緑・青に掛けての明るい色です。大学病院や総合病院では少し暗めのしっかりした色も多く見られますが、中小規模の病院では明るい色が多いようです。色は原色のような鮮やかな色は少なく、やや薄い感じの色が多く、見る人に圧迫感や痛みのようなマイナスイメージを感じさせないように配慮されています。

2はベージュやピンクなどの柔らかく優しい色のグループです。1のグループと違う点は暖かく感じられる暖色を使っている点です。病院に喜んで行く人はあまりいませんし、行きにくい場所であることに間違いはありません。出来るだけその心理的な障壁を下げられるように、優しい色を使っていることがわかります。福祉関係の施設やサービス、美容クリニックなどのページでは、青や青緑よりもベージュやピンクが多く見られます。

3の明るめでカラフルな色は、小児科の病院や歯医者など、特に医療色を出したくないホームページで多く見られ、メニューやイラストなどをカラフルにしていることが多くなっています。それに加え、総合病院などの比較的大きな施設でもカラフルな色使いが使われています。これはページ全体をカラフルにするのではなく、全体のイメージは1で爽やかなイメージを作り、各診療科やアクセスなどのそれぞれのメニューを色分けして使っているところが見られます。このタイプでは全体的に明るい色のトーンが使われていますが、紫色はほとんど見られません。

また強めの赤が使われているところは、赤十字社関係の病院を除いてはあまり見られず、使われていてもごく小さく使われています。これは病院と赤という組み合わせはどうしても血液のイメージが出てしまい、痛そうに感じられたりするため、基本的に避けられているからです。

赤を大きく使うと、血のような痛々しいイメージになるので避ける

赤い十字は病院や薬局などのイメージがあるかもしれませんが、けしてそうではなく「赤十字の標章及び名称等の使用の制限に関する法律」で、「白地に赤十字、赤新月若しくは赤のライオン及び太陽の標章若しくは赤十字、ジュネーブ十字、赤新月若しくは赤のライオン及び太陽の名称又はこれらに類似する記章若しくは名称は、みだりにこれを用いてはならない。」と規定されています。この法律には罰則もありますので、病院のホームページに気軽に赤い十字を使わないようにしましょう。

病院のホームページを作る人は、以下の記事も読んでおくとよいでしょう。

Web担当者Forum「デザインに赤い十字（+）を使うと法律違反って知ってましたか？」

色の使い方と配色のポイント

緑から青にかけての爽やかな色

このタイプの配色は、まずロゴが左上にあり、ナビゲーションやボタンなどのそれぞれのパーツに同じ緑から青に掛けての濃淡が使われています。大きな画像としては、病院の外観や内観などのスライドショーが入り、その中にキャッチコピーが入っているのが主流です。

ロゴ＋写真＋もう1色という組み合わせでシンプルなホームページに

全体的にシンプルなデザインで、余計な色を使わないことで文章や内容が伝わりやすくなります。背景色なども使わずに清潔感のあるデザインにしたい場合の、一番オーソドックスな配色です。ロゴの色がホームページのイメージと全然違うという場合でも、別の1色の方が分量が大きくなるため、ロゴのイメージを気にしなくてもよくなります。

ベージュやピンクなどの優しい色

子供を対象にした病院や老人ホーム・介護用品の販売などには、このタイプの配色も多く使われます。写真やイラストも柔らかい色や自然の色が入ったものが多く使われるため、全体的に穏やかなイメージになります。また背景に薄いベージュやオレンジなどを敷くことでも、優しいイメージにすることが出来ます。

1のように青や緑を使いたいという場合にも、背景に色を足すだけで柔らかい印象が出るため、青の冷たさを緩和させることができます。

少しでも背景に薄い色を敷いて、暖かい感じを出した例

注意点としては、優しい印象を出そうとして、文字の色なども優しくなりすぎてしまい、見出しなどが読みにくくなっているものが多く見られます。病院や福祉系のホームページを見ている人は、「現在、体調が悪い」人も多いため、読みにくいことでストレスを与えたり、無用の負担を強いることは避けたいものです。

色が優しすぎて読みにくい見出しの例

明るめでカラフルな色

明るくカラフルな色を使いたいのであれば、見える部分全体に様々な色を使うのではなく、画面のどこか一部分を決めて、その部分のみに多くの色を使う方が効果的です。

例えばメイン画像のイラストにカラフルなものを使ってみたり、メイン画像の下に配置する各ページへのメニューだけをカラフルにするなどが考えられます。多くの色を使う場合には、あまりちぐはぐな思いつきの色を使わずに、トーンを揃えて色を使うようにしましょう。トーンについては、「0からスタートホームページ配色入門第6回：誰でもできる色の整理方法^{※「はじめてWEB」は
サービスを終了しました}」に、「似たような情報をトーン（色調）を使ってまとめる」という部分がありますので、そちらをご覧ください。

トーンを揃えた色で、メニューだけをカラフルにする

もう1つ注意したいのは、カラフルにした部分に文字が重なる場合の色です。文字を白くするか黒くするかによって、文字が読みにくい場合が出てきます。その場合には文字に影を付けたり、色を変えたりすることで、読めるようにしておかなければなりません。病院や介護施設などは見る人の様々な年齢・体調が幅広いため、イメージを優先して読むことを困難にするような色を選んではいけません。