こんにちは！今回は初心者向けにHTMLについて説明します！
- HTMLって何？
- Web系のプログラミング言語勉強したいんだけど何からすればいいの？
- HTMLのポイント教えて
こんな疑問にお答えします。
勉強する中で知っておいた方がいいことはこちらです。
- HTMLの中には色々な言語を直接書ける（ファイルを分けることもできる）
- HTMLの新旧バージョンによって使えるタグが違う
- HTMLの要素には最初からCSSが当たっている
詳しく説明していきます。
HTMLとは
HTMLとはHyperText Markup Language（ハイパーテキストマークアップランゲージ）のことです。
ウェブページを作るための言語になります。
ホームページは色々なHTMLファイルの集まりでできています。
ちなみにプログラミング言語ではなくマークアップ言語というらしいです。（どうでもいい）
具体的にいうと見出しを作ったり、文字段落を作ったりすることができます。
このブログ記事で言うと見出しは大見出し「【初心者向け】HTMLのつまずきやすいポイント」がh1で、小見出し「HTMLとは」がh2にあたります。
Webサイトのテキストで構成されている部分を表現しています。
ちなみに文字の大きさを変えたり、色を変えたりするのは「CSS」という別の言語の役割です。
アニメーションのように動きをつけるなら「JavaScript」というプログラミング言語を使います。
HTMLは1989年に開発されより使いやすいようにバージョンアップを繰り返しています。
2020年現在で最新のものはHTML5になります。
HTMLでできること
装飾がいらず、こだわらなければシンプルなWebページはHTMLだけでも作れます。
一昔前であればそんなWebサイトも見ましたが、近年は見たことがないですね。
HTMLだけで使われることはほとんどありません。
最低でもHTMLとCSSを組み合わせることになるでしょう。
HTMLで初心者が初めに習うものは以下になります。（細かく言うともっとあります）
- 見出しを作る<h>
- 本文を作る<p>
- リンクを作る<a>
- リストを作る<ol><ul><li>
- ボタンを作る<button>
- 表を作る<table>
- チェックボックス等を作る<input type=”checkbox”…>
- 画像を貼り付ける<img>
ちなみにブログを書いているとここら辺の知識が生きてきます。
HTMLのポイント
以下は僕がHTMLを勉強していく中でつまずいたり、悩んだりしたポイントをまとめたものです。
HTMLは新旧バージョンで使えないタグがある
HTMLって頑張れば<div>タグで結構なんでも押し通せます。
でも最新のHTMLでは作業の効率を上げるためにWeb制作で必要な機能を最初から盛り込んでくれています。
<nav>タグや<article>タグです。
しかし、HTML5で追加されたのでそれ以前のWebサイトでは使われていません。
そこで模写コーディングとか検証ツールとかで開くサイトによって使っているタグがバラバラなことがよくあります。
コーディングは最新の書き方でいいですが、従来の書き方も知っておいた方がいいですね。
HTMLには最初からCSSが反映されている
HTMLとCSSは完全に分けられるようなものではありません。
HTMLもデフォルトの段階である程度見やすくなるようにCSSがかかっています。
場合によっては打ち消す作業が必要になります。
<body>の周りになんか余白があるなーって思って一時期悩んだものです。
HTMLの中には色々な言語が書ける
HTMLはwebページの基本であり中心です。
HTMLファイルの中に「CSS」や「JavaScript」、「PHP」などを直接書き込むことができるんです。
大規模だったり人によっては一つ一つ別々のファイルで書くこともありますが、HTMLファイルの中に書くこともあります。
僕は最初HTMLファイルを開いてもどこまでがHTMLの記述かわかりませんでした。
勉強しているうちにだんだんわかるようになります。
１つのWebページを作るにしても色々な言語を掛け合わせています。
少しずつ理解できる範囲を広げていくといいと思います。
まとめ
HTMLを学習していて僕がつまづいたことをまとめました。
HTMLだけの勉強をするよりもCSSやJavaScriptなんかを一緒に勉強していくうちにわかっていくことも多いです。
まずはHTML/CSSで勉強するのをお勧めします。
割とそれだけでも結構なことができちゃいます。
コメント