WORKS
～ 制作実績 ～

サイト概要

Web工房 プティ･スィプレ ポートフォリオサイト

担当範囲

デザイン / コーディング

使用言語

HTML / CSS / JavaScript

使用ツール

Figma / Photoshop / Illustrator / Vscode

制作期間

1ヵ月

制作で心がけたこと

「自分らしさ」を表現しつつ、閲覧される方が迷わない機能的な構成を目指しました。

【まとまりを意識したデザイン】

構造をシンプルに保ちつつ、単調にならないよう動きのあるレイアウトを意識しました。
多めの配色を使用していますが、サイト全体に統一感をもたせることで、賑やかさとまとまりを両立させたデザインに仕上げています。

【読みやすさを大切にしたコード】

CSS GridとFlexboxを適材適所で使い分け、整理されたコーディングを心がけました。
また、BEM命名規則の採用や、プロパティの並び順を整えることで、自分でも後から見返したときに理解しやすく管理しやすいコードを目指しました。

【実用的なフォーム機能とスパム対策】

当初はGoogleフォームを利用していましたが、スパムメールへの対策と通知の安定性を高めるため、Web3Formsへ移行しました。
ハニーポットや送信時間の検証など、ソースコード側での対策を工夫しています。
お問い合わせいただく際の手間を増やさず、自分自身でも安心してサイトを運営していける形を整えました。