ホームページを作ろう｜インターネット

HOMEPAGE GUIDE

かんたんホームページ

ホームページを作って、たまテレネットのWebサーバに転送するだけ。世界中から見られるあなたのページが完成します。

いますぐ作る（サンプルを使う）サンプルを見る ↗

STEP 01

ホームページをつくる

難しいことを読まずに、今すぐホームページを作りたい！という方は「ファーストステップページを使う」から読みましょう。

ホームページは「html」でできています

ホームページは「html」という規則にしたがって書かれた文書です。この文書はテキストエディタで作成することができ、Webブラウザで表示するとhtmlの規則にしたがってレイアウトやリンクつきで表示されます。

一番基本的なhtml文書を作ってみる

[スタートメニュー]→[プログラム(P)]→[アクセサリ]→[メモ帳] と選択して、メモ帳を起動します。
メモ帳の画面に以下のように入力してください。

メモ帳のメニューから[ファイル(F)]→[名前を付けて保存(A)…]を選択し、[ファイル名]に test.html と入力して[保存]ボタンを押してください。
保存した場所に[test.html]というファイルができているので、ダブルクリックして開いてください。以下のように表示されるはずです。

このように入力した内容が反映されています。html文書では、< >で囲まれている部分を「タグ」と呼びます。タグはWebブラウザで文書を表示した時には表示されませんが、タグ以外の部分をどのように表示するかなどを設定することができます。

基本の文書で登場したタグ

<html> </html>

html文書の始まりと終わりを表します。多くのタグはこのように「開始タグ」と「終了タグ」が組みになっていて、その間に書かれた内容がタグの影響を受けます。

<head> </head>

文書全体の設定などを記載する、「ヘッダ」部分であることを表すタグです。

<title> </title>

この文書のタイトル（題名）を記載します。Webブラウザの枠の部分などにこのタイトル名が表示されます。

<body> </body>

この間に記載した内容が、本文としてWebブラウザ上に表示されます。

html文書で使用できるタグはこの他にもたくさんあります。表示する文字の大きさや色を変えたり、絵を表示することもできます。

EASY

ファーストステップページを使う

たまテレネットでは、はじめてホームページを作る方向けに、素敵なサンプルホームページをご用意しました。サンプルをダウンロードして、自分に合わせて書き換えるだけで、簡単にホームページを作成することができます。

DOWNLOAD (ZIP)ファーストステップページセット SAMPLEサンプルページを見る

ファーストステップページセットをダウンロードする

上の[ファーストステップページセット]ボタンからファイルを保存してください。ダウンロードが開始され、指定したフォルダへ保存されます。
ダウンロードしたファイルを展開する

ファーストステップページは圧縮されていますので、展開する必要があります。展開後に、エディタを使って内容を編集することができます。
1. エクスプローラーで展開したいデータがあるフォルダーを表示
2. 展開したいファイルを右クリックし、「すべて展開」を選択
3. 展開する場所を指定(任意)
4. 展開されたファイルやフォルダーが表示され展開が完了
自分の作りたいホームページに合わせて変更する

メモ帳を起動し、[ファイル(F)]→[開く(O)..]で[ファイルの種類(T)]を[全てのファイル]にして、展開したフォルダ内の「index.html」を開いてください。以下のように内容が表示されます。

3行目の title タグと、19行目の本文の一部を、次のように変更してみましょう。

変更前<title>ひまわり日和 - 俳句と写真サイト</title>

変更後<title>私のホームページ</title>

変更前<td height="49" valign="bottom" class="title">ひまわり日和</td>

変更後<td height="49" valign="bottom" class="title">ようこそ私のホームページへ</td>

変更が終わったら、[ファイル(F)]→[上書き保存(S)]で保存してください。すると、以下のようにページが反映されます。

このように、各ファイルの文章内容を変更するだけで、簡単に自分の好きな内容のホームページを製作することができます。

ファーストステップページで使用されているタグ

<font> </font>

文字の大きさや、色を指定します。

<font size="5" color="red">こんにちは</font>

こんにちは

<img>

指定した画像ファイルを表示します。同じフォルダに usagi.jpg がある場合は次のように書きます。

<img src="usagi.jpg">

<a> </a>

指定したアドレスにリンクを張ります。

<a href="http://www.tamashima.tv">玉島テレビ放送のページ</a>

玉島テレビ放送のページ

<br>

改行です。文章を改行したい場合に使います。

<table> <tr> <td>

テーブル（表）を作ります。<table>で囲んだところが表、<tr>が横1行、<td>が1マスになります。

<table>
<tr><td>　</td><td>Ａさん</td><td>Ｂさん</td></tr>
<tr><td>国語</td><td>100点</td><td>20点</td></tr>
<tr><td>理科</td><td>50点</td><td>100点</td></tr>
<tr><td>社会</td><td>80点</td><td>90点</td></tr>
</table>

	Ａさん	Ｂさん
国語	100点	20点
理科	50点	100点
社会	80点	90点

各タグにはもっと細かく設定を指定できるオプションがありますし、もっとたくさんの種類のタグも存在します。慣れてきたら、いろんなタグについてホームページや本を使って調べてみましょう。

STEP 02

ホームページをサーバに転送する

作成したホームページは、今は自分のパソコンの中に保存されているだけです。たまテレネットのWebサーバに転送すれば、Webブラウザを使って全世界からこのページを見ることができるようになります。

ファイル転送ソフトを使ってサーバに転送する

Webサーバにファイルを転送するには、ファイル転送ソフトを使います。ここでは、有名なFFFTPというソフトを使った転送方法を説明します。

FFFTP ダウンロードページ ↗

ダウンロードして展開後、FFFTP.EXE を起動し、[接続(F)]→[接続(C)..]→[新規ホスト(N)]で、たまテレネットの会員証を参考に、下記の情報を入力して[OK]ボタンを押してください。

ホストの設定名(T)	`ftp.tamatele.ne.jp`
ホスト名(アドレス)(T)	`ftp.tamatele.ne.jp`
ユーザ名(U)	会員証記載のアカウント
パスワード/パスフレーズ(P)	会員証記載のパスワード
ローカルの初期フォルダ(L)	作成したHTMLファイルがあるフォルダ
ホストの初期フォルダ(R)	`.public_html`

ホスト一覧の「ftp.tamatele.ne.jp」を選択して[接続(S)]を押すと、左側にパソコン内のファイルが表示されます。転送したいファイルを選択し、ツールバーの青い上矢印の[アップロード]ボタンを押すと、右側のWebサーバに転送されます。全て転送し終わったら[切断]ボタンで接続を切断します。

Webブラウザで公開を確認する

ファイルの転送が終わったら、ブラウザのアドレス欄に以下のように入力します。

https://www.tamatele.ne.jp/~会員証のアカウント名/転送したファイル名

例：アカウント名が tamatele、ファイル名が index.html の場合 → https://www.tamatele.ne.jp/~tamatele/index.html

いかがでしょう。あなたのホームページは上手く世界に公開できましたか？早速、お友達にあなたのホームページアドレスを伝えて自慢しましょう。

STEP 03

さらに素敵なホームページに

ホームページの作り方やタグの説明、無料で使える画像やレンタル掲示板など、ホームページを作る上で役に立つ情報サイトを集めたリンク集をご紹介します。

LINKSホームページ作成無料リンク集 COMMUNITYみんなのホームページ

たまテレでは、みんなのホームページにてユーザ様のホームページを紹介しています。リンクをご希望の方は ttc@mx1.tamatele.ne.jp までお気軽にご連絡下さい。それでは、楽しいホームページが作れますように！

ホームページを作ろう