Webサイト制作の流れ
実際にサイトを作る時の手順を紹介します。
1. 企画・設計
目的とターゲットを決める
やること
- サイトの目的を明確にする
- ターゲットユーザーを決める
- 必要なページを洗い出す
例
- 目的: 自分のスキルを紹介する
- ターゲット: 採用担当者
- ページ: トップ、プロフィール、作品紹介、お問い合わせ
2. ワイヤーフレーム
レイアウトを決める
やること
- 各ページの構成を考える
- どこに何を配置するか決める
- 紙やツールで簡単に描く
ポイント
- 最初は細かいデザインは考えない
- 配置だけを決める
3. 実装
Tips を見ながらパーツを作る
必要なパーツ
基本的なサイトに必要なパーツ:
進め方
- ヘッダーから作る
- メインコンテンツを作る
- フッターを作る
4. 装飾
見た目を整える
やること
- 色を決める
- フォントを決める
- 余白を調整する
- ホバーエフェクトを追加
参考 Tips
5. 公開
デプロイする
やること
- GitHub にコードをアップロード
- Cloudflare Pages や Vercel でデプロイ
- ドメインを設定(任意)
確認すること
- すべてのページが表示される
- リンクが正しく動く
- レスポンシブ対応ができている
📚 まとめ
制作の流れは:
- 企画・設計
- ワイヤーフレーム
- 実装(Tips を活用)
- 装飾
- 公開
一つずつ進めていけば、必ずサイトは完成します。 まずは小さなサイトから作ってみましょう!