HTMLとは

Webサイトを表示させる仕組みについて

Webプログラミングを学習するにあたって、ほとんどの人がまず最初に学習するのがHTMLです。HTMLは非常に言語としては学習コストが低いです。サーバーサイドの言語では全くの無知の方では何をしているのか分からないのに比べ、HTMLではプログラミング初学者の方でもWebサイトとして自身で制作してイメージが着くからだと思います。

しかし、プログラミング初心者の人は「HTMLとは？」「HTMLって何なの？」と感じているのではないでしょうか、そもそもどうやってサイトを表示しているのかと疑問がつきないのではないでしょうか？

この記事では、IT全般初心者の人、プログラミングを学習しようとしている方でもHTMLが理解できるよう、難しい専門用語を使わずに紹介していこうと思います。

これを読み終えた頃には、HTMLを理解してプログラミングやWedサイトを作ってみようと思っていただけたら幸いです。

HTMLの役割は？

ほとんどのWebページはHTMLとCSSという言語でその見た目が作られています。動的な動きを実装させるにはJavaScriptと言う言語も使用します。この言語を使いこなせば皆様が普段使用している検索サイトからショッピングサイトまで再現できます。

文字を表示している部分をHTMLで表示しているのですがメモ帳のように入力しても表示することができません。HTMLにはタグを使ってただの文字がh1（見出し）やp（段落）といった意味を持つようになります。

一言でいうと、タグとは、「文字（テキスト）に意味を与えてあげる印のようなもの」と言えます。

見出しに使いたい文字がある時は、その文字を＜h1＞＜/h1＞で囲ってあげます。
段落に使いたい文字がある時は、その文字を＜p＞＜/p＞で囲ってあげます。

上記のタグ以外にも、HTMLには多くのタグがあります。次にタグの中で比較的使用回数が多いものを紹介していきます。

HTMLタグの種類

HTMLには多数のタグを組み合わせてサイトを表示しています。

• ＜ｈ1＞タグ

文字のサイズを調節するタグになります。見出しやサイズを大きくして強調させたい時に非常に有効に使えます。ｈの隣の数値を変えることによってサイズを調節します。

• ＜p＞タグ

段落を作るタグになります。HTMLではワードやメモ帳の書き方と違いエンターを押しても段落に分かれません。PCが理解できる書き方で書いてあげないと上手く読み取れないので気をつける必要があります。

• ＜li＞タグ

文字を箇条書きにしたい時は＜li＞タグを使います。但し、＜li＞タグを使う時には、＜ul＞タグで囲まなければいけません。

• ＜strong＞タグ

文字を太くして、強調したい時に使います。

• ＜/br＞タグ

普段のエンターのような機能をします。段落を変えたくないが段を変えるときには有効なタグになります。

そもそもHTMLとは？

HTML（エイチティーエムエル、HyperText Markup Language）は、ウェブページを作成するために開発された言語です。 前述したように現在、インターネット上で公開されてるウェブページのほとんどは、HTMLで作成されています。

ハイパーテキスト・マークアップ・ランゲージといい簡単にいうとWedページから他のWedページに移動することや文書の各部分が、どのような役割を持っているのかを示すことで見出し・段落・表・リストなど、文書の中で各部分が果たしている役割が分かるように目印をつけます。この見出しをコンピュータが検出し統一することによって安定してWebサイトを表示することを可能にしています。

HTMLで見た目を整えるには

HTMLでは文字を出力することは可能ですが皆様が普段見ているようなサイトを表示するにはCSSの存在が必要になります。

CSSとは「Cascading Style Sheets（カスケーディング・スタイルシート）」の略で、構造を指定するHTMLと違い、装飾を担当しています。

CSSを使うと、ページの色や余白、フォントの種類や行間設定など、さまざまな装飾が可能となります。

まとめ

もし自身でサイトを作りたいと持てくれた方はPCに標準インストールされている「メモ帳」などで、HTMLを使った文字表示から始めてみるといいかもしれません。プログラミングというと敷居が高そうに聞こえるかもしれませんが案外簡単に取りかかることができます。

プログラミング初学者にとってHTMLは初めに学習しやすいプログラミング言語になってますのでぜひHTMLを学習してみてください。HTML　CSSに慣れた後他の言語にも興味を持っていただけると幸いです。