【基礎学習 Vol.1】HTMLとは?

なんとなくHTMLというワードは聞いたことはありますよね。
私たちが見ているwebページは全てHTMLでできているので、まずはHTMLについての理解することから始めましょう。

HTMLとは?

webページを作るときにメジャーなマークアップ言語の1つで、ホームページの文章に意味や役割をつけるための言語になります。

HTMLの種類

  • HTML
  • XHTML
  • HTML5

「HTML」「XHTML」「HTML5」などがある。何が違うのかというと、使えるタグの種類が違ってきます。出てきた順番は、HTML→XHTML→HTML5の順です。

違いとは?

  • HTML
    これは今でもよく使われています。対応しているブラウザが多く、記述方法に比較的決まり事が少ないのが特徴です。
  • XHTML
    こちらも対応しているブラウザは多いですが、記述方法に比較的決まり事が多く、結構厳密です。良い面は、独自のタグ(要素)を定義することことができる点があげられます。
  • HTML5
    これが最新のHTMLであり、対応しているブラウザでもすべての機能までは対応していないので注意が必要です。記述方法については、比較的決まりごとが少ないです。メリットは、検索エンジン等がウェブサイトの構造をより詳しく把握できるようになったことと、他言語や埋め込みファイルに対して柔軟に対応できる点があげられます。

どれを使えばいいの?

HTML5です!

今から勉強を始める人はHTML5を使うのがいいのではないでしょうか。HTML5は2014年10月28日にW3C【インターネットの標準化団体)より勧告された新たなHTMLということになります。言い換えれば「これからはHTML5で書いていった方がいいですよ。」と推奨されたものということになります。

HTML5のその後どうなの?

2014年10月にHTML5が勧告されてから、2016年11月にはHTML5.1勧告→2017年12月にHTML5.2勧告されています。(W3Cでは仕様の策定作業が継続されておりすでにHTML5.3の草案も存在しています。)

HTML5を勧める理由

2020年にFlashが終了することが決まっています。2年ほど前に発表されてから現在ではあまり見かけなくなりましたが、たまに 「Flashコンテンツは再生できません」 と表示されるときがあり、一部のサイトではまだFlashのままのものを見かけます。2020年末にはサポートも終了してしまいますので、早めにFlashから他のものに移行する必要があります。

そこでFlashにとって代わるものとしてHTML5がその機能を果たしてくれます。 以前では難しかった高度な機能を実現するためのAPIがHTML5に追加され、特筆すべきは動画や音声データを画像を扱うように簡単に扱うことができるようになりました。
また、文書構造についての新しいタグが追加されたことにより、検索エンジンやブラウザでよりはっきりと文書構造を伝えられるようになりました。

HTMLのソースコードとは?

サイトの何もないところ上で右クリックすると「ソースの表示」と出るのでそれをクリックすると見られる。この並んでいる英語の文字をソースコードと言います。このソースコードでwebページに「こうやって表示して」とか「こんな風に動いて」とかの命令を出す感じ。だいたいどのサイトでも見られるのでやってみてください。もちろんこのページでも。

コードに適したテキストエディタをダウンロードしておこう【無料】


このソースを書くのに必要になるのがテキストエディタ(文を書くためのソフト)です。パソコンを購入したら標準でwindowsにはキストドキュメントやメモ帳が、Macにはテキストエディットが入っていて、もちろんそれを使うのもアリです。
ただテキストやメモ帳にはコードを書くために作られたものではないので、コードを書けるようになったときに不便さと使いにくさを感じるかもしれません。
例えば、コードに対応したテキストでは、””(ダブルクォーテーション)を一発で2つ出すことが出来たりするからです。””はコードを書く際にとても良く使うものの一つなので、それだけでも面倒臭さが圧倒的に変わってくると思います。

おすすめのテキストエディタ

ちなみに私はVisual Studio Codeを使っています。上記以外にもいろいろなテキストエディタがありますので、お好みのものをダウンロードしておきましょう。

雑談:私のパソコンではBracketsもAtomも色々試してみましたがダウンロードエラーになりダウンロードできませんでした。ダウンロードにそんな時間をかけていられないので他にも使えるものをたくさんあるので自分で使ってみて使いやすいものを探すのもいいのではないでしょうか。

まとめ

HTMLはホームページの文章に意味や役割をつけるためのメジャーな言語の一つで、これから勉強するならHTML5を勉強しましょう。
そしてコードを書くのに適したテキストエディタをダウンロードしておきましょう。