制作するサイトの情報
まずはHTML/CSSの一歩目としてほぼワイヤーフレームの状態のものをコーディングしてみましょう。
実際にワイヤーフレームをコーディングすることはありませんが、WEBサイトの骨組みをつくるという発想ではいい勉強になるかと思います。
デザインカンプ（Figma）
デザインカンプをもとにコーディングしていきましょう。
カンプはこちらのFigmaファイルの01ページになります。
WEBデザイン・コーディング練習課題用Figma | Figma Community
コーディング練習用のFigmaファイル。▼ 学習サイト
www.figma.com
必要な知識
- HTML
- CSS
基準としては、ProgeteのHTML/CSSコースを終えたくらいになります。
学習・実装手順
- カンプをもとにフォントや色を指定して作成
- リセットCSSは`destyle.css`
- 画像はplacehold.jpを使いましょう
Twitterで学習開始を宣言しよう
ということで、コーディングしていきましょう。
Twitterで学習開始を宣言してみましょう。
コーディングで躓いた際は次のページでヒントが読めるので、参考にしてみてください。
コメント