第1回 webページの基礎知識

Webとは

Webの基礎知識

NAVERまとめ「[HTMLの歴史] HTMLの誕生からHTML5までをザッと要点紹介」

構造言語と表現言語

構造言語：HTMLなどのwebの構造を表す言語。

表現言語：cssなどのHTMLを装飾する言語。

Webの仕組みを理解する

増田先生の「webの基礎知識」のページ

web担の「URLとURIは何が違うの？」

HTMLとは

マークアップ(mark up)とは
増田先生の「Webページの構成」のページ
いろんなタグを試してみる（教科書p10～）

このページからサンプルファイルをダウンロードして、適当な作業用フォルダに展開してください。

HTMLファイルの作成と表示
html	HTML文書を示す
head	ページの設定情報を記述する
meta	HTML文書に関する情報を示す
body	ページのコンテンツを記述する

見出しと段落
h1～3	見出しを示す
p	段落を示す

リスト
ul	順番なしリストを示す
ol	順番付リストを示す
li	リスト項目を示す

表
table	表を示す
tr	行を示す
th	表見出し項目を示す
td	表データ項目を示す
thead	表ヘッダーを示す
tbody	表ボディを示す
tfoot	表フッターを示す

追加の構造を示す
article	独立した記事のセクション
section	セクション
aside	本筋から外れる内容のセクション
header	ヘッダーを示す
footer	フッターを示す

コンピュータプラクティスの授業で作ったHTML（猫の写真の）について、ここまでの内容を元に、何が記述されているか確認しなさい。

非推奨タグ

HTML/XHTML は構造の記述言語とし、表現の記述はCSSに任せるようになってきてます。このため、見栄えの設定のためのタグなどが非推奨とされています。

非推奨タグの例

非推奨タグの例
タグ	用途
<applet>	Javaアプレット使用
<basefont>	基本フォント指定
<center>	中央揃え
<dir>	リスト表示
<center>	中央揃え
<isindex>	検索語入力欄表示
<menu>	リスト表示
<s>	取消線付き
<strike>	取消線付き
<u>	下線付き

その他の非推奨タグの例

簡単なHTMLの例

<!DOCTYPE html>
<html lang="ja">
  <head>
      （そのページの基本情報↓文字、タイトル…）
      <meta charset="utf-8">
      <title>ページのタイトル</title>
  </head>
  <body>
    （そのページの本文）
  </body>
</html>

宿題

教科書を見ながら、コンピュータプラクティスの授業で作ったHTMLを修正して、HTML5っぽく直しなさい。
関連するファイル一式を、ウェブページとしてアップロードしなさい。
関連するファイル一式を、自分の学籍番号のフォルダを作って授業フォルダに提出しなさい。

授業フォルダの場所：: \\nas002.term.usmc.dendai.ac.jp\授業用ワークスペース\千住キャンパス\前期\未来科学部\②情報メディア学科\FI1コンピュータプラクティス／Webページ制作(森本有紀)\第09回\提出

〆切：今週金曜日正午