HTMLとは
あなたが訪れたすべてのWebサイトは、HTMLで書かれたプレーンテキスト文書として始まります。ページに表示される見出し、段落、ボタン、画像、リンクはすべてこのひとつの言語で説明されています。ページにスタイルを適用したり、インタラクティブにしたりする前に、そこに何があるかを説明する必要があり、その説明がHTMLです。
ページはただの構造化されたテキスト
HTMLはHyperText Markup Languageの略です。重要な言葉は**マークアップ**です。HTMLはプレーンテキストを取り、どの部分が見出しで、どれが段落で、どれがリンクかなどをマークアップする方法です。コンピュータに従うべき指示を与えているのではありません。コンテンツにラベルを付けて、ブラウザが各部分が何で、どのように表示するかを知ることができるようにしているのです。
手作業でドキュメントをフォーマットするのと考えてください。タイトルを囲み、セクション見出しに下線を引き、写真の周りに枠を描きます。HTMLはそのブラウザが理解できる方法で、その囲むことと下線を引くことをする方法です。
<h1>Welcome</h1>
<p>This is a paragraph of text on my first web page.</p>2行、2つの構造：1つは見出し、1つは段落です。ブラウザはラベルを読み、最初の行を大きく太く表示し、2番目を通常の本文テキストとして表示します。
要素、タグ、属性
HTMLのほとんどは**要素**で構成されています。要素は通常、開始タグ、コンテンツ、閉じるタグを持ちます。
<p>Hello there.</p><p>は開始タグ、</p>は閉じるタグ（スラッシュに注意）、「Hello there.」はその間のコンテンツです。合わせると段落要素になります。タグはラベルであり、コンテンツは訪問者が読むものです。
タグに属性を使って追加情報を付与することもできます。リンクはどこに行くかを知る必要があるため、href属性で指定します。
<a href="https://scrimba.com">Visit Scrimba</a><p>...</p>のようなものです。属性は開始タグに入り、リンクがどこを指すかなどの詳細を追加します。すべてのタグを暗記することについて心配しないでください。必要に応じて、少しずつそれを学びます。 HTMLとCSSおよびJavaScriptが仕事を分担する方法
完成したWebページは通常、3つの言語から構築され、各言語には1つの仕事があります。
- HTMLは構造です。見出し、テキスト、画像、ボタンです。
- **CSS**はスタイルです。色、フォント、間隔、レイアウトです。
- **JavaScript**は動作です。クリック、入力、またはスクロール時に何が起きるかです。
それを考える一般的な方法があります。HTMLは家の壁と部屋で、CSSはペイントと家具で、JavaScriptは物事をオンにする電気です。構造が存在するまで、塗装または配線するものがないため、最初に壁を学習しています。
完全なページへの最初の外観
これは完全であるが小さいWebページです。次の章で適切にそのすべての部分に会うため、今のところ詳細について心配しないでください。今のところ、既に見たタグと属性すべてで作成されていることに注意してください。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>My first page</title>
</head>
<body>
<h1>Welcome</h1>
<p>This is a paragraph of text on my first web page.</p>
</body>
</html>上から読んでください。最初の行はこれが現代的なHTMLページであることをブラウザに伝え、<html>はすべてをラップし、<head>はページタイトルのような舞台裏の情報を保ち、<body>は実際に見えるものを保ちます。前からの見出しと段落は、訪問者のためのコンテンツであるため、本文内に存在します。
<html>で<head>と<body>を包括しています。ヘッドは舞台裏の情報で、本文は人々が見るものです。次に適切にそれを分解するため、クイックルックは今必要なすべてです。