森山曲太郎法律事務所(架空)
作成した箇所・担当した箇所
メインページ・応募フォーム
期間
2週間(HTML/CSS勉強開始2ヶ月目)
工夫した点・取り入れた点
応募フォームページ
法律事務所にて案件を終えたお客様にアンケートをいただく想定で作成。 職員がpcをお客様にお渡ししてチェックをいただくだけの想定のため、「ページへ戻る」や事務所名などの他リンクは設定しておらず、「送信する」で終えるように考えました。 お客様に手間だと思われないように、ファーストビューの範囲内に収め、クリックのみで回答可能に設定。ベースカラーの明度を上げたものを背景色として使用することで読みやすくし、サイトの統一感を守りました。
デザイン面
法律事務所の職業イメージを伝えるために、高貴、堅い印象の紫をベースカラーとして使用。フォントはしっかりとした、気品のある印象を与えるためにセリフ体を使用しました。
コード面
背景のイメージ画像の指定方法ですがpositionのrerativeとabsoluteの理解を深めるため、cssにback guround imageの指定ではなくHTMLへimgタグを使用しました。実際に指定するにはボックス内の文字がそれぞれ異なるのでこの記述では現実的ではないと思いました。
改善点・課題
今回pcサイトのみの構成で作成しましたが、今後のレスポンシブデザインを考えていくとcssに背景画像としてback guround image指定するのが良いと思いました。またクラス指定の命名方法に規則性を持たせずbox01など数字を多用してしまったことが今回の反省点です。のちにページ改装するときや自分以外の人が見ることを想定すると、どのボックスなのかクラスを見ただけでは判別できないので優しくないコーディングであると感じました。