抜き打ち小テスト！！
週末の金曜日、今日が終われば土日はゆっくり出来るなぁと
教室に着くと・・・
突然先生から次の言葉
「ノートパソコンを閉じ筆記用具を出してください。」
はて？何かお話が始まるのかと思いきや、先生の手には
何やら紙の束。
紙の正体はテストペーパーでした。
一月に一回の小テストはスケジュールに記載してたので知ってたけど、
まさか、抜き打ちテストがあるとは思わなかった（汗）
分かっていればすぐに解ける、でも、分からなければ永久的に解けない、
そんな今日まで受けた講義の理解度をチェックするための小テストでした。
例えばこんな問題です。
- HTML/CSSの正式名称を正しく書け
- HTML5のDTDを正しく書け
- 番号なし・番号付きのリストを示す正しい構文（一行）を書け
- 属性を正しく3個以上書け
といった具合です。
言語ですから綴りのミスは許されません。
CSSのCは’Cascade’「Cascading」だし、
最後のSは’Sheet’ではなく「Sheets」と’s’が付く複数形です。
属性は盲点でした。確かにテキストを見れば書いてあったけど、
言葉としての意識は全くしていなかった。
タグを打つ時の要素を補完するのが属性なんですね。
今回の小テストで分かりやすく覚えました。
<〇〇 □□=""></〇〇>
の「=""」の前の部分”＝□□”が属性です。
<img src="">の「src」
<html lang="ja">の「lang」
<meta name="" content="">の「name」「content」
<div class=""></div>の「class」
と言った感じ。
問題は10問で（一応の）合格点は6割以上、講義の復習が必要な事を
改めて思い知らされました。
幸いにも今回の小テストは訓練機関内でのものだけど、月一で
実施されるテストはハローワークにも成績が通達されるようです。
訓練開始から2週間、本当に内容が濃いです。
どちらも’かげ’だけど「陰影」の漢字の違いって分かりますか？
「そろそろ俺が夢に出てきた？まだ1回も出てない人はマズいよ」
訓練が始まって間もなく2週間、怒涛の毎日です。
まだ1カ月も経っていないのに、先生から冒頭の言葉が飛び出しました（汗）
講義の方はCSSに入り四苦八苦です。
イラストレーターとフォトショップの講義も始まっているけど、
イラストレーターがチンプンカンプン！
曲線を描くことが最初の壁になっています（涙）
「イラストレーターはお絵描きソフトではない。これは物理だ。
どう力を加えれば曲線が描けるのかを考えなさい。」
中学で習った’ベクトル’です。
はぁ～数学得意だったんだけどなぁ・・・
と、今回はそんなお話ではありません。
「陰影」のお話です。
講義の中でどういう流れでこの話になったかは覚えてないんだけど、
今のWebって心理学なんだそうです。
つまり、いくら綺麗なサイトが作れたとしても意味はなく、そのサイトを見た
人に行動してもらわなければならないと。
ヒェ～作成技術も未熟なのに心理学まで考えないとならないわけか・・
さて、同じ’かげ’だけど「陰」と「影」の2つの漢字がありますね。
美術大学ではしっかりこの辺を勉強するようです。
両者には明確な違いがあります。英語で書いても
- 陰・・・shade
- 影・・・shadow
と違います。
物体にライトを当てた時、物体に光が当たらずに出来た部分「陰」（shade）で、
物体そのものが作っているのが「影」（shadow）
子どもの頃、「影踏み」って遊びをしませんでしたか？この場合、
人が作っている「影」を踏んでいるのでこちらの漢字になります。
先生の話は更に展開しました。
物体にライトを当てる場合、世界標準とも言える向きと角度があるようです。
’左から135°’
がその値のようです。
これを「神の視線」と呼ぶそうです。
ここで心理学の話になります。
これはよく言われていますが、
「人が嘘をつく時のサインとして、右斜め上を向く」
と。
神の視線とは反対の方を向くというわけです。
こんな感じで、手を動かす合間に先生は色んな話をしてくれます。
＜スポンサーリンク＞
Brackets（ブラケッツ）の拡張機能「Emmet」に感動！
週明けの月曜日、講義は復習から始まりました。
これは助かる、知識やスキルなんて一朝一夕に身に付くものではないし、
繰り返しやっていくしかありません。
新しい言語を習うなら尚更ですね。
先生からはこんなキツイ言葉ありました。
「1日の講義時間は5時間だから、本当は5時間の復習が出来るといいんだけど・・
最低でも2時間はやって下さい。」
と。
Webデザイナーのためのテキストエディター＝Brackets（ブラケッツ）の
拡張機能「Emmet」（エメット）が凄い！！
本当は初心者なら地道にタグ打ちをしてスキルアップを目指すべきだけど、
先生は効率的に打つ秘密兵器を教えてくれました。
それが、Brackets（ブラケッツ）に備えられた拡張機能＝Emmet（エメット）です。
この機能を使うとどうなるか？
（例）
<ul>
<li><a href="#">メニュー1</a></li>
<li><a href="#">メニュー2</a></li>
<li><a href="#">メニュー3</a></li>
</ul>
というリストタグを打つ時、
（エメットを使うと）
li*3>a[href="#"]{メニュー$}
と打ち、カーソルが一番右（最後）にある状態で「tabキー」を
押すと、上記の構文となるのです。
これはCSSの入力時にも使え、
（例）
margin-botoom: 10px
なら
（エメットを使うと）
mb:10
です。
カーソルの位置を確認して「tabキー」を押せば（例）のように
変換されます。
ここで大事なのはこの省略文を覚えるのではなく、
「こんな風に打ったらどんな風に変換されるかな？」と
考える事。
「こんな風に省略したらこんな結果になるんじゃないの？」
と言う具合に、タグ打ちを楽しむといいそうです。
う～ん、基本が出来てないのに応用はハードルが高いなぁと
思いつつ、頭の片隅に入れて置こうと思います。
そうそう、コメントタグを打つ時の便利なショートカットも習ったので
メモしておきます。
「Ctrlキー」＋「/」（スラッシュ）
です。
- HTML ⇒ <!-- コメント -->
- CSS ⇒ /* コメント */
が挿入されます。
初心者のうちは出来るだけコメントタグを入れるよう指導されています。
＜スポンサーリンク＞
