簡単なwebページの例

テキストエディタを用いて，直接に html で webページを記述する

ファイル

ファイル名には全角文字(漢字)や半角かな文字の使用を避ける
拡張子として，ファイル名の後ろには「.html」を付ける

作成の手順

エディタを用いて html 言語により web ページを作成する
- エディタを起動する
- webページを記述する
ファイルに保存する．(拡張子「.html」)
ブラウザにより webページを開き，確認する
必要なら，再び，エディタによりファイルの内容を変更する

ファイル名に関する注意：

HTMLの例1

ソース

      <!DOCTYPE html>
      <html lang="ja">
        <head>
          <meta charset="UTF-8">
	  <title>1818xxx 工芸太郎</title>
	</head>

	<body>
        <!-- ここから下に表示する内容を記述する -->
          <h1>私のホームページ</h1>
          <div>
            学籍番号  1818xxx<br>
            氏名      工芸 太郎
          </div>
          <p>
            作成中のWebページ
          </p>
	</body>
      </html>

表示

タグの要素名は大文字と小文字の区別をしない

          <開始タグ> 文(表示する文字列) <終了タグ>

終了タグを必要としないタグが存在する

html中の改行は無視される

   [例]
     <html><head>ヘッダー部分 (文章についての情報)</head><body>本文</body></html>

     <html>
        <head>
            ヘッダー部分 (文章についての情報)
        </head>
        <body>
            本文
        </body>
     </html>

空白や改行は無視されるので，テキストは読み易いように改行や段下げを行う

[タグの説明]

DOCTYPE宣言
```
    <!DOCTYPE html>
  
```
この文章がHTML5という規則に従って書かれていることを宣言している．
html 要素
```
      <html lang=ja>

      ...

      </html>
    
```
- 開始タグ<html>から終了タグ</html>の間が HTMLドキュメントであることを表す．
- 開始タグ内の「lang=ja」は属性を表す
- html要素は内に「head要素」と「body要素」を持つ．
  このようにタグは開始タグと終了タグにより，
  と記述する．要素によっては開始タグのみで，終了タグを持たないものもある．
head 要素
- このページの基本情報であるヘッダー情報を記述する．
  ヘッダー情報には、「meta 要素」や「title 要素」などを含む．
meta 要素
- このページの性質などを詳細に設定する
- 文章は記述せずタグだけを記述する
- このように開始タグ，終了タグの区別のない要素を「空要素」と呼ぶ
title 要素
- 文章のタイトルを記述する
body 要素
- ブラウザのウィンドウ内に表示される内容を記述する
h1 要素
- 見出し(Header)を記述する
- 最も大きな見出しであり，大見出しに対応する． <h1>〜<h6>までがある
br 要素
- 文章中のこの位置で改行する
p 要素
- 段落(Paragraph)を意味する
div 要素
- ひとかたまりの文章を意味する(division)
- 前後に改行が自動的に挿入される

[タグの属性]

属性は「属性名」と「属性値」で表される
属性は次のように記述する
```
	<要素名 属性名="属性値"> 文 </要素名>
	
```
などと記述する

lang 属性
charset 属性