PREMIUM
第1回
PCサイトコーディング -デザインを元にマークアップしよう-
2016年6月22日 60min
スライド資料
授業の概要
こんな人にオススメ
HTML、CSSの基本を学んだので実際にWebサイトを制作したいと考えているWebデザイナー
担当の先生／パーソナリティ
-
山本 麻美
株式会社ロクナナ UI/UXデザイナー
インディーズ音楽プラットフォームを作りたい一心でWebを独学。企業からWeb制作の仕事を請けるようになり1997年フリーランスのWebデザイナーに。 2010年何気なく参加した日本Androidの会で周囲からすすめられてAndroid, iOSのUIデザインを始め、モバイルアプリのUIに特化して仕事をするようになる。 2017年後半からIoTプロジェクトやグラスデバイスのUIデザインに仕事の範囲を広げる。 2020年より株式会社ロクナナ所属。 ・TechFeed 公認エキスパート（UX） ・東洋美術学校 デザイン研究室 講師 ・mmhmmヒーロー
-
田原 彩香
スクー放送部
チャプター
-
自己紹介
01:28 -
今日のゴール
01:30 -
今日の授業内容
00:50 -
サンプルデータの説明
01:57 -
Marcketchの紹介
05:03 -
デザインを見てどうマークアップするか考えよう
02:07 -
基本のHTML
02:11 -
HTMLを書こう
00:15 -
HTMLを書こう - header
01:33 -
HTMLを書こう - main
00:45 -
問題#01
05:07 -
答え#01
00:24 -
h1について
00:30 -
キャッチコピー
00:37 -
Our Mission
02:10 -
画像のalt属性について
03:28 -
Topics
03:54 -
「もっと見る」
00:30 -
問題#02
03:11 -
答え#02
00:18 -
CSSだけで表現できること：例
00:47 -
「ページトップへ」
01:42 -
HTMLを書こう - footer
00:37 -
問題#03
02:48 -
答え#03
01:38 -
まとめ
03:22
-
Q：最近、モダンなwebサイトだと画面一杯に大きな背景画像が現れ、グローバルnavもその画像の上にかかってるサイトをよく見かけるのですが、そういう場合はmainの中にheaderが入っているのでしょうか？
02:22 -
Q：日付の<p>2016.06.20</p>は<time></time>でしなくてもいいですか？
00:58 -
Q：ずっと企業ロゴをh1にしてました。企業ロゴはh2くらいにしておいたらいいですか？
01:03 -
Q：©は＆ c o p y ;で、今回はしない感じですか？
01:30 -
Q：先生はarticlやsectionは使いませんか？
01:37 -
Q：footerのナビゲーションがグローバルナビゲーションのメニュー、プラス下層ページのサイトマップになってる場合は、navにしてもよいのでしょうか？
01:27 -
お知らせ