ホームページ作成講座:はじめに

はじめに

ホームページ作成講座を見ていただきありがとうございます。 ホームページを持ちたいと思っている人のために分かりやすく解説したつもりです。

分かりにくい部分やホームページを作ってみて分からないことがあったら、掲示板やメールで遠慮せずに質問してください。 また感想や間違いの指摘なども受け付けておりますのでよろしくお願いします。

ではホームページ作成講座をお楽しみください。

なぜホームページを持つか?

なぜホームページを持つのでしょうか? 答えは簡単、楽しいからです。 自分のホームページを見てもらい少し恥ずかしい反面、感想をもらったり、紹介されたりするととても嬉しいものです。

ホームページは楽しく、やりがいも感じるますから、ぜひはじめましょう。

ホームページ作成は難しい?

ホームページを持ちたいと思っていても、「難しいから無理ー!」って人がよくいますが、実はとっても簡単なのです。 「無理ー!」と言ってた人がホームページを持ち、「簡単だからはじめてみなよ。」と他の人のすすめている姿はよく見ます。

ホームページで何を公開するか?

ホームページを持ちたいと思っても、何を書けばいいか分からないと言う人もよくいます。 ホームページでは何を書いてもいいのです。 自分の趣味や好きな事について書くのが一番です。 まとめるのが苦手だったら、日記風に思いついたままに書きつづると書きやすいです。

私も、日記からはじめ日記を書いている内に、ホームページで様々なことを書きたくなったものです。 まずはホームページを持って、何かを書いてみるのがよいでしょう。

ホームページ作成に必要な知識は?

ホームページ作成に必要な知識には何があるでしょうか? まずは、「HTML(HyperTextMarkupLanguage)」を知る必要があります。 「やっぱり難しそう」と思うかもしれませんが、覚える知識は本当に少しなので安心してください。 また必ずしも必要ではないのですが、「スタイルシート」の知識があると、ホームページ作成がさらに楽しくなると思います。

今はHTMLとスタイルシートってものがあるんだ程度に思っていてくださればよいでしょう。

実際にホームページを作ってみよう!

話ばかりでは面白くないと思うので、実際にホームページを作ってみましょう。 「いきなり!?」と思うかもしれませんが、最初ですから簡単に出来るように説明します。

まずは「メモ帳」を開きましょう。「スタート→プログラム→アクセサリ→メモ帳」から開けます。 メモ帳を開いたら、以下の文章をコピーして、メモ帳に貼り付けましょう。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<title>takus's world</title>
<meta http-equiv="Content-Style-Type" content="txt/css">
<link rel="stylesheet" type="txt/css" href="index.css">
</head>
<body>
<h1>takusの世界</h1>
<h2>takusについて</h2>
<p>
takusは私のHN(ハンドルネーム)であり、ネット上の名前です。
<br>
みなさんよろしくお願いします。
</p>
<h2>HP(ホームページ)の紹介</h2>
<p>
私のホームページの紹介をしましょう。
こちらでは、「さいとう」と言う名前を使っています。
<br>
ホームページはこちら→<a href="http://www.takus.info">さいとうです。</a>
</p>
</body>
</html>

貼り付けたらデスクトップ上に適当なフォルダを作って、ファイル名を「index.html」としてフォルダ内に保存しましょう。

ファイルを保存したら、フォルダ内に保存したファイルが出来ていると思います。 早速開いてみましょう。 ホームページが表示されましたか? このように表示されるはずです。(サンプル

どうですか?ホームページ作成も簡単でしょう。 貼り付けた文章に見慣れない暗号のような文字が見えたと思いますが、これがHTMLと言うものです。

スタイルシートを使ってみよう!

次にスタイルシートも使ってみましょう。 先ほどと同じように以下をコピペ(コピー&ペースト)して、ファイル名を「index.css」として、「index.html」と同じフォルダに保存してください。

body{
color: #99ccff;
background-color: #6666cc;
}

h1{
border: 5px outset #6666cc;
padding: 5px;
}

p{
color: #000000;
background-color: #ffffff;
border: 5px ridge #6666cc;
width: 500px;
margin: 20px;
padding: 5px;
}

保存が完了したら、一度「index.html」を閉じて、もう一度開いてみてください。 色やレイアウトが変わったと思います。(サンプル

スタイルシートを使うと様々なレイアウトやデザインにすることが出来るのです。 スタイルシートで自分のオリジナルのサイトに仕上がるのです!

おわりに

ホームページ作成講座の序章も終わりです。 少しはホームページ作成のこと、ホームページ作成の楽しさを感じることが出来たでしょうか?

慣れないうちは少し難しく感じるかもしれませんが、自分のホームページを作成しているうちに慣れてしまいます。 慣れるために、サンプルのソースを少し変えて、遊んでみるのもいいと思います。

質問・感想は大歓迎なので、質問や感想がありましたら掲示板かメールでお願いします。

ホームページ作成講座へ戻る