【制作ホームページ解説】葬祭の華セレモ様｜ホームページ制作9800円～東京台東区のエグゼクティブクリエイション/反響重視のホームページ制作

黒柿色と華やかなお花が印象的な東松山市の華セレモ様の新規ホームページ制作を行い、先日公開しました。家族葬・一日葬・小規模葬儀のwebサイトのため、サイト全体の雰囲気を爽やか且つ落ち着いたデザインに仕上がるよう制作。

メインカラーとして柔らかな色味のチェリーピンクを使用し、サイト訪問者へ優しい印象を与えられるビジュアルに重きをおいています。今回のBlogではサイトデザイン/ページ解説と共に、近年よく用いられている「可変型グリッドレイアウト」についても解説をいたします。

制作ホームページ解説：華セレモ様（埼玉県東松山）

TOPページ制作時のPOINT

ファーストビューとなるトップページメイン画像は、笑顔で丁寧にお辞儀する女性と華セレモ様の事業コンセプトそして華やかな写真・イラストのお花でデザイン。

第一印象で”安心感”を出せるデザインを目標としました。メインビジュアルは3枚の画像がjQueryで切り替わるようになっており、2枚目は実際のご葬儀の様子を入れています。

そして3枚目は趣ある庭園写真で、堅いイメージを表現しました。新規ホームページ制作を進める際、その業種について一般ユーザーが持っている印象と大きくズレのないビジュアルにすることが実はとても大切です。特に冠婚葬祭といった職種では、重視しなければなりません。

webデザインを行う際、最初にブラしてはいけない”デザインイメージ”をまず明確にします。今回のweb制作時は「堅い」「華やかさ」「落ち着き」「趣」で、こういった要素を特に大切なファーストビューからメインコンテンツ、下層デザインまで要所要所へ取り入れながらデザイン制作します。そうすることでビジュアル的な統一感と、印象的な統一感を出すことができます。

コンテンツデザイン時のPOINT

内容部分の打ち出し方において、シンプルながらも各コンテンツ毎の収まりも考慮し、レイアウトしています。全体的な統一感を考えながらデザインするのは勿論、「話題が切り替わる/コンテンツの区切り」がハッキリするように、ページ制作を行うのもPOINTです。

TOPページ（第一階層）から各第二階層ページへと遷移するリンクボタンは、大き目で分かりやすいビジュアルにしています。

トップ中段「プランのご紹介」では火葬式プラン・家族葬プランとそれぞれのプランの種類について、分かりやすく簡潔に記載。信頼性のある見せ方となるよう、コンテンツのパーツデザインも落ち着いた堅いイメージでデザインしています。

またユーザーが上から順にページをスクロールし、各コンテンツへ来た際、素早く伝えたい内容が頭に入るよう、視認性が高く感覚的に分かる見た目を重視しました。

可変型グリッドレイアウトについて

現在、新たにホームページ制作を行う際、各コンテンツをカードタイプやブロック型でデザインをすることが増えています。

これは可変グリッドレイアウト（画面幅を変更することで、グリッドも最適なレイアウトに自動的に可変）との相性が良く、PCからもスマートフォンからも見やすく使いやすいサイトとなるからです。

グリッドレイアウトは特に更新頻度の高い、新たなコンテンツ掲載が多いwebサイトに有効で、多くのコンテンツを見やすく分かりやすく打ち出すことができます。

今回、制作の華セレモ様のTOPページでも「プランのご紹介」や「施行対応式場」の項目をカードタイプにし、PCでは横2列、スマートフォンでは縦1列と画面端末幅に合わせ可変するようになっています。デザイン上、シンプルで流行りの見せ方になるだけでなく、ユーザビリティ面でも非常に有効なため、近年お勧めの手法です。