これから、HTML５の学習を継続的に行っていきたいと思います。ここでは継続的な記事として、不定期でHTMLの学習を連載します。そこで今回は、はじめにということで、HTMLを学習していく意味はどんなことがあるのか、というところから皆さんに学習の意味を知っていってほしいなと思います。
プログラミング初学者にとって最も親しみのある言語がHTMLやCSSかもしれません。もちろん、そうでない方も多いとは思いますが、HTMLが最も知られているプログラミング言語であるということは間違いない事実です。
そんなHTMLを学ぶ理由というのは人それぞれだと思いますが、自身がHTMLを学ぶ目的と、学ぶ言語を間違っていないかということをまず最初に確認しておいてほしいなと思います。
HTML5とは何なのか
HTMLは従来のHTML4から１５年の期間を空けて作られた新たな仕様であり、HTML5の登場が大きな革新をもたらしました。それまではJavaScriptを用いなければできなかった一部のことをHTMLで実装することができるようになり、メンテナンス性を向上させただけでなく、HTMLとCSSだけでも気軽にデザインを楽しむことが出来るようなコードを書くことが可能になりました。
このように、便利なHTML5ですが、初版草案が2008年1月に発表されてから実際に普及するまでには期間がありました。ブラウザごとに実装への対応が異なったためです。そのため、World Wide Web Consortiumにより、2014年10月に勧告が行われたときに各ブラウザの実装状況も改善し、広く扱われるものとなりました。
2017年12月にはHTML5.2が発表され、それと同時にHTML5.3の初版草案も出されましたが、現在も勧告には至っていません。しかしながら、HTML5は現在も開発の続けられているバージョンなので、更に発展していくものだと言えます。
HTMLを学ぶ目的とCSSなどのつながり
HTMLを使用するメディアは、主にホームページやブログなどの記事中・更にブログ全体をデザインするためにHTMLやCSS・JavaScriptを組み合わせて作ります。
ホームページやブログなどの文字を主体としたメディアはHTMLの塊だと言えます。こうして私が書いている文字もHTMLによって認識され、皆さんが読めるような形になっているのです。しかしながら、ブログサービスの場合はテキストエディタに文字を打ち込むだけで文字が成り立ち。表面的にはHTMLを必要としないので、実際にはウェブデザイナーなどの、ホームページのデザインを担当するようなお仕事の方や、ウェブデザイナーまではいかないけれど、自身のブログやホームページのデザインの幅を広くしたいというような方が学ぶ言語となります。
そして、多くの場合HTMLでは足りない部分が出てくるため、その場合とやりたいことの幅に応じてCSSやJavaScriptというHTMLをサポートするような言語を学ぶ必要があります。
もちろん、ウェブデザイナーのように、ウェブデザインを担当するような方の場合はHTML/CSS/JavaScriptの３セットは大変重要なものになり、これができなければお仕事になりません。
３セットの繋がりをイメージするならば、文字は「HTML」、文字や背景の色を変えたりするのは「CSS」、無限下スクロールなどの動きのあるデザインを可能にするのが「JavaScript」です。
他の言語を学んだほうが良い場合
実際には可能ですが、自動化ツールを作りたいだとか、何らかのツールを作りたい場合。ゲームやゲームに関する項目を調整したいという場合に主に使う言語としては選択されにくい言語です。
たとえば、自動化ツールをつくるならばPython、VRゲームを作っていくならUnityなど、それに特化し・ネット上に躓いたときのヒントがおおく散らばっている言語が多くあるため、知識０からツールを作るぞ！ゲームを作るぞ！という場合の学習はあまりおすすめしません。
そして本連載で紹介するのも、あくまでもホームページやブログ記事内で使用するような場合に使用するHTMLの紹介です。
ただ、一般的にプログラミング言語がわかるならHTMLもわかるよね？というような考えの方は多いですし、実際に最低限いじることができるよと言う人も多いです。ですので、プログラミング言語に触れるならばHTMLのコードは最低限でもいいので書けるようにしておきたいところです。
HTMLを学習するために必要なもの
学習のためだけでなく、実用としても使えるツールを紹介していきます。
まず必要なものはエディタです。エディタとは、テキストを入力するためのメモ帳みたいなものです。WindowsやMacにも標準でエディタは搭載されていますが、コードを書くために最適な機能が搭載されているプログラミング用のエディタが存在します。多くの種類のプログラミング用のエディタがありますが、当ブログでおすすめしているのはVisual Studio Codeというエディタになります。
導入については以下を参照して下さい。
そして、もうひとつ必要になるものは自分の使っているWebブラウザです。ただし、ここではMacとWindows、LinuxやChromeBookなどの端末からのアクセスも想定されるので、当サイトの標準ブラウザを「GoogleChrome」と想定します。
GoogleChromeのダウンロードはこちら
新しい Google Chrome で毎日をもっと快適に。Google の最先端技術を搭載し、さらにシンプル、安全、高速…
基本的にはこれだけあれば開発が可能です。次回からはこれらのツールを導入している前提で学習を進めていきたいと思います。
