HTML 入門トップページ

« 戻る 次へ »

目次

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

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

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

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

01-07

メモ帳で index.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 （サーバの設定による）を表示することになります．

« 戻る 次へ »