HTML 入門トップページ


目次

  1. ホームページ作成はじめの一歩
    1. 学内ネットワークに接続
    2. ファイルサーバに接続
    3. index.htmlを編集し,ブラウザで確認する
  2. HTMLの基礎
  3. 基礎的なタグをマスターしよう
  4. HTML 文書を検証してみよう
  5. スタイルシート
  6. フォームを使ってみよう
  7. 参考サイト

ホームページ作成 はじめの一歩

index.html を編集し,ブラウザで確認する

メモ帳で index.html を開いた状態です.まだ,ファイルには何も記述されていません.

01-07

メモ帳で index.html に次のような内容を記述します.このとき,<html> などのタグには半角文字を使用することに注意してください.日本語の全角文字(<html> など)を使ってはなりません.

index.html<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>ホームページ</title>
</head>
<body>
ホームページを作ってみます。
</body>
</html>

index.html をダブルクリックして,ブラウザを起動すると,作成した Web ページを確認することができます.しかしながら,この方法では Web サーバを経由して閲覧しているわけではないことに注意してください.

01-08

Web ブラウザのアドレスバーに「 http://rin06.ba.kobegakuin.ac.jp/~ユーザ名/ 」を入力してアクセスすると,Web サーバを経由して閲覧できます.しかしながら,文字化けが起こってしまっています.

01-09

文字化けの原因は,index.html の4行目に UTF-8 という文字コードを使っていると宣言しているにもかかわらず,メモ帳で保存したときに別の文字コードを使っていることです.この問題を解決するために,メモ帳で「名前を付けて保存」を実行し,文字コードに「UTF-8」を指定してから改めて保存してください.なお,メモ帳では「ファイルの種類」に「すべてのファイル (*.*)」をしてしていないと,ファイル名の最後に 「.txt」という拡張子が付いてしまう可能性があるので,この設定も忘れないようにしよう.

01-11

Web ブラウザで再読込を行えば,文字化けが解消されました.

01-12

なお,Web ブラウザで接続する際には「 http://rin06.ba.kobegakuin.ac.jp/~ユーザ名/ファイル名 」を入力します.ここで,ファイル名を省略した(つまり URL が ドメイン名/ または ユーザ名/ または フォルダ名/ で終わる)場合は,そのドメイン(または,ユーザ,フォルダ)にある index.html (サーバの設定による)を表示することになります.