会社概要ページの必要性・解説 | 福岡のホームページ制作はマリオ君にお任せ

本日はホームページに掲載する会社概要ぺージの必要性と当サイトの会社概要ぺージが完成したので、そちらの解説をさせていただきます。

会社概要ぺージの必要性

会社概要これもホームぺージを作るときに必須のページになるかと思います。

会社名・代表者・住所・アクセスマップなどホームページの信頼性を高める情報を記載するぺージになるかと思います。

どんなによいサービスでどんなにお得な金額がホームぺージに記載されていても、運営者情報・会社情報がのっていないと一気に胡散臭く感じてしまうと思います。

会社概要に紐づいてよく作るページとしては、代表者挨拶、会社の沿革、コンセプト・スタッフ紹介などがあげられると思います。

歴史のある会社様・サービスの場合は沿革でこれまでの流れをお伝えすることで、より信頼感が生まれると思います。長く営業されているだけでも、信頼性の高さが伺えます。

代表者挨拶に関しても、会社の代表者がどのような考えで、会社を運営されているのかかが垣間見えるページになるかと思います。

写真をいれると、より人となりが伝わりやすくなると思います。

スタッフの顔を見せることにより、より身近に感じやすくなるかともいます。接客業をされている企業様のホームページは結構な確率でスタッフ紹介のぺージがあるのは、やはり効果があるからだと思います。

企業サイトではなく、サービスサイトの場合はサービス内容ばかりを強調し、少しないがしろになりがちですがきっちりといれて、信頼度を上げられる重要なぺージかと思います。

解説

それでは、当サイトの会社概要ができたので、デザインとコーディング解説をしていきたいと思います。

上記でいろいろ述べましたが、代表挨拶もスタッフ紹介も沿革も入れておりません。

ちーーーん。

運営会社のホームページにとぶと乗っているので、割愛しました。

はい、手抜きですね。

それでは説明していきます。

今回のホームページのコンセプトとして、見ていただく方により身近に感じていただくことを念頭においていますので、その思いをそのまま文章として入れています。

また、円の中にいれることにより、柔らかさがでればとデザインしました。

背景の加齢臭が隠し味の無限ループは意味はありませんが見ている方にくすっと笑ってもらえればと、少しでも身近に感じていただければと思いいれております。

実際加齢臭がもれているかもしれませんが、細心の注意を払って打ち合わせにお伺いさせていただいておりますので、ご安心ください。

コーディング的にはスマホサイト時は加齢臭が隠し味は見えない状態で、

円の部分はwidthをスマホサイズより大きくし、はみ出た部分を囲っているdivにoverflow:hiddenをいれてレイアウトが崩れないようにしております。

円をそのまま入れると、スペースがかなりでたので、このようにしています。

いい感じじゃないですか？

円の色はもともと＃FFFEF0を使用していただのですが、アイホンでみると、ほぼ色がでていたなかったのでスマホは＃FFFDE1と適当に少し濃くしました。

会社概要は一般的なtableで作成しています。

時短だ様への感謝の気持ちをここでもお伝えできればと思い、掲載させていただいております。

運営会社のところはあえてアクセントで、文字ではなくバナーを入れております。ちょっとオシャンな感じでてません？

少しだけこだわったところは

左がth右がtdなんですが、間の線はボーダーではなくて、疑似要素で背景としていれています。

ボーダーはとても便利ですが線と線の間隔が微妙に感じるときもあるので、そういった場合は疑似要素で対応しています。

またスマホ時は一般的にはdisplay:blockにして縦に並べることが多いと思いますが、今回はあえてthを縦文字にしてそのまま入れています。

なんかそのまま縦文字にしようとすると、変な感じになったので、pタグで囲って対応しました。
初めてテーブルの中で縦文字にしたので、原因はわかりませんが、そのままthに縦文字のCSSをいれるとうまくいきませんでした。

で最後にグーグルマップですね。

色をカスタマイズして入れようと思って一度色を変えてみましたが、

サイト自体がパステルなので、グーグルマップに色を付けると変な感じになったので、そのまま入れました。

以上がホームページに掲載する会社概要ぺージの必要性と当サイトの会社概要ぺージの解説でした。

社内より、ホームページ制作の項目から制作しろよって、催促がきましたが、無視して自分の作りたいページから作っていきます。

それではまた。