1 第 3 章 第 2 節 ネットワークを活用した 情報の収集・発信 5 さまざまな表現方法の工夫 6 情報の多様な提示方法 7 構造を工夫した情報の表現方法 8 ウエブページの公開 情報 C プレゼン用資料(座学 34 ) 担当 早苗雅史.

Slides:



Advertisements
Similar presentations
コンピュータと情報 第 14 回 Word と Excel の連携. ページの設定の変更 ページの設定の変更 印刷領域の余白の設定と 1 行内の文字数と ページ内の行数の変更 印刷領域の余白の設定と 1 行内の文字数と ページ内の行数の変更 段組の仕方 段組の仕方 2 段組の作成の仕方 2 段組の作成の仕方.
Advertisements

コンピュータ基礎実習 ( 上級 ) 第三回 ウェブページの作成について2 清水淳紀. 前回までの内容  ページの簡単な作り方。  ページの編集・アップロード・確認 方法について。  ページはメモ帳や Kompozer 等で編集できる。 ウェブサー バーにアップロード  ページを公開するには、必要ファイル群をウェブサー.
PowerPoint による プレゼンテーションの作成 2005 年 7 月 19 日 牧野真也 最初のスライドは通常表紙となる.
PowerPointによるスライドの作成 文教 花子
情報基礎A 情報科学研究科 徳山 豪.
校内研修用提示資料 パワーポイントの基本操作.
情報処理 第8回.
PowerPointによるスライドの作成 文教 花子
Microsoft PowerPoint98 Netscape Communicator 4.06[ja]
PowerPointによるスライドの作成 文教 花子
情報処理入門A・B 第7回 ワープロソフト入門(2)
インターネット社会を生きるための 情報倫理
プレゼンテーション用ソフトウェア Impress
コントロールパネル ◎コントロール パネル: コンピュータのさまざまな機能を設定するための画面
Microsoft Office クイックガイド ~Word 2013~
CEC公開授業 Webサイト制作にチャレンジ! 2007年11月20日 於:東京都立板橋有徳高校 学校インターネット教育推進協会.
情報処理 教材 プレゼンテーションソフト PowerPoint 高知大学 共通教育 理学部 対象 塩田
ホームページづくりに挑戦しよう 常信伊佐夫 スペースバーを押して進めてください.
情報処理 第13回の教材 プレゼンテーションソフト PowerPoint 高知大学 共通教育 理学部 対象 担当:塩田 ここはメモを書く欄。
情報処理 第11回の教材 プレゼンテーションソフト PowerPoint 高知大学 共通教育 理学部 対象 担当:塩田 ここはメモを書く欄。
情報処理 第12回の教材 プレゼンテーションソフト PowerPoint 高知大学 共通教育 理学部 対象 担当教員 : 塩田
HTMLの記述と WWWにおける情報公開 遠藤
Microsoft Office 2010 クイックガイド ~PowerPoint編~
Microsoft PowerPointを使ってみよう
Microsoft Office クイックガイド ~PowerPoint 2013~
プレゼンテーション用ソフトウェア Impress
ネットワーク情報活用 ILC Office / ILP KOBAYASHI Tomoko
徳山 豪 東北大学情報科学研究科 システム情報科学専攻 情報システム評価学分野
第3章 第2節 ネットワークを活用した 情報の収集・発信 6 情報の多様な提示方法 7 構造を工夫した情報の表現方法 8 ウエブページの公開
Webサイト運営 09fi118 橋倉伶奈 09fi131 本間昂 09fi137 三上早紀.
第2章 第3節 コミュニケーションにおけるネットワークの活用 情報Cプレゼン用資料(座学24) 担当 早苗雅史
情報関連教室オリエンテーション 情報関連教室 オリエンテーション C000.
PowerPointによるスライドの作成 文教 花子
第2章 第3節 コミュニケーションにおけるネットワークの活用 情報Cプレゼン用資料(座学24) 担当 早苗雅史
 パワーポイントによる教材作成    校内研修提示資料.
中間発表 アリの王国更新 金華山の写真整理 柏崎 奈々 中間発表を始めます。
Webページを公開しよう! 公開前の点検とファイル転送 ユーザ名~user○○○ パスワード~自分で設定したもの
サイト運営者へむけて、CMS管理画面をつかって サイト運営していく方法を紹介します。
スタイルシート C306 情報発信の基礎【第6回】.
第3章 第2節 ネットワークを活用した情報の収集・発信(4) 情報Cプレゼン用資料(座学35) 担当 早苗雅史
第2章 第1節 情報通信の仕組み 1 ネットワークの仕組み 2 通信プロトコル 3 認証と情報の保護
第3章 第2節 ネットワークを活用した 情報の収集・発信(3) 5 表現方法の工夫
簡単PowerPoint (PowerPoint2007用)
経営工学基礎演習a PowerPointの利用.
ホームページ作成・更新講座 夏のコンピュータ学習会 画像
【第1回】マルチメディアとは① 画像の処理 J000
ICT活用指導力チェックシート(小学校版)
情報コミュニケーション入門b 第10回 Web入門(1)
情報コミュニケーション入門b 第10回 Web入門(1)
情報処理 第8回.
第3章 第2節 ネットワークを活用した 情報の収集・発信(2) 4 文書の構造と表現
第3章 第2節 ネットワークを活用した 情報の収集・発信 4 文書による情報開示
情報コミュニケーション入門e 第11回 Part2 Web入門(1)
PowerPoint 2007 のご紹介 新しい機能について.
Microsoft Office クイックガイド ~PowerPoint 2013~
情報コミュニケーション入門b 第11回 Web入門(2)
コンピュータ リテラシー 担当教官  河中.
情報コミュニケーション入門e 第12回 Part1 Web入門(2)
情報処理 第13回の教材 プレゼンテーションソフト PowerPoint 高知大学 共通教育 理学部 対象 担当教員 : 塩田
簡単PowerPoint (PowerPoint2003用)
PowerPointについて 効果的なプレゼンテーションを作成できるツール
PowerPointによるスライドの作成 文教 花子
情報コミュニケーション入門e 第12回 Part1 Web入門(2)
Microsoft SharePoint Online の Web サイトを カスタマイズする方法
PowerPointによるスライドの作成 文教 花子
情報A 第19回授業 06情報伝達の工夫 プレゼンテーションソフトウェア
情報処理 第7回:Wordを用いた文書の作成 その1 May 31, 2019.
情報ネットワークと コミュニケーション 数学領域3回 山本・野地.
情報処理 II 第11回の教材 プレゼンテーションソフト PowerPoint 高知大学 共通教育 理学部 対象 担当:塩田
Microsoft Office 2010 クイックガイド ~PowerPoint編~
Presentation transcript:

1 第 3 章 第 2 節 ネットワークを活用した 情報の収集・発信 5 さまざまな表現方法の工夫 6 情報の多様な提示方法 7 構造を工夫した情報の表現方法 8 ウエブページの公開 情報 C プレゼン用資料(座学 34 ) 担当 早苗雅史

2 1 ウエブページを作る マークアップ(タグ挿入)式 WYSIWYG 式 ワープロの HTML 形式での保存 5 さまざまな表現方法の工夫 WYSIWYG マークアップ

3 2 表現方法の指定とスタイル シート 5 さまざまな表現方法の工夫 スタイルシート 文字の大きさや色などをまとめて指定する方法 利点(問1) 凝ったレイアウトの作成 スタイルシートを変えるだけで見栄えを変化 共通のスタイルシートを使った,複数 HTML ファイルに統 一したデザインの適用 スタイルシートをどこに記述するか HTML ファイルの中にスタイルを直接指定する HTML ファイルとは別に「スタイルシート ファイル」を 作成 何に対してスタイルを設定できるか  タグ,クラス, ID

4 スタイルシート① レイヤーとインラインスタイル 5 さまざまな表現方法の工夫 レイヤー 位置,サイズの設定 レイヤーの背景設定

5 スタイルシート② スタイル(クラス,タグ, ID ) の設定 5 さまざまな表現方法の工夫 各種スタイル の設定 スタイルを設定する対象

6 スタイルシート③ 外部スタイルシート 5 さまざまな表現方法の工夫 スタイルシート内におけるスタイルの設定

7 3 表現方法の工夫(問2) 表現方法の工夫 部分的に文字色を変える 下線をつけ重要な部分を強調する 文字の大きさや色使い 画像のサイズや表示範囲に配慮する 5 さまざまな表現方法の工夫 みんなが自分と同じ条件で Web ページを見るとは限らない

8 1 表による表現 文書やWebページ作成時の適切な提示方法 ① 箇条書きや表を用いると,要点を簡潔にまとめること ができる 6 情報の多様な表現方法 表にまとめると わかりやすい

9 ウェブページ作成ソフトウエア① 表の挿入 6 情報の多様な表現方法 行数・列数の決定 枠表示などの決定

10 2 画像を使ったウエブ 6 情報の多様な表現方法 文書やWebページ作成時の適切な提示方法 ② 図・絵・写真などを用いると,わかりやすい 画像は使いすぎないようにする

11 画像ファイルの扱い 6 情報の多様な表現方法 タグによる画像の挿入 Webでの画像 JPEG,GIF,PNGWebでの画像

12 ウェブページ作成ソフトウエア② 画像の挿入(ファイルか ら) 6 情報の多様な表現方法 ファイル名の決定

13 ウェブページ作成ソフトウエア③ 画像の挿入(ドラッグ アンド ド ロップ) 6 情報の多様な表現方法 ドラッグ アンド ドロップ

14 ウェブページ作成ソフトウエア④ ロゴマークの挿入 6 情報の多様な表現方法 スタイルの決定 効果の決定 背景の決定

15 ウェブページ作成ソフトウエア⑤ アニメーション GIF 6 情報の多様な表現方法 アニメーション効果の決定 時間・フレーム数の決定 文字アニメーションの作成

16 効果的なWebページの作成 (問3) 全体的なスタイルの統一 箇条書きや表を用いて要点を簡潔にまと める。 図・絵・写真などを用いると,分かりや すい。 ただし,画像は使いすぎないようにする。 6 情報の多様な表現方法

17 1 参照とリンク 参照 ある情報の中で,別の情報のありかを示すこ と ハイパーテキスト リンク箇所を選択すると,自動的に参照先を 表示 7 構造を工夫した情報の表現方 法 2035年には,関東 地方で皆既日食が 見られる。 詳しくは「理科年表」 を参照せよ。 2035年には,関東 地方で皆既日食が 見られる。 詳しくは「理科年表」 を参照せよ。 参照

18 2 ウエブページのリンク 7 構造を工夫した情報の表現方 法 ファイルの決定 様々な形式へのリンク

19 3 ウエブページの構造(問 4) 線形構造 それぞれのページを直線的に並べた構造 単純で分かりやすい 階層構造 枝分かれするようにページを並べた構造 見たいところへすぐにジャンプする 7 構造を工夫した情報の表現方 法 線形構造 階層構造

20 サイト管理ツール 7 構造を工夫した情報の表現方 法 リンク構成やファイルリストなど サイト管理の便利な情報を表示 リンク構成やファイルリストなど サイト管理の便利な情報を表示

21 フレームの作成 7 構造を工夫した情報の表現方 法 分割方法の決定 対象フレームの選択 リンクファイルの選択

22 問5 7 構造を工夫した情報の表現方 法 ①東エリアのメンバー一覧。 ②東エリア・西エリアに含まれる地域の区分地 図。 ③西エリアのメンバー一覧。 ④西エリアのメンバーについての特記事項。 ⑤これより下層に含まれる情報の利用について の注意事項と免責事項。 ホームAB C DE

23 1 ウエブサーバへの設置 公開 HTML ファイルなどをウエブサーバへ転 送 FTP (ファイル転送プロトコル) ブラウザで URL を指定 8 ウエブページの公開 ウエブサーバ インターネット FTP

24 FTP用ソフトウエア 8 ウエブページの公開 接続サーバーの決定 サーバー名 アカウント名 パスワード クライアント サーバー 転送ボタン

25 2 情報発信にともなう責任 (問6) 誤った内容を公開していないか プライバシーを侵害していないか 他人を誹謗中傷したり差別したりしていな いか 知的財産権を侵害していないか ウイルスを含んでいないか 偽造・虚偽,詐欺的な内容でないか わいせつ・暴力などの有害情報ではないか 8 ウエブページの公開

26 3 ウエブページの更新と保守 ページの公開とフィードバック メールなどで寄せられる意見を大切にし 内容の改良に役立てる 自分なりの評価 更新 ウエブページの情報を 新しいものする作業 保守 ウエブページの情報を 正しい状態に維持する作業 8 ウエブページの公開

27 ウエブページの評価① ルールとマナー 8 ウエブページの公開 評価する項目 自己 評価 知的財産権を侵害していない 他人を誹謗中傷したり差別したりしていない 個人情報や肖像権が守られている 人権への配慮がなされている 文化や習慣が異なる人が見ても不快な思いをしない 誤った内容を公開していない

28 ウエブページの評価② 構成と内容 (問7) 8 ウエブページの公開 評価する項目 自己 評価 全体的なスタイルが統一されているか 魅力的なテーマ設定になっているか ターゲットが明確になっているか 見る人が理解しやすい情報の構成になっているか 表・グラフなどを効果的に用いているか 画像やアニメーション・サウンドなどが効果的に用いら れているか