【HTML5入門】1-1 HTMLとは何か?

  • このエントリーをはてなブックマークに追加
  • Pocket
  • LINEで送る

※本記事は、Tech Academyの下記YouTube動画を参考に書かせて頂いております。

筆者がプログラミングに最初に触れたのは、中学時代の技術の授業でした。当時はインターネットが普及してまだ間も無く、「HTMLで自分のサイトを作ろう」みたいな感じのテーマの授業だった記憶があります。

本記事執筆時点(2020年4月)で、私はプログラミングスクール「テックキャンプ エンジニア転職」を卒業しました。カリキュラムでも軽く触れたHTMLですが、「改めて基礎からアウトプットをしてみよう!」という軽い気持ちで、ブログにてアウトプットをしてみることにしました。

では、早速いってみましょう。

HTMLとは

HTMLは、私たちが普段インターネットなどで目にするWebページの表示を担っている言語です。俗にこれをマークアップ言語と呼びます。

実際に私たちが目にするWebページの文章や文字は、このHTMLを使って書かれている場合が非常に多いです。

しかし、HTMLだけでは、非常に簡素なWebページとなります。そこで、(後に出てくる)CSSJavaScriptなどを使って、ページのデザインをしたり、ページに動きをつけたりすることが可能になります。基本的にHTMLは、これらの言語と組み合わせて使用する言語となります。

HTMLファイルを作るためのルール

HTMLファイルを作るためには、大きく分けて以下の3つのルールがあります。

  • HTMLで書く
  • ファイル名の最後に「.html」をつける
  • テキストエディタで書く

それぞれ順番に見ていきましょう。

HTMLで書く

大原則ですが、HTMLファイルの中身にはHTMLのコードを記述します。厳密にいうと、いろいろな書き方を用いることで、それ以外のコードを書くこともできるのですが、現時点では、HTMLファイルの中には、原則、HTMLのみを記述するという認識でOKです。

ファイル名の最後に「.html」をつける

HTMLをWebページに反映させるためには、まず、HTMLを書き込むためのHTMLファイルを作る必要があります。ファイルを作る方法は非常に簡単で、作りたいファイルの名前の後ろに「.html」と記述するだけです。

例えば、”index”という名前のHTMLファイルを作りたい場合は、ファイルの名前を「index.html」とすれば、”index”という名前のHTMLファイルが完成します。

ここでいう「.html」は、一般的に拡張子と呼ばれるもので、ファイルがどんな種類のものなのかをわかりやすくします。例えば、音声ファイルだったら「.mp3」とか「.wav」、動画ファイルだったら「.mp4」や「.mov」などがありますよね。これらも拡張子の一種です。

テキストエディタで書く

HTMLは、パソコンに標準で入っているメモ帳などでも書くことができるのですが、コードを記述する際は、テキストエディタと呼ばれるソフトを使用するのが一般的です。

テキストエディタは、コードを書くのに特化したメモ帳のようなもので、HTMLに限らず、いろんな言語の記述を色分けして見やすくしてくれたりします。動画では「Sublime Text」が紹介されていますが、他にも「Atom」や「Visual Studio Code」など、数多くのテキストエディタが存在しています。

筆者は、テックキャンプで「Visual Studio Code」を使用したので、それをそのまま使用していますが、特に機能などには大きな違いはないかと思いますので、自分の好きなテキストエディタを使用されると良いと思います。

おわりに

今回は、初級HTML第一弾ということで、Tech Academyの動画に沿って解説をしてみました。今後も本動画に沿って記事を更新していく予定ですので、引き続きお楽しみにして頂けると幸いです。

次の記事はこちら

  • このエントリーをはてなブックマークに追加
  • Pocket
  • LINEで送る
     

コメントを残す

*