第11回の授業内容と学習目標

講義：ウェブ時代の情報リテラシー

• 情報リテラシー（情報に関する知識・技術・倫理）を一定以上のレベルで身につけ、情報の消費者かつ生産者として適切な振る舞いをできるようになること。
• 配布プリント、ウェブ上の画像・pdfファイル・動画を用いる。

講義＋実習：ウェブページの作成（1）

• ウェブページがどのようにして作成されているのかを理解する。
• ごく初歩的なウェブページの作成が出来るようになる。

ウェブ時代の情報リテラシー

講義のトピックの流れ

1. 関連年表（��橋〔ほか〕　2014）
2. 技術の概要と歴史（きたみ　2009）
3. セキュリティと法制度（��橋〔ほか〕　2014）
4. 著作権とその周辺（��橋〔ほか〕　2014）
5. リテラシー（��橋〔ほか〕　2014）・ウェブ空間の利用の現状と課題（ライアン　2002；中川　2009）

参考資料

• 参考資料

参考ウェブページ

• IPA（情報処理推進機構）「あなたの書き込みは世界中から見られてる」
• 「EPIC 2014 日本語字幕版 (Googlezon EPIC 2004年の未来予想）」
• 最近の話題：「ネットウオッチ「小林麻央さん亡くなった」　なりすまし投稿で混乱　ツイッター社対応遅く「デマ」拡散」 (毎日新聞2017年6月29日朝刊記事）

ウェブの悪用の身近な例

• 身近な脅威�@：フィッシング詐欺
  • 著名で信用のある企業・団体のウェブサイトを装い、ID・パスワードなどの入力を求めてそれらを不正に取得し悪用しようとする詐欺行為。
  • 都銀やJRなど、フィッシング詐欺に使われやすい企業・団体のウェブサイトには注意喚起の文書が載っている。
  • フィッシング詐欺サイトを見分けるコツを習得するゲームもある。
• 身近な脅威�A：スパムメール
  • 受信者の意思と関係なく機械的に送られてくる広告のメール。投資・ギャンブル必勝法・出会いなどが多い。広義には架空請求も含む。
  • フィッシング詐欺サイトを含む詐欺的なウェブページへの誘導をすることもある。
  • スパムメール業者は、「生きているアドレス」を互いに取引しているので、返信してはいけない。返信すると、そのアドレスは頻繁にメールチェックされており、かつ持ち主はセキュリティに疎い人物であることがばれる。「配信停止はこちら」や、「返信がないと損害賠償請求をする」などの文言は嘘である。
  • 語源は、豚肉の塩漬けの缶詰のspamを題材にしたコントにおける「くどさ」（一方的で大量）からとされる。

【加害者にならないために】「交通ルール」としての著作権

• 詳しくは別ページにて解説している。
• 基準をわかりやすく解説したフローチャートも存在する。

ウェブページの作成

ウェブページ閲覧の仕組み

ウェブページの作成

• ウェブページは、htmlタグという【言語】で記述されている。
• そのファイルを、【htmlファイル】という。これがウェブページの【設計図】のようなもの。
• 【htmlファイル】は、テキストエディタ（「メモ帳」など）で作成・編集する。
• 【htmlファイル】自体には文字しか書けないが、他の画像ファイルやウェブページを【参照】することが出来る。

ウェブページの作成の手順

1. テキストエディタ（メモ帳かTeraPad）でタグを使用してHTML文書を記述する。
2. 作成したファイルを任意のフォルダに保存する。保存ウィンドウの【ファイルの種類】は【すべてのファイル】にすること。
3. 拡張子としてファイル名のあとに「.html」を加える。
4. あとで修正する時のために、ここでメモ帳は閉じない方が良い。
5. 保存したHTMLファイルをダブルクリックし、ウェブブラウザ（InternetExplorer）で確認する。
6. 変更、修正点があれば、
   �@開いたままのメモ帳を再度編集する。
   �Aブラウザの【表示】→【ソース】からHTMLファイルをメモ帳で開いて編集する。
   �Bメモ帳を開いて【ファイル】→【開く】から編集したいファイルを探す。
7. メモ帳で【上書き保存】して、ブラウザで【再読込み】（ショートカットだと【ctrl+r】）をする。

ウェブページ作成上の注意点(1)：ファイル名と拡張子

• ウェブページ作成に関連するファイル名はすべて半角英数字で記述すること。
• 大文字と小文字は区別されるので注意する。例えば、「index.html」と「Index.html」は違うファイルとして扱われる。
• HTMLファイルは必ず「.html」という拡張子をつけること。画像ファイルは「.jpg」、「.gif」となる（画像ファイルの拡張子が大文字になる場合があるので要注意）。
• HTMLタグは半角英数字で記入すること。大文字小文字の区別はない。

ウェブページ作成上の注意点(2)：拡張子の表示方法

• 【コントロールパネル】→【デスクトップのカスタマイズ】→【フォルダーオプション】→【表示】→【「登録されていない拡張子は表示しない」】のチェックを外す。
• このようにしておかないと、拡張子の種類が分からないので、画像の挿入時などにトラブルのもととなる。

ウェブページの基本構造

すべてのHTMLファイルは以下の基本タグを記述する必要がある。

• ほとんど全てのhtmlタグは、始まりと終わりがある。
• htmlタグの始まりと終わりの間に、文章を書いたり画像・他のウェブページへのリンクなどの情報を書き込む。

編集途中でファイルを閉じてしまったら

• テキストエディタ（メモ帳かTeraPad）を起動する。
• 【ファイル】→【開く】で編集対象のファイルを選ぶ（あるいは、テキストエディタにドラッグ＆ドロップ）。
• ダブルクリックして開こうとしても、編集は出来ない。