Webサイト制作の工程と重要なポイント
企画・提案
- 最も時間のかかる工程
- 企画書、サイトマップ、見積もりを作成
- 必要に応じてワイヤーフレームを作成
デザイン素材の作成
- ロゴ、ピクトグラム、アクセスマップ、写真、原稿などを作成
- SNSやjQueryの動きなどの素材も含む
- XD（Adobe XD）はIllustratorとPhotoshopの簡易版
コーディング
- HTMLは検索エンジン向け、CSSはデザイン向け
HTMLとCSSの役割
- HTML：Webページの構造を記述（論文の骨組み）
- CSS：Webページの見た目を装飾
- HTML→CSSの順に読み込まれる
コーディングの手順
- 素材の確認→マークアップ（HTML）→CSSでデザイン→サーバーにテストアップ→納品
HTML/CSS学習のポイント
- 文法をしっかり理解する
- よく使うものから覚える
- 概要を理解する
- 整理整頓を心がける
- セレクタを先に記述し、プロパティを後から記述する
- ブラウザ固有のCSSに対応するため、リセットCSSを使用（学校で提供されたもの）
- スマートフォン対応にはメディアクエリを使用
- サーバーにテストアップして確認後、納品
使用ツール
- エディタはTeraPadを使用
- 作業中はこまめに保存
参考サイト
- HTML/CSSのメモ書きサイト：https://samplesdl.me/training_html-css/
重要な補足
- Webサイト制作は、企画・提案に最も時間がかかります
- クライアントの要望を的確に把握し、具体的な形に落とし込むことが重要です
- HTMLとCSSの役割分担を理解し、正しい文法で記述することが、Webサイトの品質を高める上で不可欠です
- Webサイトは様々なデバイスから閲覧されるため、スマートフォン対応（レスポンシブデザイン）は必須です
- 制作したWebサイトは、必ずサーバーにテストアップして動作確認を行いましょう
整頓整理、文法をしっかり覚える、作業中は小まめに保存！大事！
今後
一番苦戦するHTML,CSS しっかり学び作っていきたいです
コメント