トップページを作ってみる ~無料ホームページの作り方~

HOME > 無料で作成講座 > 無料ホームページの作り方 > トップページを作ってみる

無料ホームページの作り方
弊社では「自分で作成してみたい!」という方も応援しています

2.トップページを作ってみる

まずはindex.htmlを作る

ホームページで一番最初に見られるページがトップページと呼ばれるものです。
トップページは多くの場合「index.html」というファイル名で作成されています。
WEBサーバーはファイル名の指定が無い場合に「index.html」というファイルを探して表示しますので このファイル名にしておけばまず問題ないと思います。

まずは前述したテキストエディタで「index.html」という名前の空のファイルを作ります。
これで中身の無いトップページが出来上がりました。簡単でしょう?
このファイルをエクスプローラー上でダブルクリックすればブラウザが開いてページが表示されるはずです。

HTMLの基本

さて、中身が無いのは色々と問題です。というか意味がありませんよね。
そこで中身を作っていくのですが、ホームページというものはHTMLという書式で書かなければいけません。
色々とやっていく上でHTMLは難しいものになってきますが、基本的なものはとてもシンプルです。
まずは下記の様に記述してみて下さい。(コピペでも構いません)
ファイル名:index.html
そしてその出来上がったファイルをダブルクリックしてブラウザで確認します。
如何でしょうか。ちゃんと表示されましたか?
では次に、このHTMLの説明をしていくことにしましょう。

サンプルHTMLの解説

HTMLの基本はこのようなタグ(<と>で句切られた命令のようなもの)でどのような処理をするかを指示します。
例えば<html>から</html>までは「この区間がHTML書式で書かれている」ということを明示しています。
<head>から</head>までは「この区間がヘッダーである」ということを明示し、
<body>から</body>までは「この区間がコンテンツボディである」という具合です。
ホームページではヘッダー区に「このページがどのようなもので、どのように処理されるか」を記述します。
コンテンツボディ区には「何をどのように表示するか」という具体的な内容を記述することになります。

こう書くと何だか難しい感じがしてきますが、その辺りは「慣れ」しかないですね。
全てを1つずつ理解しながら進むのではなく、出来るだけ「そういうもの」として慣れてしまったほうが上達は早いものです。