暑さも峠を越え、少し涼しくなってきましたね。秋晴れの日が続いていますが、気温の変化から体調を崩してしまう人もいるかもしれません。季節の変わり目には十分ご注意ください。

こんにちは、エアコンの効いた部屋で仕事をしていても、まだまだ汗を拭くハンカチが手放せない河嶋です。

 

今回は、WEBサイト制作を行ううえで、多くの人が苦手意識を持っている「HTML」の記述についてご説明し、少しでも苦手意識が改善され、WEBサイト制作に興味を持っていただければと思います。

以前のブログ【WEBサイトで使用される画像形式について】では、WEBで使用する画像形式についてご紹介していますので、よろしければそちらもご覧ください。

 

それでは「コンピューターとの意思疎通に必要なマークアップ」見ていきましょう。

 

マークアップ

 

マークアップとは、WEBサイト制作で記述するHTMLを使って、文章中に目印をつけることで、コンピューターに人間の意図を伝える作業のことを言います。

これだけでは分かりづらいのでもう少し詳しくご説明しますね。

 

今見られているこのページ、HTMLで作られています。

HTMLというのは「HyperText Markup Language」の略称です。

HTMLについては、以前のブログ【今からでも知ってほしい、WEB制作頻出基礎用語①】でもご紹介していますので、よろしければそちらもご覧ください。

 

私たちがWEBサイトを閲覧できるのは、WEBブラウザがHTMLを認識することによって、WEBサイトを表示してくれるからです。つまり、WEBブラウザが認識できるようHTMLを記述しないと、意図したWEBサイトが表示されないようになります。

 

ここで重要なのが、人間同士の意思疎通と違い、コンピューターは人間が書いた文章構造をそのままでは理解できないということです。そこで、どこが見出しでどこが段落なのかを、コンピューターが正しく理解できるようにするため、人間の意図をコンピューターに伝える仕組み、マークアップが必要になります。

マークアップには明確なルールがあるので、ルールに基づいてHTMLを記述することにより、人間の意図を正しくコンピューターに伝えることができます。

 

皆様の中には、すでにHTMLが記述された「ソースコード」を見た方もおられるのではないでしょうか。

（ソースコードというのは、HTMLなどが記述されたテキストです）

予備知識がない状態で見ると、ただのアルファベットの羅列のように見え、「私にはとても無理」と思われるかもしれません。

 

安心してください。

マークアップのルールを知れば、アルファベットの羅列にしか見えなかったソースコードが、規則的なHTMLの記述に見えるようになります。

 

 

 

HTMLの記述ルール

 

マークアップについて、もう少し詳しく見ていきましょう。

 

HTMLを記述する際には、「タグ」と呼ばれる目印を使用します。タグには、開始タグと終了タグがあり、開始タグは「<タグ名>」、終了タグは「</タグ名>」と記述します。開始タグと終了タグの間にテキストなどを記述することで、WEBブラウザに人間の意図を伝えています。

（例：<h1>◯◯◯</h1>）

 

タグにはたくさんの種類があり、使用用途によって使い分けられます。

使用頻度の高いタグを一部抜粋してご説明しますね。

 

<title>◯◯◯</title>

文書のタイトルに使用するタグです。

 

<h1>◯◯◯</h1>

文章の見出しに使用するタグです。

 

<p>◯◯◯</p>

文章の段落に使用するタグです。

 

この他にも、タグは半角文字で記述する必要があったり、終了タグの不要なタグがあったりと、ここには書いていない記述ルールがあります。

もっと詳しく知りたいと思われた方は、ご自身で調べられるとより理解が深まると思います。

 

 

まとめ

 

いかがでしたか？

今回はWEBサイトの仕組み、マークアップについてお伝えしました。

 

一見アルファベットの羅列に見えるHTMLも、ルールを知ることで記述内容を読み取れるようになります。

私が初めてHTMLを見た時、アルファベットの羅列にしか見えなかったことを今でもよく覚えています。

少しの知識さえあれば記述内容を読み取ることができるHTMLについて、このブログを通じ、少しでも身近に感じていただければ幸いです。

 

弊社の強みは、WEBサイトの制作はもちろん、「WEBを通じてお客様のビジネスに結果を出すこと」です。

少しでもWEBに関する悩みをお持ちの方がいらっしゃれば、お気軽にご相談ください。