見出し画像

初めてのHTML入門③

HTMLの基礎

HTMLのファイルを作るにあたって、必ず必要になるタグが大きく4種類あります。まずはそのことについて学んでいきましょう。

HTMLに必要なタグ

・doctype
これは、このHTMLファイルがどのようなHTMLで書かれているのかを伝えるタグです。
HTMLという言語は、今までに様々なバージョンアップを重ねてきました。それを踏まえて、このHTMLはどのバージョンのHTMLで書かれているのか、ということを伝えるために必要なものです。

・html
このタグの内側が、HTMLの本文(内容)であることを伝えるタグです。
「ここから」「ここまで」がHTMLですよ、ということを伝えることができます。


そして、htmlタグの内側に書かなければならない要素が二つあります。

・head
これは、このHTMLファイルを解釈する上で必要な情報を書く場所を用意するタグです。

・body
このHTMLファイルの文書の内容を示すタグです。
つまり、Webページで見せたい部分の内容を基本的に書くエリアです。

実際にHTMLを書いてみる

↓一番最初にスペースを空けずに書き始めるという決まりがあります
<!doctype html>←HTML5の場合はこのように記述します
<html lang="ja">
↑このように記載することでこのHTMLで使われる言語が日本語で書かれていることを示すことができます
↓<head>と<body>を書く際には、htmlの内側であることを分かりやすくするために”Tab”キーで字下げ(インデント)をしておきましょう。
 <head>
 </head>
 <body>
 </body>
</html>

それでは、ここまで書けたら保存してみましょう。
デスクトップに「html」というフォルダを作り、ファイル名は「index.html」とします。
この「index.html」ですが、多くのウェブサーバーがこのファイルをまずは探すという指示を持っていることが多いです。このルールを覚えておけば、まず最初に作るファイルは「index.html」とするということを覚えておくことができると思います。

<!doctype html>
<html lang="ja">
 <head>
 </head>
 <body>
 </body>
</html>

この状態では、まだ表示したい内容が書かれていません。
中身については、この次の内容で、勉強していきましょう。

この note は”TechAcademy”の動画で学んだことを文字に起こして
備忘録及び自分のアウトプットとして公開しています。
https://youtu.be/LlnwZaYRFcQ
実際に動画を見ながら手を動かすのも有効だと思います。
いきなりハードルを上げると挫折してしまうので、簡単なことから継続して徐々にレベルアップしていきましょう。

この記事が気に入ったらサポートをしてみませんか?