ABC Technologies コーポレートサイト. / ABC Technologies Corporate Site

ITシステム開発・DX推進コンサルティングを行う株式会社ABCテクノロジーのコーポレートサイトです。
大井佐智のポートフォリオ作品として制作しました。

---

制作背景 / Background

システム開発・業務改善支援会社のコーポレートサイト制作を想定したポートフォリオ作品です。
派手な広告ではなく、実直な仕事ぶりをそのまま伝えるサイト設計を意識しました。

• お客様の声は社名を伏せつつ、具体的な業務の変化を言葉で表現
• 料金の透明化により、問い合わせハードルを下げる設計
• 制作工程を明示し、短納期依頼をふるいにかける構造
• 採用ページを設け、自社サイトからの応募を促す設計
• 無料相談・資料請求のCTAを各ページに配置し、お問い合わせページに集約

---

ページ構成 / Sitemap

ファイル	ページ名
index.html	ホーム
company.html	会社情報
service.html	料金一覧
recruit.html	採用情報
job-ui-designer.html	募集要項（UI/UXデザイナーのみ）
apply.html	採用応募フォーム
contact.html	資料請求フォーム / 無料相談フォーム
privacy.html	プライバシーポリシー

---

技術スタック / Tech Stack

• HTML / CSS / JavaScript（バニラ、フレームワークなし）
• Google Fonts（Noto Sans JP）
• Formspree（静的フォーム送信）

---

ディレクトリ構成 / Directory Structure

/
├── css/
│   ├── style.css          # メインスタイル
│   └── responsive.css     # レスポンシブ対応（767px以下）
├── images/                # 画像素材
├── nav.js                 # ナビゲーション制御
├── index.html
├── company.html
├── service.html
├── recruit.html
├── job-ui-designer.html
├── apply.html
├── contact.html
└── privacy.html

---

デザイン / Design

ワイヤーフレームおよびデザインカンプはFigmaで制作しました。

• Figmaファイルを見る
• プロトタイプを見る

---

フォームについて / About Form

お問い合わせフォームおよび採用応募フォームは Formspree を使用しています。

---

レスポンシブ対応 / Responsive Design

css/responsive.css にて767px以下の画面サイズに対応しています。
index.html の <link> タグで条件付き読み込みを行っています。

<link rel="stylesheet" href="css/responsive.css" media="screen and (max-width: 767px)" />

---

制作者 / Author

Sachi Oi — Director / Planner / Editor / Writer
UI/UX Design・Web Design・Webプログラミングを学習中

• Portfolio: https://github.com/oi-sachi
• LinkedIn: https://www.linkedin.com/in/oisachi/

---

© 2026 Sachi Oi. All rights reserved.