やったこと

これからフロントエンドの最終課題に取り組んでいく

Can’t Unsee

• Placeholder text capitalization
  • Placeholderは大文字から始める

typographyの違いが全くわからなかったww
typographyとは
デザインにおける活字（テキスト）の構成および表現
具体的には、フォントの種類、サイズ、文字組や行間等を特定のルールに則って上手く組み合わせることで、文章の読みやすさや美しさを意識したデザインを作る手法

タイポグラフィーのデザイン基本16ルール＆作り方

タイポグラフィーデザインの基本16ルール

1. 英字フォントの縦幅は「エックスハイト（x）」を基準にする
   • エックスハイトとは、小文字の「x」の縦の長さのこと
   • 既存フォントでタイポグラフィーを作る際は、英字フォントの小文字が「x」の高さで統一されているかを意識
2. テキストフォントの横幅は1/72インチを基準にする
   • テキストフォントの横幅は「セット幅」と呼ばれており、全体の印象を大きく変える要素
   • 最も一般的なのは、1ポイント辺りの横幅が1/72インチ
3. 行間はフォントサイズの1.25〜1.50倍を基準にする
   • 各タイプライン間の垂直方向のスペースは、「リーディング」という
   • 行間はフォントサイズの1.25〜1.50倍に設定
4. 文字間はカーニングとトラッキングを駆使してデザインする
   • 個々の文字の組み合わせに対して、美しい並びを実現するために文字間のスペースを調整する行為を「カーニング」と呼ぶ
   • 「トラッキング」は、まとまったテキストの文字間を調整する行為
5. 「セリフ」と「サンセリフ」どちらかを選ぶ
   • 字体の曲がり角にある飾り（うろこ）がある「セリフ(serif)」
   • 多くの場合、セリフは長文に適している - 飾りのない「サンセリフ(sans-serif)」
   • サンセリフは、児童などの文字を勉強している層や、視覚障害のある人々に好まれる傾向

6. フォントファミリーを考慮する

7. 重要度によって階層（ヒエラルキー）を分ける

8. フォントを組み合わせる
   • 異なるフォントを組み合わせることで、視覚的な階層を確立したタイポグラフィーを作る
   • ポイントは「矛盾するふたつのフォント」「ほとんど区別できないふたつのフォント」を避けること
   • 王道の組み合わせは、「似ている書体」かつ「セリフとサンセリフの違いがある」フォント
9. フォントの種類は最小限にする
   • 複数のフォントを使用する場合、多くても3つまでに制限

10. むやみに中央揃えにしない

11. タイポグラフィーデザインの可読性を重視する

12. 適切な配色を心がける

13. 「はみ出し部分」を取り除く

14. 余白はただの空きスペースではない
    • 余白を賢く使うことで、最も重要な部分のみに焦点を当てられる

15. タイポグラフィーデザインの流行に便乗しない

16. さまざまなデザインからインスピレーションを得る

課題

疑似要素のメリット

HTMLには一切変更を加えることなく、ある要素の内容を変更したり追加したりすることができること

リスト

  ul {
    list-style-type: circle;
  }

リストの行頭記号を変更する
初期値はdisc

bとstrongの違い

• b: 文字を太くする
• strong: 意味を強調する