10月の授業日記

10/7　HTMLとは

使用するアプリケーション

1. 記述
   • テラパッド（エディタ）
2. 閲覧
   • IE(ブラウザ）
3. アップロード
   • FFFTP(FTPソフト）

    

テキスト・エディタ

HTMLは言語なのでテキスト・エディタで記述できる

• テキストエディタ＞簡易ワープロのようなもの
• HTMLファイルは規定のプログラムがブラウザ＞ダブルクリックせずテラパッドから開く

FTPソフト（FFFTP）

ファイルのサーバーへの転送（アップロード）にはFTPソフトを使用する

（P264)接続を押すと左右に分かれたフレームが開く

• 左がローカルフォルダ/右がサーバー
• ファイルアイコンを左から右へドラックすることでアップロード
• もしくはアップロードボタン

ファイルが変わらない場合

• 編集後は表示を更新ボタンで時刻が新しくなったのを確認する

ブラウザ（IE)

HTMLファイルの閲覧にはブラウザを用いる

• IE/FireFox/Opera等

なぜHTMLを使うのか

インターネットでは環境に依存しない互換性が重視される

それまでのファイル形式

ワープロ

ファイルにコードで修飾情報を埋め込む＞方法（ファイル形式）がまちまち

• 互換性が低い

テキスト形式

コードを埋め込まず文章だけなので互換性が高い

• 表現力が低い

HTML形式

• 互換性の高いテキスト形式の利用
• 文章の情報を文字で記述した言語
  • 文章の意味
  • 画像の保存場所
  • リンク先のファイルの場所

  問題点

• 文章で文意が書かれているのでかえって読みづらい

解決策

記述と閲覧（ブラウザ）を分離

• 閲覧には閲覧用ソフト＞ブラウザを用いる
• ブラウザはタグの部分を表示せず、その意味を解釈しふさわしい表現をする

タグ

• 文章の役割を印をつけたもの（マークアップ）
• 本文と区別するために＜＞で囲まれる
• ＜＞とその中は英数半角

範囲指定

• 範囲の始まりを＜開始タグ＞
• 範囲の終わりを＜/終了タグ＞
• その間に挟まれた部分がタグの適用範囲

今日のひとこと

ちょっと難しかった

10/14　構造定義

記述のポイント

文章の構造定義

段落＜p＞〜＜/p＞

文章の区切り

見出し＜h1〜6＞〜＜/h1〜6＞

見出しのレベルを示す

改行

区切り線＜hr＞

10/21 属性

属性

＜タグ 属性＝"属性値"＞

タグと区別するため半角スペースを入れる
""を閉じ忘れるとおかしくなるので必ず先に閉じる

ALIGN(left/center/right)

bodyタグの属性

bgcolor

text

色の指定

複数の属性の指定

fontタグ

size="1〜7"

color

きょうのひとこと

10/28 リスト

リストの種類

＜ol＞(ordered list)番号つきリスト

＜ul＞(ordered list)番号なしリスト

リストの中身

＜li＞(list item)リスト項目

リストの作成方法

1. まず＜ol＞か＜ul＞で領域を作る
2. なかにいれたいものを＜li＞でくくる

リストの入れ子

• リストの中にリストを作ることでインデントされて階層化したリストを作ることができる

ulのリストのマークを変える（ul/li tipe属性）

• disc
• cirle
• square

olのリストのマークを変える（ol type 属性）