インターネットで何かを検索したり、ブログを読んだり、ショッピングをしたり…。
私たちが普段目にしているウェブサイトのほとんどは、「HTML」という言語によって土台がつくられています。
「HTMLって聞いたことはあるけど、プログラミングの一種？」
「専門知識がないと難しそう…」と感じる方もいるかもしれません。
でも実は、HTMLはとてもシンプルで、Webページの“中身”を伝えるためのルールのようなもの。
この記事では、HTMLとは何か、どんなことができるのかを解説していきます。
この記事はこのような人におすすめ！
- HTMLがどんな言語かを知りたい初心者の方
- Webサイトの仕組みや基本を学びたい人
- HTMLで「できること・できないこと」を理解したい人
HTMLとは何か？
HTML（エイチ・ティー・エム・エル）とは、「HyperText Markup Language（ハイパーテキスト・マークアップ・ランゲージ）」の略称です。
一見すると難しそうな名前ですが、簡単に言えば、Webページの構造や中身を記述するための“設計図”のような言語です。
たとえば、家を建てるときに最初にやることは「設計図」や「骨組み」を作ることですよね。
設計図がなければ柱の位置や部屋の大きさが決まらないのと同じように、ウェブページもHTMLがなければ情報を正しく表示できません。
HTMLは、まさにその設計図や骨組みにあたる存在です。
あなたが今読んでいるこの記事も、見出しがあったり、段落が分かれていたり、画像やリンクが含まれていると思います。
これらの情報はすべて、裏側ではHTMLを使って「ここは見出しですよ」「ここはリンクですよ」「ここに画像を表示してください」といった指示が書かれているのです。
HTMLはプログラミング言語なの？
「マークアップ言語」と呼ばれるものの一つです。
少し聞き慣れない言葉かもしれませんが、マークアップ言語とは、文章に「これは見出しです」「これは段落です」といった意味付けを行っていくものです。
たとえば、ふつうの文章だけでは「これは見出しです」「ここからが本文です」とコンピュータには伝わりません。
ですが、HTMLを使えば、<h1>というタグで「これは見出しですよ」と教えたり、<img>で「ここに画像を表示してね」と指示したりできます。
つまりHTMLは、文章に意味をつけて、Webページとして正しく表示されるように手助けしてくれる言語です。
HTMLタグについて
HTMLの世界では「タグ」という要素を使用します。
タグは < > で囲まれた部分のことです。
<h1>これは大見出しです</h1>
<p>これは段落(本文)です</p>上の例では、<h1> と</h1> で囲まれた部分が「大見出し」として、 <p>と</p> で囲まれた部分が「段落」として表示されます。
タグには「開始タグ」と「終了タグ」があり、終了タグには / (スラッシュ)が含まれます。
基本的には、この「開始タグ」と「終了タグ」の2つでコンテンツを挟むような形で使用します。
HTMLを使ってできること
「HTMLはWebページの骨組みをつくる言語」と聞いても、具体的に何ができるのかピンと来ない方もいるかもしれません。
HTMLを使って実際にどんなことができるのか、身近な例を交えてご紹介します。
文章や見出しを表示できる
まず基本となるのが、文章の構造化です。
HTMLを使うと、ニュース記事やブログのように、見出しを付けたり、段落を分けたりして、読みやすい文章を表示できます。
上の例のようにHTMLを書くと、「旅行の思い出」という見出しと、その下に続く文章が表示されます。
リンクを作れる
HTMLでは、ほかのページや外部サイトに飛ぶリンクも簡単に作れます。
たとえば、次のように書くと自分のSNSやブログへ読者を案内することができます。
このコードを使えば、「WEBのあれこれを見る」という文字をクリックするだけで別のページへ移動できるようになります。
画像や動画を表示できる
HTMLを使えば、写真やイラスト、動画などのメディアもページに埋め込むことができます。
たとえば旅のブログなら、撮影した写真を表示したり、YouTube動画を載せたりすることができます。
このようなコードで、ページ上に画像を表示できます。
表（テーブル）を作れる
HTMLでは、データを表にして整理して見せることもできます。
時間割や料金表、商品のスペック一覧などに使われます。
次のように書くとシンプルな表が表示され、情報が整理されて見やすくなります。
HTMLを使ってできないこと
一方で、HTMLにはできないこともあります。
たとえば以下のような機能は、HTML「だけ」では実現できません。
HTMLは、Web制作においてとても重要なパーツですが、実際にWebサイトを作るとなると、HTMLだけで完成するわけではありません。
骨組み（HTML）にデザイン（CSS）や動き（JavaScript）が加わって、私たちが普段目にするWebサイトになります。
HTML単体でも
シンプルなページは作れるよ！
HTMLを勉強するには、どうしたらいい？
ウェブページを作るための第一歩として、HTMLの学習は欠かせません。
「でも、何から始めればいいの？」「プログラミング経験がなくても大丈夫？」といった疑問をお持ちの方も多いのではないでしょうか。
HTMLは「マークアップ言語」なので、プログラミングが未経験の方でも比較的学びやすいです。
ここでは、初心者の方がよく抱く疑問について解説します。
この内容を参考に、ぜひHTML学習への一歩を踏み出してみてはいかがでしょうか。
Q HTMLを学ぶのにどれくらいの時間がかかる？
基本的なHTMLの概念と主要なタグを理解するのは、集中して学べば1〜2週間程度です。
ただし、実践的なスキルを身につけ、より複雑なウェブページを作れるようになるには、継続的な学習と実践が必要です。
Q HTMLとCSSはどちらから学ぶべき？
まずはHTMLの基本を学び、ウェブページの構造を理解した上で、CSSに進むのがおすすめです。
HTMLでコンテンツの構造を作り、CSSでそれをスタイリングするという流れが自然です。
Q HTMLは独学でマスターできる？
HTMLの基本的な考え方は、非常にシンプルなため独学でもマスターすることは可能です。
参考となるサイトや参考書が充実しているという点も、独学しやすい理由の一つです。
Q HTMLはどうやって勉強したらいい？
はじめは、オンライン学習サイトや参考書などを活用しながら学習を開始し始めるのがおすすめです。
Web制作初心者向けにHTML5とCSS3の基本を丁寧に解説した入門書。
見開きごとに「説明＋図解・コード例」がセットで構成されていて、視覚的にも理解しやすいのが特徴です。専門用語もかみくだいて説明されており、初学者でも安心です。
HTMLとCSSの基本をやさしく解説していて「スラスラ」と読めます。
初心者がつまずきやすいポイントを丁寧にフォローしながら、HTMLとCSSの基本を学べる入門書です。実際に手を動かしながらWebページを作るステップ式の解説が魅力です。
人気ブログ「Webクリエイターボックス」の運営者であるMana氏による、初心者にもわかりやすいWeb制作の入門書です。現場で使える知識を豊富に持つMana氏が、長年Webに関する情報をやさしく丁寧に解説してきた経験を活かし、読み手にスッと理解できるように構成されています。
試し読みなどで、学習スタイルに合ったものを選ぶとより安心だね！
