ポートフォリオサイト制作
| サイト種別 | ポートフォリオサイト |
| 目的 | Web制作副業のための実績・スキル訴求サイト |
| ターゲットユーザー | Web制作を依頼したい中小企業・個人事業主 |
| 制作環境 | WordPress ＋ 自作テーマ |
| 対応デバイス | スマートフォン優先（SP/PC レスポンシブ対応） |
| 製作期間 | 約1ヶ月 |
制作のポイント
- Flattoオリジナルロゴ（SVG）をヘッダー・フッターに実装
- 「Your vision, our craft.」英語キャッチコピーによるブランディング
- AI（Claude）を活用した効率的な制作フロー
- ダークトーンでモダンなデザイン
- 制作実績・サービス・制作の流れ・お問い合わせフォームを実装
使用技術
WordPress / HTML5 / CSS3 / JavaScript / PHP / Contact Form 7
ファイル構成
portfolio-theme/
├── style.css # テーマ定義（ヘッダーコメント）
├── functions.php # テーマ機能（CPT・タクソノミー・メタボックス・CF7・カスタマイザー）
├── header.php # 共通ヘッダー
├── footer.php # 共通フッター（SNSリンク）
├── front-page.php # トップページ
├── index.php # ブログ一覧（フォールバック）
├── single.php # ブログ記事詳細
├── page.php # 汎用 固定ページ
├── page-about.php # 固定ページテンプレート「プロフィール（About）」
├── page-privacy.php # 固定ページテンプレート「プライバシーポリシー」
├── page-corporate.php # サービス詳細：コーポレートサイト（slug: corporate）
├── page-web-design.php # サービス詳細：Webデザイン（slug: web-design）
├── page-lp.php # サービス詳細：ランディングページ（slug: lp）
├── page-wordpress.php # サービス詳細：WordPress構築（slug: wordpress）
├── archive-portfolio.php # 作品一覧（アーカイブ）
├── single-portfolio.php # 作品詳細
├── 404.php # 404ページ
├── template-parts/
│ └── portfolio-card.php # 作品カードパーツ
└── assets/
├── css/
│ └── main.css # メインスタイルシート
├── js/
│ └── main.js # アニメーション・インタラクション
└── images/
├── logo-light.svg # ロゴ（ライト）
├── logo-dark.svg # ロゴ（ダーク）
└── favicon.svg # ファビコン