同時進行で、複数案件を抱えていると想定して、優先順位を自分の中で整頓して作業しましょう!
本日のタスク
- デザインカンプ 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;
}
}


コメント