有料老人ホームのサイトにコンテンツを追加しました

はじめに

地元名古屋のWEB制作会社で以前からお世話になっている担当者の方からchatworkで「有料老人ホームのサイトのコンテンツ追加のコーディングを行ってほしい」というご依頼を受けました。

すでに稼働している本番サイトの下層にdevというフォルダを作成して、そこにファイル一式を配置し、そのテスト環境で作業を行いました。

今回のサイトはWordPressなどのCMSは使用していませんでした。

テスト環境には、no-indexを追加しgoogleにクロールされないようにしました。

追加したコンテンツは、受賞歴・エリア・お客様へ・お問い合わせコンテンツです。

XDで作成されたデザインを参考にコーディングしました。

受賞歴は、すでに別ページに掲載されていたものを引っ張ってきて、デザイン通りにスライドにして作成しました。

スライド作成には、swiperを使用しました。

また、スライドコンテンツの高さを揃えてスッキリとした印象に仕上げました。

エリアは、Imagemapを使用して関西エリアの地図をクリックすると右側にそのエリアの老人ホームのリストが表示されるようにしました。

リスト内の老人ホームアイテムをクリックすると詳細ページ（施設詳細ページ）に飛びます。

▼ Imagemapについての記事はこちら

お客様へは、デザイン通りにコーディングしました。

レイアウトが画像とテキストを重ねていたため、親要素に「position: relative;」画像とテキストには「positon: absolute;」を指定してデザインを再現しました。（他に指定したCSSは割愛します）

3種類のお問い合わせフォームをタブで切り替えられるようにしました。

それぞれ特定の老人ホームのページに追加するという形でした。

料金は今回の記事で紹介したコンテンツ追加の他に、特定ページをサイト内のリンクから削除したり、バナー差し替えを行ったりする項目と合わせて、5万円（税込55,000円）でした。

所要期間は、お盆前にご依頼いただいて、現在（8/31）まで続いていますが、本日最後の項目を納品予定です。