見出し画像

おかもと歯科医院 #サイトレビュー

概要

おかもと歯科医院のサイト


ターゲット

歯科医院を探している大阪市民


サイトの目的

・治療の予約

・歯科医院を探す人への治療案内


サイト全体の印象

親しみのあるゴシック体を使用し、清潔感のある白とサーモンピンクの配色で全体を優しい印象に仕上げている。


フォント

【見出し】

フォント:見出ゴMB31(モリサワフォント)

カラー:#3e3a39

フォントサイズ:22px

【説明文】

フォント:中ゴシックBBB(モリサワフォント)

カラー:#3e3a39

フォントサイズ:15px

・「見出ゴMB31」は伝統的で落ち着きのある見出し用ゴシック体。ゴシック体のなかでは字面が小さめに設計されているため、大きなサイズで使っても押しつけがましくなく、ゆったりと言葉の意味を伝えることができる書体。(引用先:モリサワ)

・「中ゴシックBBB」は、基本的な書体として長く愛されてきた伝統的なゴシック体。オーソドックスな字形に、アクセントのあるエレメントをもち、文字の大きさは全角に対してやや小さめなので、可読性と安定感がよく、読ませる用途に向いている。(引用先:モリサワ)


配色

ベースカラー:#ffffff

アクセントカラー:#fad3cd

・ベースカラーに清潔感のある白を基調とし、アクセントカラーでサーモンピンクを取り入れることで親しみのある印象に。


ヘッダー

pcもspもグローバルナビゲーションはハンバーガーメニューを採用し、電話番号と最寄駅のみを記載しユーザーを迷わせない工夫をしている。


ファーストビュー

・角丸の長方形の中に画像を配置することで、優しげな印象を引き立てる

・キャッチコピーは白背景を重ねることで、自然と目がいくようにしている。


メイン

・見出しのあしらいは文章の下にアクセントカラーをラインで強調。全てあしらいを統一してサイト全体をまとめている。

・about usのコンテンツの文章の行間は35pxと他のコンテンツよりも広めになっており、伝えたいコンセプトをゆっくり読ませるようにしている。

・治療内容は大枠の2つにまとめ、詳細な治療は別ページに飛ぶように構成されている。こうすることでトップページをすっきり見せてユーザーが必要な情報に辿り着けるようにしている。

・スタッフブログとお知らせのコンテンツはデザインが単調にならないように背景色を変えて区別している。

・フッターは電話番号、予約ボタン、最寄駅、診療時間、マップを配置し一目で必要な情報が揃うようにしている。


画像

画像のトーンは全て明るめに統一されており清潔感を引き立てている。


FireShot Capture 094 - おかもと歯科医院|大阪府吹田市 - okamoto-dental.clinic



この記事が気に入ったらサポートをしてみませんか?