コンテンツにスキップ

HTML:最初の一歩

HTMLってなに?

htmlというのは、 Hyper Text Markup Language(ハイパーテキストマークアップランゲージ) を略したものです。 Webサイトを作るときに使います。


Webサイトのソースをのぞいてみよう

ソース というのは、Webページの裏側にあるHTMLのことです。ソースは英語で「元になるもの」という意味です。

TENTOサイトのソースを見よう

まず、TENTOサイトを開きます。

TENTOサイト

ページ上で右クリックして、「ページのソースを表示」を選びます。

ページのソースを表示

ソースが表示されます。なにやら複雑そうです!

ソース表示


HTMLファイルを作ってみよう

サイトのソースは見えてもいじれませんでした。今度は、自分でHTMLファイルを作ってみましょう。

テキストエディタ

HTMLファイルを作ったり編集するには、 テキストエディタ と呼ばれる、プログラミングに向いた文字編集ソフトを使います。 Visual Studio Code(ビジュアルスタジオコード) がおすすめです。無料でダウンロードできます。

やってみよう

  • まず、テキストエディタを開き、「ファイル」メニューから「新規作成」して次のように入力します。
日記.html
<h1>今日の日記</h1>
<p>朝起きて歩いていたら100円拾った。ラッキー!</p>
  • 次に、これを 日記.html と名前をつけて保存します。

日記.htmlを保存

拡張子を .html にするのを忘れないで下さい。

  • 日記.html をダブルクリックするとブラウザでこのように表示されます。

ブラウザ表示

解説

<h1><p> のようなものを タグ といいます。タグは、文字に意味をもたせるものです。たとえば、 <h1> タグは「1番目の表題」という意味です。 p は、「段落」という意味です。

タグには 開始タグ終了タグ があります。開始タグと終了タグで文字を囲むのです。開始タグは <タグ名> という形です。終了タグは </タグ名> という形になります。

タグの書き方はこうなります。

<タグ名>文字列</タグ名>