ワイヤーフレーム
→Adobe XD
→Cacoo（オンライン）
→illustrator IllustratorをPDF（最小ファイルサイズにする）
2週間に1個、1か月に2個作るようにすると良いです。
クライアントワーク
過程を残すことが大事です。その残したものをポートフォリオにします。
ページの1つ1つのアイデアが盛り込まれていて、ディレクターにもデザイナーにもなれます。
Webサイトを作るまでの流れ
①ヒアリング
②ラフ案・・・大雑把な枠組み
③ワイヤーフレーム・・・箱だけ
④カンプ（画像+文字）・・・画像と文字つき
⑤プロトタイプ・・・第一階層をもとに複数のページが作れる
960GridSystems
アートボードオプション
スマホサイズ
ガイドをロック
margin-bottomがイラレでもできる
flex froggy
Emmet
<nav>
ul>li*5>a[href="#"]{ホーム}
</nav><nav><ul><li><ahref="#">ホーム</a></li><li><ahref="#">ホーム</a></li><li><ahref="#">ホーム</a></li><li><ahref="#">ホーム</a></li><li><ahref="#">ホーム</a></li></ul></nav>クラス名
OOCSSとBEM
仕事ではBEMが多いです。
海外のWordPressは、OOCSSが多いです。
CSSリセットの意味
CSSリセットとは、ブラウザが持っているブロックレベル要素の初期値をリセットという意味です。
インライン・・・a,img,br,div
はCSSリセットを行ってもリセットされないです。
initial-scale
古いiphone用の設定なので、今は必要ないです。
均等割り
justify-contentでspace-betweenをしたとき
色んなタブレット
footerの中のナビゲーションボタン
①display: inline;
文字を横並びにできるが、広げたりはできません。
<a>に対してのpaddingはできません。
②display: inline-block;
<a>にpaddingを付けたいときに使います。
ただ、headerやbodyは、display: flex;を使います。
最近は、display: grid;が使われています。
floatは最近使われていない
<divclass="container"><section><h3></h3></section><section><h3></h3></section></div>