はじめに
2024年10月からデイトラのWeb制作コースの受講をスタートしました。
アウトプットをしてしっかり知識として定着できるよう、記事に残しながら進めています。
OneNoteにメモしながら受講したものを記事にまとめていますので、
実際の受講日と記事の公開には若干のタイムラグがあります。
なるべくリアルタイムになるように心がけますが、受講優先のためご容赦ください。
これからデイトラWEB制作コースの受講を考えている方
実際に受講した記録になりますので、雰囲気や大変度合いを測っていただけるかと思います！
現在進行形でWEB制作コース受講中の方
一緒に頑張っていければうれしいです！X（旧Twitter）などで交流しませんか！
卒業生の先輩方
懐かしんでいただければ・・・笑
自分なりに調べた記録も付加していますが、もし間違ってるよー！等ございましたらこっそり教えていただけますと嬉しいです。
初級編DAY2の押さえておきたいポイント
HTML書いてみよう！
見出しと段落
見出しはhタグ。
hはheading（見出し）の略で、よく使うのは<h1>〜<h4>まで。
h1は最も重要な見出し（ページタイトルなど）で、h2→h6になるほど重要度が低い見出しになる。
段落にはpタグを使う。
pはparagraph（段落）の略で、HTMLにテキストを書くときは<p>タグで囲む。
リンク
リンクをつける時はaタグを使う。
aはAnchor（いかり）の略で、「リンク先へ錨を置いておく」とイメージすると分かりやすい。
aタグは<a href=””></a>の形式で書き、飛ばしたいリンクのURLを””（ダブルクォーテーション）の中、ブラウザ上で表示したい文字を<a>と</a>の間に書く。
画像
画像を表示する時はimgタグを使い、<img src=”画像のURL”>の形式で書く。
imgはimage（画像）の略、srcはsource（出典）の略。
リスト
リストには数字なしリスト（ulタグ）と、数字付きリスト（olタグ）の２種類がある。
ulはunordered list（順序がないリスト）の略、olはordered list（順序のあるリスト）の略。
数字なしリストは<ul>と<li>をセットで使い、
<ul>～</ul>は、囲んだ範囲がリストであることを示したうえで
<li>～</li>は、リストの中で表示する項目をひとつずつ書く。
数字付きリストは、<ul>の代わりに<ol>を使う。
<ol>～</ol>でリスト表示したい範囲を示し、その中に<li>～</li>で具体的な項目を作ると上から1、2、3…と自動的に番号が振られる。
コメント
!– と –>に囲むことでコメントが書ける。
コメントは複数行になってもOK。
注釈をつけるだけでなく、後で使うかもしれないコードを一時的に除外する（→コメントアウトという）のにも使える！
また、メモや一時修正のための使い方のほかに、ブロックの区切りを分かりやすくするためにもコメントを使う。
グループにして整理する
HTMLは1ページ数百行各ケースもざらにあり、ごちゃつくことが多い。
どの部分を書いているのなどわかりやすくするために、HTMLではグループ化を積極的に行う！
グループ化するときに使う代表的なタグがdivタグ。divはdivision（区分・部分）の略。
- HTMLではコードを複数のブロックに分けて管理するのが基本
- <div>を使うと複数のコードをグループ化できる
- <div>～</div>で囲まれた範囲にはまとめてCSSを設定できる
タグに属性をつける
属性は追加的な情報のことで、タグに名前を付けたりタグ内の要素の言語を指定したりする。
よく使う属性は以下。他にもたくさんある！
- id属性：様々なHTMLタグで使われる。要素に好きな「固有名」を付ける
- class属性：様々なHTMLタグで使われる。要素に好きな「分類名」を付ける
- src属性：imgタグ（画像を表示するタグ）で使われる。画像ファイルの置き場所を示す
- href属性：aタグ（ハイパーリンク）で使われる。リンク先を示す
初級編DAY2の追加で調べたいことメモ
- aタグで作ってみたリンクは同じタブでリンクが開いた。
別のタブでリンクを開くにはどうしたらいい？ - VS Codeでimgタグを選ぶと、altという属性がついてきた。これはなに？
- HTMLで終了タグがいらないものは他にどんなものがある？
初級編DAY2の感想と記録
基本的なHTMLのお勉強。
HTMLは少しかじったことがあるので、全般的にすんなり理解できた。
とはいえ、いっきにがっと詰め込まれた印象。
Progateではかなーり丁寧に解説がされたが、デイトラはざざざっと必要なポイントを説明して・・・
「あとは実践しながら覚えよ！」みたいなスタンスを感じる。
好みはあると思うけど、私はこの感じは嫌いじゃない！
さてさてどんどんいこう！
