7 第 7 章 Web ページ この 章 の 目 的 Web ページ Web サイトについての 基 礎 知 識 を 習 得 する 1. Web ページの 基 礎 知 識...212 2. Web ページ 利 用 のマナー...217 3.Facebook...219 211
第 7 章 Web ページ 1. Web ページの 基 礎 知 識 Web ページ Web サイト ホームページ Web ブラウザで 表 示 されるページのことを Web ページ または ホームページ 一 連 の Web ページを 構 成 している Web ページ 群 は Web サイト その Web サイトの 入 り 口 である 最 初 のページを トップページ といいます インターネットが 普 及 しはじめた 頃 は Web ブラウザを 起 動 して 一 番 最 初 に 表 示 されるページの ことを ホームページ と 呼 んでいましたが 次 第 に Web サイトのトップページや Web サイトそのものと 同 じ 意 味 で 使 われるようになりました 現 在 では ブラウザの 起 動 時 に 表 示 されるページは スタートページ と 呼 ぶのが 一 般 的 ですが Web ブラウザのメニューや 設 定 画 面 には ホーム ホームページ という 項 目 名 が 残 っ ています 本 章 では 以 下 Web ブラウザで 表 示 されるページを Web ページと 統 一 して 呼 びます 下 図 は Internet Explorer 11 の ツール ボタンをクリックして インターネット オプション を 選 択 して 表 示 したダイアログボックスの 画 面 です ホームページ (=スタートページ)を 検 索 エンジン Google (https://www.google.co.jp/) に 設 定 すると Web ブラウザの 起 動 時 やツールバーの ホーム ボタンをクリッ クしたときに Google のトップページが 表 示 されます ホーム ツール クリック ホームに 指 定 したい Web ページを 開 いて 現 在 のページを 使 用 ボタンを クリックすると 自 動 的 にアドレスが 入 力 されます 212
1.Web ページの 基 礎 知 識 ハイパーリンク Web ページには マウスポインターが 手 の 形 になる 場 所 が 多 く 配 置 されていて クリックするとリンクされ たページやファイルにジャンプします これを ハイ パーリンク といいます この 機 能 によって 一 つの 情 報 から 関 連 する 別 の 情 報 へ と 際 限 なくたどっていく ことができます ハイパーリンク Web ページのしくみ ハイパーリンクによって 複 数 の Web ページが 連 結 されて Web サイトが 構 成 されています これらの Web ペー ジは インターネット 上 の WWW サーバーに HTML *1) 文 書 として 保 存 されています HTML とは Web ペー ジの 構 造 を 定 義 する 記 述 言 語 で テキスト 画 像 音 声 動 画 リンク 先 などさまざまなデータの 配 置 を 定 義 することができます HTML ファイルはテキストファイルで.html または 〇 〇 〇.htm という 拡 張 子 *2) が 付 きます Google の Web サイト ユーザーがすぐに 使 えるように 目 的 別 に 使 用 頻 度 の 高 いリンクがトップページに 掲 載 されています *1) HTML エイチティーエムエル : HyperText Markup Language *2) 拡 張 子 extension ファイル 名 の. のあとに 付 けられる 文 字 のことで 通 常 は 半 角 3~ 4 文 字 でそのファイルの 種 類 を 識 別 します HTML ファイルは *.html *.htm のどちらでも 認 識 されます 213
第 7 章 Web ページ Web ページを 表 示 するためのアドレスは インターネット 上 の 情 報 の 住 所 を 表 したもので これを URL *1) と いいます URL はプロトコル ドメイン フォルダ 名 (パス 名 ) ファイル 名 などで 構 成 されます たとえば Google サイトのトップページのアドレスは https://www.google.co.jp/ ですが これはファ イル 名 を 省 略 した 場 合 に サーバーであらかじめ 設 定 されたファイル( 一 般 的 には index.html index.htmdefault.htm など)が 既 定 のドキュメントとして 表 示 される 機 能 によるものです また 最 近 では 下 図 の Google について の URL のようにファイルの 拡 張 子 (.html.htm など)を 表 示 しないようにサーバー 側 で 設 定 され ていることも 多 くなりました Google トップページの Google について にマウスポインターを 移 動 すると 画 面 に 移 動 先 の URL が 表 示 されます https://www.google.co.jp/intl/ja/about.html http://www.google.co.jp/intl/ja/about/ ( 拡 張 子 は 非 表 示 ) Google のトップページ の URL Google について の URL https://www.google.co.jp/ https://www.google.co.jp/intl/ja/about.html プロトコル ドメイン HTML 文 書 ファイル 名 ファイルのパス プロトコル : http:// または https:// Web サーバーと Web ブラウザなどネットワーク 上 のコンピューター 同 士 が 通 信 を 行 なう 上 で 相 互 に 決 めら れた 約 束 事 のことで 通 信 手 順 通 信 規 約 などとも 呼 ばれます http *2) のほかに データの 暗 号 化 機 能 を 付 加 した https *3) ファイル 転 送 の ftp *4) などがあります ドメイン : www.google.co.jp ドメインはインターネット 上 にある Web サーバーの 場 所 (Web サーバーアドレス)を 表 します 本 来 は 数 字 の 羅 列 である IP アドレスで 識 別 されますが ドメイン 名 と IP アドレスを 対 応 させるシステム(DNS:Domain Name System )により アルファベットと 数 字 などを 組 み 合 わせたドメイン 名 で 運 用 されています ファイルのパス : /intl/ja/about.html Web サーバー 内 のファイルの 位 置 を 最 上 位 階 層 から 順 番 にスラッシュ (/) で 区 切 って 指 定 します これを ファイルのパス と 呼 びます このパスによって Google について の Web ページの HTML 文 書 about. html は 右 図 のような 位 置 に 存 在 することがわかります www.google.co.jp index.html (トップページ) intl ja about.html 214
1.Web ページの 基 礎 知 識 Web ページのマルチメディアデータ Web ページには 静 止 画 像 動 画 サウンドなど 様 々なマルチメディアデータを 埋 め 込 むことができます これらを 再 生 するには HTML 文 書 内 に そのファイルが 保 存 されている 場 所 をパスで 記 述 します 表 示 される Web ページ HTML ファイルとマルチメディアデータの 関 係 Welcome My WebSite クリックすると 音 楽 が 流 れます main index.html <HTML>...... Welcome My WebSite......sozai/girl.gif...... クリックすると 音 楽 が 流 れます...sozai/music.mid... </HTML> sozai music.mid girl.gif サウンドデータ 静 止 画 像 データ HTML 文 書 代 表 的 な Web グラフィック ファイル 形 式 読 み 方 色 数 特 徴 GIF ジフ ギフ インデックスカラー ( 最 大 256 色 ) JPEG ジェイペグ フルカラー PNG ピング インデックスカラー ( 最 大 256 色 ) または フルカラー アイコンやボタン イラスト 単 純 なアニメーションなど 色 数 の 少 ない 画 像 データに 適 している 使 用 する 色 を 減 色 することでファイルサイズを 小 さく 抑 える 圧 縮 による 画 像 劣 化 は 起 こらない 写 真 などの 連 続 階 調 の 画 像 に 適 している 画 像 の 圧 縮 率 を 調 整 すること ができるが 圧 縮 率 が 高 くなるほど 画 像 も 劣 化 する JPEG と GIF の 特 徴 を 合 わせ 持 つ Web に 特 化 した 画 像 形 式 その 他 主 なマルチメディアデータ 種 類 名 称 特 徴 ビデオ サウンド アニメーション ドキュメント Flash Video(FLV) Windows Media Quick Time Flash PDF 映 像 や 音 声 などのマルチメディアデータを 受 信 しながら 同 時 に 再 生 を 行 なうストリーム 配 信 方 式 が 利 用 でき ライブなどリアルタイム 再 生 が 可 能 それぞれ 対 応 する Player やプラグイン *5) が 必 要 インタラクティブな 機 能 を 盛 り 込 んだアニメーションが 可 能 再 生 するには Flash Player プ ラグインが 必 要 ios (iphone ipad 等 の OS) では 閲 覧 することができないため 近 年 では HTML5 や JavaScript でアニメーションを 表 現 しているサイトが 多 い 印 刷 物 をそのまま Web ドキュメントとして 配 信 することができる PDF ファイルを 閲 覧 印 刷 するには Adobe Reader またはプラグインが 必 要 *1) URL ユーアールエル : Uniform Resource Locator *2) http エイチティーティーピー : Hypertext Transfer Protocol Web サーバーとクライアント (Web ブラウザなど ) がデータを 送 受 信 するのに 使 われるプロトコル *3) https エイチティーティーピーエス : Hypertext Transfer Protocol Security SSL (Secure Socket Layer) によりサーバーとブラウザの 間 の 通 信 を 暗 号 化 するプロトコル 個 人 情 報 やクレジットカー ド 番 号 などを 安 全 にやり 取 りすることができます *4) ftp エフティーピー : File Transfer Protocol インターネットやイントラネットなどの TCP/IP ネットワークでファイルを 転 送 するときに 使 われるプロトコル *5) プラグイン Web ブラウザの 機 能 だけでは 実 現 できない 動 画 や 高 品 質 の 音 声 の 再 生 などを 実 現 するプログラム プラグインのほと んどは 無 料 で 提 供 されており インターネットを 通 じて 簡 単 に 入 手 することができます 215
第 7 章 Web ページ Web ページの 裏 側 [HTML 文 書 ] をのぞいてみよう 表 示 されている Web ページの HTML 文 書 の 内 容 を 見 るには ブラウザ 画 像 以 外 の 場 所 で 右 クリックし メ ニューから ソースの 表 示 を 選 択 すると HTML 文 書 ソースのウィンドウが 表 示 されます 下 図 は 神 戸 学 院 大 学 のトップページのソースです HTML は 見 出 しや 段 落 画 像 などを1つの 要 素 ( 部 品 )として 扱 います これらの 要 素 は タグと 呼 ばれる 記 号 (< >)で 囲 むことで マークアップという 目 印 が 付 きます ブラウザはこの 目 印 を 認 識 して その 要 素 にあっ た 表 示 を 行 います たとえば 前 述 の 操 作 で 開 いたソースの 7 行 目 には title 要 素 が 記 述 されています <title> 夢 へのチャレンジが 未 来 をつくる 神 戸 学 院 大 学 </title> title 要 素 の 内 容 は ブラウザのタイトルバーに 表 示 されたり お 気 に 入 り に 追 加 したときの Web ページ 名 に なるもので 開 始 タグ <title> と 終 了 タグ </title> の 間 にテキストを 記 述 します また HTML 文 書 であることを 宣 言 するために 最 初 と 最 後 は <html> ~ </html> タグで 囲 みます その 中 は 大 きく 分 けて HEAD 要 素 と BODY 要 素 から 構 成 されています HEAD 要 素 にはこの 文 書 のドキュメントタイプ やタイトルなどの 様 々な 情 報 が 記 述 され BODY 要 素 には 本 文 が 記 述 されます 右 クリック 216
2.Web ページ 作 成 のマナー 2. Web ページ 利 用 のマナー Web ページや 掲 示 板 への 投 稿 SNS ブログなどインターネット 上 で 情 報 発 信 するときは 以 下 のことに 気 をつけてください 著 作 権 肖 像 権 書 籍 新 聞 雑 誌 CD の 音 楽 他 人 の 書 いた 文 章 図 絵 音 楽 写 真 映 像 コンピューターソフト テ レビ 番 組 や 映 画 などのキャプチャ 画 像 有 名 人 の 写 真 などの 全 部 または 一 部 を 複 製 して 自 分 の Web ページなど に 使 用 する 場 合 は 著 作 権 者 の 許 可 が 必 要 です これらを 著 作 権 者 の 許 可 無 しに 複 製 を 作 成 し 配 布 することは 著 作 権 や 肖 像 権 の 侵 害 となり 法 律 で 禁 止 されています ( 著 作 権 法 21 条 63 条 1 項 2 項 79 条 1 項 ) また 有 名 人 でなくても 写 っている 人 の 承 諾 なく 掲 載 することは 肖 像 権 というよりプライバシーの 侵 害 で あり 民 事 上 の 不 法 行 為 に 問 われて 損 害 賠 償 を 請 求 される 可 能 性 があります インターネットにより 入 手 したプログラムなどの 著 作 物 を 登 録 者 や 著 作 者 の 許 可 なく 転 載 配 布 すること も 著 作 権 の 侵 害 にあたることがあります ( 著 作 権 法 10 条 1 項 9 号 113 条 2 項 ) 以 下 のことは 著 作 権 肖 像 権 などの 侵 害 にあたることがあるので 無 意 識 に 行 ってしまわないよう 十 分 注 意 してください < 著 作 権 肖 像 権 の 侵 害 にあたる 可 能 性 があるもの> 他 人 の Web ページの 画 面 を 雑 誌 など 他 の 媒 体 への 無 断 掲 載 すること 書 籍 新 聞 雑 誌 などの 記 事 写 真 の 無 断 転 載 テレビ ビデオ 画 像 の 無 断 転 載 芸 能 人 スポーツ 選 手 その 他 有 名 人 の 写 真 や 似 顔 絵 などの 無 断 掲 載 著 作 権 のある 楽 曲 などの 無 断 掲 載 他 人 の 作 成 したソフトウェアや 市 販 ソフトウェアの 無 断 配 布 他 人 のメールやメッセージなどの 無 断 公 開 < 利 用 して 差 し 支 えのないもの> 著 作 権 のないもの( 著 作 権 法 13 条 ) 憲 法 その 他 法 律 政 令 省 令 などの 法 律 や 国 地 方 公 共 団 体 の 発 行 する 告 示 訓 令 通 達 裁 判 所 の 判 決 など 著 作 権 の 消 滅 したもの( 著 作 権 法 50 条 以 下 ) 著 作 権 の 原 則 的 保 護 期 間 は 著 作 者 が 著 作 物 を 創 作 した 時 点 から 著 作 者 の 死 後 50 年 までです ただし 映 画 の 著 作 権 は 公 表 後 70 年 を 経 過 するまでの 間 存 続 します ( 著 作 権 法 54 条 1 項 ) 実 用 品 必 需 品 に 該 当 するもの 美 術 品 には 著 作 権 が 認 められているが 美 術 的 であっても 実 用 品 には 著 作 権 が 認 められていない 活 字 書 体 など 芸 術 としての 書 には 著 作 権 があるが 活 字 になっているものや 書 体 字 の 形 態 などには 著 作 権 はない とされている 通 常 のデザイン 書 体 毛 筆 の 字 体 などの 著 作 権 は 認 められていない 217
第 7 章 Web ページ 著 作 物 の 引 用 について 著 作 権 法 では 一 定 の 条 件 を 満 たせば 権 利 者 の 許 諾 を 得 ることなく 引 用 することができるとあります 著 作 権 法 第 32 条 公 表 された 著 作 物 は 引 用 して 利 用 することができる この 場 合 において その 引 用 は 公 正 な 慣 行 に 合 致 するものであり かつ 報 道 批 評 研 究 その 他 の 引 用 の 目 的 上 正 当 な 範 囲 内 で 行 なわれるものでなければならない つまり 以 下 のような 条 件 を 満 たしていれば 引 用 することができます 引 用 の 目 的 上 正 当 な 範 囲 内 であること 自 分 の 文 章 が 主 で 引 用 部 分 が 従 であること 引 用 文 であることが 明 確 に 区 分 され 引 用 された 著 作 物 の 題 号 や 著 作 者 名 を 明 示 すること ただし 少 しでも 変 更 を 加 えて 掲 載 するのは 無 断 転 載 あるいは 剽 窃 となり 著 作 権 侵 害 にあたります 名 誉 毀 損 インターネット 上 の 掲 示 板 や SNS では トラブルが 多 く 発 生 しています 悪 意 のある 書 き 込 みだけでなく 意 見 をやり 取 りしているうちに 感 情 的 衝 突 が 起 こり 誹 謗 中 傷 や 激 しい 言 葉 の 応 酬 となります こういったト ラブルの 原 因 には ネット 上 の 匿 名 性 と 相 手 の 顔 が 見 えない 文 字 だけのやりとり があげられます 人 は 自 分 が 誰 かを 知 られないと ついつい 攻 撃 的 になってしまうようです あなたの 発 言 は 公 共 の 場 で 公 開 される こと 受 け 取 り 人 は 文 化 言 語 ユーモアの 基 準 があなた 自 身 とは 異 なっている 人 間 であることを 忘 れない でください 相 手 を 傷 つけるような 書 き 込 みはしない 批 評 や 論 争 であっても 攻 撃 的 侮 辱 的 な 表 現 は 避 ける 人 種 国 籍 思 想 などによって 差 別 することはしない 個 人 情 報 個 人 情 報 とは 氏 名 や 住 所 電 話 番 号 メールアドレス 顔 写 真 生 年 月 日 など その 人 固 有 の 情 報 のことです インターネット 上 の 情 報 はどこで 誰 が 見 ているかわかりません 自 分 の Web ページや SNS のプロフィール メー ルなどに 個 人 情 報 ( 特 に 氏 名 や 住 所 電 話 番 号 生 年 月 日 )を 書 き 込 んではいけません また 同 じ 内 容 のメールを 一 斉 に 複 数 のアドレスに 送 信 する 同 報 メールを 出 す 場 合 は 注 意 してください 送 信 先 を CC(Carbon Copy)に 記 入 すると それらのアドレスは 受 信 者 全 員 に 通 知 されてしまいます 友 人 同 士 や 同 じグルー プ 以 外 は 各 受 信 者 には 同 内 容 のメールが 転 送 されたことは 通 知 されない BCC(Blind Carbon Copy)を 使 用 しましょ う 自 己 防 衛 インターネットは 匿 名 の 世 界 で 実 質 的 な 管 理 者 責 任 者 は 存 在 しません 情 報 の 中 には 悪 意 のあるもの 信 頼 性 の 低 いもの 犯 罪 性 のあるものもあります 危 険 が 伴 なうことを 十 分 認 識 して 被 害 に 遭 わないように 自 己 防 衛 に 努 めることが 必 要 です 218
3.Facebook 3.Facebook Facebook の 特 徴 Facebook は 世 界 最 大 のソーシャルネットワー クサービスで 現 実 の 世 界 での 人 間 関 係 を 基 にして Facebook 上 で 交 流 するように 設 計 されています そ のため 実 名 でないと 登 録 できないようになってい ます Facebook は なぜ mixi や Twitter のように 匿 名 ではなく 実 名 なのでしょうか Facebook の 日 本 語 版 サービスが 開 始 された 2008 年 5 月 来 日 した Facebook 創 設 者 兼 最 高 経 営 責 任 者 の Mark Zuckerberg 氏 は 記 者 会 見 において 次 のように コメントしました そもそも Facebook は 大 学 生 向 け SNS としてスタートしたが 偽 名 を 使 うユーザーは 投 稿 内 容 も 嘘 だと 見 な され コミュニティの 蚊 帳 の 外 に 置 かれてしまう Facebook では 実 社 会 と 同 じ 人 間 関 係 を 構 築 していること もあり 今 では 実 名 登 録 が Facebook の 常 識 となった 偽 名 の 使 用 についてはチェックも 行 なっている (INTERNET Watch http://internet.watch.impress.co.jp/cda/news/2008/05/19/19603.html より) 本 名 学 歴 や 居 住 地 顔 写 真 を 公 開 する 一 番 のメリットは 相 手 に 対 する 信 頼 度 にあります 匿 名 ならでは のトラブルもなく 実 社 会 と 同 じようなリアルな 交 流 関 係 を 築 くことができます 既 知 の 友 人 同 士 で 情 報 を 共 有 して 意 見 交 換 したり イベントの 告 知 や 個 人 間 でのメッセージのやりとりができます また 特 定 の 仲 間 だ けが 参 加 できるグループを 作 ることもできます 最 近 では ビジネスや 就 活 でも 使 われています また Facebook の 機 能 の 1 つに 災 害 時 情 報 センター があります 災 害 時 に 利 用 者 が 自 分 の 安 否 を 家 族 や 友 達 とすばやく 共 有 し 大 切 な 人 とつながれるようにします ( 詳 しくは Facebook デスクトップ ヘルプ の 人 気 の 機 能 > 災 害 時 情 報 センター を 参 照 してください https://www.facebook.com/help/) 個 人 情 報 に 対 する 安 全 性 を 確 保 する 一 方 実 名 制 によるデメリットも 知 っておかなければなりません 個 人 情 報 を 全 て 公 開 するのは 事 件 につ ながる 可 能 性 があり 危 険 です Facebook を 安 全 に 使 うためには 必 ず 誰 にどの 情 報 をどこまで 公 開 するのか 公 開 範 囲 を 設 定 してください プライバシーの 設 定 方 法 プライバシーに 関 する 設 定 を 確 認 編 集 するには 画 面 右 上 の アイコンをク リックし 設 定 をクリックします 右 図 は 左 のメニューから プライバ シーを 選 択 しています 画 面 右 上 の 鍵 アイコンをクリックすると プライバ シーショートカット が 表 示 され 現 在 の 設 定 を 確 認 す ることができます 219
第 7 章 Web ページ プライバシー 設 定 とツール 私 のコンテンツを 見 ることができる 人 今 後 の 投 稿 の 共 有 範 囲 で 投 稿 をシェアする 範 囲 を 設 定 できます この 設 定 は 変 更 しない 限 り その 後 の 投 稿 に 適 用 されます また タイムラインの 過 去 の 投 稿 の 共 有 範 囲 を 一 括 制 限 することもできます 右 図 のように 個 々の 投 稿 でも 共 有 範 囲 設 定 のボタンが 表 示 され るので 共 有 範 囲 を 個 別 に 変 更 することができます 私 を 検 索 できる 人 プロフィールページの 内 容 は 既 定 では Yahoo! や Google などの 検 索 エンジンの 検 索 対 象 になっています 検 索 すると Facebook に 未 登 録 のユーザーにはタイムラインや 友 達 の 名 前 は 見 えませんが Facebook をやって いるということは 確 認 できます そのため 名 前 を 検 索 されて 顔 写 真 や 個 人 情 報 を 悪 用 される 可 能 性 もあります 検 索 されないようにするには 私 を 検 索 できる 人 の 外 部 検 索 エンジンから 私 のタイムラインへのリンク の 編 集 をクリックし その 他 の 検 索 エンジンをタイムラインにリンクさせる チェックボックスを オフ にします オフ Privacy Basics (プライバシーベーシック) https://www.facebook.com/about/basics Facebook が 提 供 している プライバシーベーシック サイトは Facebook 上 で 利 用 者 自 身 の 情 報 を 管 理 する 方 法 (タグ 付 けを 外 す 友 達 を 削 除 する ブロックするなどの 仕 組 みや 投 稿 する 際 の 共 有 範 囲 の 設 定 など)について 詳 しく 解 説 されています 220