WEB CREATION RECORD

ホームページ制作TOP > Web制作実績 > 世田谷人工関節・脊椎クリニック [医療 / レスポンシブサイト]
[期間限定] 標準クオリティープラン  WEBサイト制作20%OFF
失敗しないWeb制作会社の選び方

WEB CREATION RECORD

世田谷人工関節・脊椎クリニック様

[医療 / ホームページ制作実績]

[世田谷人工関節・脊椎クリニック] トップページ
[世田谷人工関節・脊椎クリニック] 当院が選ばれる理由ページ
[世田谷人工関節・脊椎クリニック] 股関節疾患ページ
[世田谷人工関節・脊椎クリニック] ブログトップページ
[世田谷人工関節・脊椎クリニック] トップページ
[世田谷人工関節・脊椎クリニック] 当院が選ばれる理由ページ
[世田谷人工関節・脊椎クリニック] 股関節疾患ページ
[世田谷人工関節・脊椎クリニック] ブログトップページ

DESIGN

今回のデザインで心がけた点は、ブラウザ幅100%の領域をところどころ使いダイナミックに表現をしております。トップページのメインビジュアルは当社で行っている無料の撮影で対応を行っております。
メインカラーはお客さまから指定された「緑」。「緑」の持っている性格のままデザインしますと植物的な柔らかさを演出してしまうので、そこは流されないように硬さをキープ。外科の質感が損なわれないようにデザインしています。
レイアウトは余白をしっかりと使い見やすく読みやすいサイトに仕上がっています。
どの端末・ブラウザから閲覧しても最適なレイアウトで表示されるレスポンシブデザインでサイトを作成しました。
ロボットによるフォームからのスパムメール対策に、google社が提供しているreCAPTCHAという認証サービスを導入しています。この認証サービスは、ロボットには解読が難しい画像に関する問題を出題するので、スパムメール対策に効果があります。

有効なリンク設計によりSEO対策

[世田谷人工関節・脊椎クリニック] 有効なリンク設計

有効なリンク設計によりSEO対策

各ページの下段では読み終えたユーザーに対して

  • 関連性のあるコンテンツをリンクボタンにより提案
  • ご予約・お問い合わせへのナビゲート
  • ブログ・ニュースの関連記事を掲載

閲覧ユーザーの使いやすさを向上すると共に有効なリンクを配置することによりSEO対策が施されております。

» [世田谷人工関節・脊椎クリニック様] セカンドページ

クリックしたくなるブログ設計

[世田谷人工関節・脊椎クリニック] ブログ設計

クリックしたくなるブログ設計

一般的にブログはテキストのみで構成された記事一覧が多いですが、閲覧ユーザーにもっと興味・関心を抱いていただく為に、今回の作品ではサムネイル画像とテキストで記事一覧を構成しております。ブログの投稿者は記事を投稿する時に任意でオリジナルサムネイル画像を投稿する事も可能です。オリジナルサムネイル画像を投稿しない場合は既に設定がされているカテゴリに紐付いたサムネイル画像が自動的に反映されます。

» [世田谷人工関節・脊椎クリニック様] ブログ

イラスト制作も行いました。

[世田谷人工関節・脊椎クリニック] イラスト制作

イラスト制作も行いました。

トップページのデザインに調和する色調で股関節のイラストを作成いたしました。

» [世田谷人工関節・脊椎クリニック様] トップページ

スマホ対応-レスポンシブコーディング

[世田谷人工関節・脊椎クリニック] トップページ | スマホビュー
[世田谷人工関節・脊椎クリニック] 当院が選ばれる理由ページ | スマホビュー
[世田谷人工関節・脊椎クリニック] 股関節疾患ページ | スマホビュー
[世田谷人工関節・脊椎クリニック] ブログトップページ | スマホビュー
[世田谷人工関節・脊椎クリニック] メニュー | スマホビュー

スマホ対応-レスポンシブコーディング

どの端末・ブラウザから閲覧しても最適なレイアウトで表示されるレスポンシブデザインでサイトを作成しました。スマートフォン閲覧時は画面が狭くなるので、画面全体をスッキリしたレイアウトに調整しています。
もちろん高画質の画像で閲覧ができるRetinaディスプレイ対応も行っています。

制作概要・工程

企画デザイン設計ライティング撮影SEO内部対策コーディングCMS導入納品チェック・リダイレクト処理

  • 納品日  2017年08月10日
    端末対応  レスポンシブ対応
    ページボリューム  通常ページ:27ページ
    フォーム:2本
  • グレード  ハイクオリティ
    撮影  あり
    CMS  部分導入

PAGE TOP