WEBサイトを作りたい場合はまずHTMLを理解していないと作れません。プログラムでWEBサイトを作るとしても最終的にHTMLで出力しなければならないためWEBコンテンツに関わるすべての人が勉強しなければならない要素です。

HTMLの意味

HTMLとは「ハイパーテキスト・マークアップ・ランゲージ（Hyper Text Markup Language）」の略称です。マークアップと書かれている通り、プログラミングではなくHTMLタグと呼ばれる独自のキーワードで文章を囲います。

HTMLで作られたファイルの拡張子は「.html」となり、このファイル自体はただのテキストファイルです。メモアプリで保存されたファイルの拡張子を.htmlに変更するだけでブラウザで表示できます。それくらい特別なファイルではありません。拡張子を.htmlとすれば単純にブラウザがWEBページなんだなと判断して表示しれくれるからそうしているだけです。

そして、画像などの外部ファイルを埋め込む手段がありますが、HTMLはあくまでも文章に関わる記述のみになります。装飾などの見た目に関する設定はCSS（スタイルシート）と呼ばれる設定で行います。このCSSも必須技術ですのでHTMLと合わせて勉強する必要があります。

HTMLとは具体的にどういったものか

Wordなどの文章作成アプリを利用したことがあるでしょうか。簡単に行ってしまえばWordのような文章作成アプリで作られた文章ファイルと同じです。実際にWordでWEBページを作ることが可能だったりします。Wordには見出しボタンがありますが、HTMLの場合は<h1>といったHTMLタグで見出しを自分自身で記述する必要があります。

HTMLを習得してWEBサイトを作っていると扱う機会が出てくると思いますが、基本は手書きのHTMLをWordのように便利に作成できるツールが存在します。有名どころでadobe製のDreamweaverがあります。それとは別にCMSと呼ばれるブログツールをレンタルサーバーで無料で設置できるのですが、有名なCMSにWordPressがあり、そのWordPressの記事投稿はまるでWordを扱うようにHTMLを記述してくれます。

HTMLタグとは

HTMLはマークアップ言語です。文章をHTML独自のキーワードで囲むことで文章に意味を持たせます。例えば文章を示すHTMLタグに<p>があります。記述は下記のように書きます。

<p>今日はいい天気ですね。明日も晴れると良いな。</p>

文章をただ<p>で囲むだけです。これがHTMLタグの基本構造です。

次は見出しを意味する<h1>を見てみましょう。

<h1>激安！ニンジン３本 ９９円セール</h1>

<p>早いものがちです。お一人様９９本まで。</p>

これで見出しと文章を表示できます。この<h1>や<p>といった意味のあるHTMLタグはブラウザがきちんと理解してくれます。検索エンジンも理解するのでSEOとしても重要で、適切なHTMLタグを使用する必要があります。

意味のないHTMLタグもある

HTMLタグに<div>や<span>といったいくつか意味のないタグがあります。しかし、意味がないからこそWEBページのデザイン調整のために多用されます。

HTMLが難しいと感じる場合

勉強を始めたばかりの頃はHTMLタグのそれぞれの意味がわからずどう作れば良いのか迷うかもしれません。実は全て<div>タグで書いてしまっても問題ありません。SEOを考えると正しいタグを使うことは重要ですが、結局のところ画面を見ているユーザーに情報を正しく見てもらえれば良いわけです。

例えば無料ブログがあると思いますが、無料ブログで書いた記事は<div>だけで作られていたりします。見出しなどが無いのでSEOは弱いですがそれでもGoogle検索などでヒットします。

HTML構文ルールとして正しい記述を徹底しなければ怒る人がいますが、無視してください。ルールを守ることに対した意味はありません。とりあえず各種ブラウザに思った通りのデザインが表示されていれば正解です。
まず始めはHTMLタグの意味は深く考えずにデザインイメージをWEBページ化することを優先で学びましょう。勉強する中で<table>や<ul>などの便利なタグを使ってみたりしていれば自ずと覚えます。

WEB制作を学ぶ上で最も重要なのはデザインイメージをHTML＆CSSで作れるようになることです。まずはレイアウトを自在に組めるように修練しましょう。