ホームページを作成する時には、HTMLという言語(プログラミング言語)を使います。

HTMLとは、HyperText Markup Languageの略であり、簡単にいうとブラウザ上に文章や画像などを表示させるウェブページを構成する為の言語です。

Advertisement

1.基本タグの説明

HTMLでは「タグ」と呼ばれる記号を使いますが、タグは「<>」で囲んだ英数図の事であり、基本的に開始タグと終了タグをセットで扱い、終了タグはタグ内の英数字の頭に、「/」を打ち込みます。

タグにも様々な種類がありますが、HTML文章を作るために必要不可欠で基本になるタグが、<html>、<head>、 <body>になります。

HTMLのタグと、後に出てくる”スタイルシート”への記述は全て半角英数字で書かなければいけません。

まず、作成前の下準備の項目で作成した、「index.html」ファイルを開いて下さい。

そして、下記の図の様に書き込みます。
※ 下図の様にメモ帳に直接書き込んでいく文章は、「ソースコード」と呼びますので覚えておいてください。

ソースコード

image5

htmlタグの中にheadタグとbodyタグが入っているのが分かります。

htmlタグは、 htmlタグ内にある文章や画像がHTMLの記述である事を示しています。
全体の最初と最後に記述するタグになります。(後に説明するDOCTYPE宣言を除く)

headタグ内は、文書の書体や、色、サイズなど、ホームページ内の様々な情報を記載する場所であるので、基本的にブラウザ上には表示されません。

bodyタグ内は、文章や画像など、実際にブラウザ上に表示される部分を記載する場所でありますので、 ホームページを作成する上で最も編集する場所になるでしょう。

2.ホームページの骨組みを作成

ホームページを作成するためには、まず骨組みを作成します。

「index.html」ファイルに、下記の図の様に書き込んでください。

ソースコード

image6

コピー用

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>

<body>
</body>

<html>

HTMLに馴染んでいないと、複雑なコードが並んでいるだけのように見えるかもしれません。
ひとつひとつ詳しく説明すると、難度が上がってしまいますし、ここは「初心者のためのホームページ作成講座」と言うことで掻い摘んで説明させて頂きます。


まず<!DOCTYPE html PUBLIC "~transitional.dtd">ですが、これは「DOCTYPE宣言」と呼び、HTMLの文章型宣言をおこなっています。
このDOCTYPE宣言の書き方はいくつか方式がありますが、上図では凡庸性の高いコードを記載しています。


次に、上記でも説明したhtmlタグ内に、xmlns~で始まる一文が加えられていると思いますが、この部分は、ネームスペース(名前空間)を指定しています。
これは複数の言語(コンピュータ言語)の共有化を計るための決まり毎の様なものですが、今はバグを回避するための一文程度と捉えておいて下さい。

headタグの間にmeta~始まるタグあると思いますが、この”metaタグ”はHTMLの動きを決めるために様々な場面で登場します。
今回のmetaタグの内容は、文字化けを防ぐために文字コードを指定しています。
※もしも文字などが上手く表示されない場合は、この記述を
<meta http-equiv=Content-Type content="text/html" /> と書き換えてみて下さい。


以上、かなり掻い摘んだ説明でした。
上図のソースコードで簡易なホームページ作成には充分だと思いますが、どうしても気になる方は別途調べて下さい。

次の項目からは、実際にブラウザ上に文章を表示させる段階に入ります。

では、文章を表示の項目へお進み下さい。

Big-Sea All rights reserved.2010-2013
当サイト内の文章、画像など、すべての無断使用、転載を禁じます。