同時進行で、複数案件を抱えていると想定して、優先順位を自分の中で整頓して作業しましょう!
本日のタスク
- デザインカンプ Googleスプレッドシートにup
- 課題サイトにデザインカンプ アップロード html
- 企業案件
- クライアントワーク
1~2限目:デザインカンプと企業案件
不動産のサイトのデザインカンプ
- jpgにして、スプレッドシートに追加して、学んだことや、感想などを記入
- 不動産のサイトのデザインカンプをアセットしてコーディング、FTPでアップロードして、WEB上でデザインを確認できるようにする
- 各自の課題サイトの「IMG」を更新する
企業案件を進める
出来上がった人は、
- jpgにして、スプレッドシートに追加して、学んだことや、感想などを記入
- 各自の課題サイトの「IMG」を更新する
3~5限目:クライアントワーク
各自のクライアントワークを進めます。
デザインカンプをテスとサイトとしてアップする時のコード
HTML
<!doctype html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="robots" content="noodp" /> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>案2 | 株式会社LOREM </title> <link href="css/style.css" rel="stylesheet" type="text/css" > </head> <body> <main> <div class="pc"> <p><img src="img/design_02_01.jpg" height="" alt="" /></p> <p><img src="img/design_02_02.jpg" height="" alt="" /></p> <p><img src="img/design_02_03.jpg" height="" alt="" /></p> </div> <p class="sp"><img src="img/design_02_sp_01.jpg" height="" alt="" /></p> <p class="sp"><img src="img/design_02_sp_02.jpg" height="" alt="" /></p> </main><!-- / .main--> </body> </html>
CSS
@charset "UTF-8"; body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { margin: 0; padding: 0; } img { width: 100%; height: auto; } main { width: 100%; } @media screen and (min-width: 769px) { .sp { display: none; } } @media screen and (max-width: 768px) { .pc { display: none; } }
コメント