県立広島大学 全学共通教育科目 情報処理入門 第14回 2012年7月23日 県立広島大学 経営情報学部経営情報学科 准教授 小川 仁士.

Slides:



Advertisements
Similar presentations
1 共通科目 コンピューターリテラシー b 第 4 回 電子メールとその設定 担当: 遠藤 美純
Advertisements

第1章 ネットワークとコミュニケーション 第2節 ネットワークのしくみ 2 ネットワークを支える技術 (教科書 p36 ~ p37) 今日の用語  モデム (modulator/demodulator:modem)  IP アドレス (internet protocol address)  ドメインネーム.
ウェブページビルダーマニュアル 株式会社 SOIYAA.
デジタルカメラで撮影した写真を 友人や親戚にメールを使って送る
情報基礎A 情報科学研究科 徳山 豪.
ブラウザの基本操作 前のページに戻る ブラウザの左上にある 「戻る」ボタンで、自分がたどってきた一つ前のページに戻ることができます。
情報処理 第7回:Wordを用いた文書の作成 その2 June. 10, 2016.
画像展示サイト“Fragments” 『閲覧しやすさ』と『デザイン性』を両立させた Webデザイン
今回学ぶこと 電子メールとは? 電子メールの受信と送信 電子メールの利用に関する設定 電子メール利用上のマナー.
QRコード作って使ってみる 作成者: 川瀬 智美 川瀬智美ですよろしくお願いします ここにあるマークご覧になったことありますでしょうか?
小学校3年 指導資料例データ.
計算機リテラシーM 第2回 メール 伊藤 高廣.
ネットワークの仕組み.
情報処理基礎 2006年 6月 1日.
ITの日本語教育への利用1 PART II 小澤伊久美
ウェブページ制作の基礎 タグの直接入力によるウェブページの制作 次のスライドへ進んだり,戻ったりしたい時は,右下のボタンをクリック。 次へ.
HTMLの記述と WWWにおける情報公開 遠藤
法人e名刺 ブログ運用マニュアル 社外秘 目次 □ブログ運用ルール
情報科学 竹内光悦.
ほんとにだいじょうぶ!? ネット や ケータイ
レポート課題について.
2016/05/30 駒澤大学 経営学部 市場戦略学科 Mr4026 ばーちー
メールの使い方・・・・・・内容 メール送受信のしくみ メールの利点 注意事項 メール実習.
クイズ 「インターネットを使う前に」 ネチケット(情報モラル)について学ぼう.
ネットワーク情報活用 ILC Office / ILP KOBAYASHI Tomoko
プログラミング演習I 2004年4月14日(第1回) 木村巌.
Netscape Communicator Eudora Microsoft Word
第2章 第3節 コミュニケーションにおけるネットワークの活用 情報Cプレゼン用資料(座学24) 担当 早苗雅史
チュートリアル EBSCOhost での記事の閲覧 support.ebsco.com.
情報コミュニケーション入門 2016年度版 情報コミュニケーション入門m 総合実習(1).
一歩進んだインターネットの利用 ~Firefox と qwikWeb~
高等学校 情報A (1)情報を活用するための工夫と情報機器 イ 情報伝達の工夫 いろいろな情報伝達の方法
第2章 第3節 コミュニケーションにおけるネットワークの活用 情報Cプレゼン用資料(座学24) 担当 早苗雅史
ネットワークコミュニケーション (教科書88ページ).
Youtubeへの 動画アップロード方法        D8694 初村 聡.
メッセージ機能 相手にメッセージを送信する 04 送信する相手を選んでメッセージを送信します。
コンピュータ・リテラシーb 第10回 Excel によるグラフ作成.
県立広島大学 全学共通教育科目 情報処理入門 第13回 2009年7月6日 県立広島大学 経営情報学部経営情報学科 准教授 小川 仁士.
情報伝達・WWW・ソーシャルメディア CMSとHTMLの基礎
第3章 第2節 ネットワークを活用した情報の収集・発信(4) 情報Cプレゼン用資料(座学35) 担当 早苗雅史
情報技術演習Ⅰ 人文学研究のための情報技術入門 2017/07/06
Internet Explorer Microsoft Word
メールの利用1 Webメールの利用方法.
管理画面操作マニュアル <サイト管理(1)> 基本設定 第9版 改訂 株式会社アクア 1.
情報処理 第8回:Wordを用いた文書の作成 その2 June. 8, 2018.
HTTPとHTML 技術領域専攻 3回 中川 晃.
情報コミュニケーション入門b 第10回 Web入門(1)
情報コミュニケーション入門b 第10回 Web入門(1)
SNSなどインターネットを使ったコミュニケーションで 送信!の前に、誤解を与えないか確認しよう
情報スキル活用  第5週 基礎技術-5  その2 : 他のページへのリンク.
すぐできるBOOK -基本設定編-.
第3章 第2節 ネットワークを活用した 情報の収集・発信 4 文書による情報開示
情報スキル活用  第6週    基礎技術のまとめ  復習.
タグを使ったウェブページ作成 兵庫県立伊丹北高等学校 佐藤 勝彦.
Microsoft PowerPoint98 Netscape Communicator 4.06[ja]
情報コミュニケーション入門e 第11回 Part2 Web入門(1)
情報処理 第4回:電子メールの作成と送信 May. 11, 2018.
情報スキル活用 第2週 基礎技術ー2 : Webページの基本形.
メールの仕組みとマナー.
コンピュータ プレゼンテーション.
情報コミュニケーション入門b 第11回 Web入門(2)
情報処理基礎A・B 坂口利裕 横浜市立大学・商学部
コンピュータ プレゼンテーション.
画像を貼る 目標:このようなページを作る.
情報コミュニケーション入門e 第12回 Part1 Web入門(2)
(おさらい) HTML記述様式の標準化.
プログラミング演習I 2003年4月15日(第一回) 木村巌.
情報コミュニケーション入門e 第12回 Part1 Web入門(2)
電子メールのエチケット  就職活動や先生にレポートを提出のためにメー ルを使用する場合は、親しい友達とのメールのや り取りとは異なり、最低限守らなければならないエ チケットがあります。  エチケットを知らないと、相手に不快な思いをさ せたり、メールが届かないことが起きてしまいます。
5 つの方法 Outlook 活用の 最新の署名 次に、連絡先情報を追加します。 [新規作成] を選択し、署名に名前を付けます。
Presentation transcript:

県立広島大学 全学共通教育科目 情報処理入門 第14回 2012年7月23日 県立広島大学 経営情報学部経営情報学科 准教授 小川 仁士

目 次 ★ 第14回 講義ノート 1. 情報活用力テキスト Section7 インターネット コミュニケーションⅠ 目 次 ★ 第14回 講義ノート  1. 情報活用力テキスト Section7 インターネット コミュニケーションⅠ STEP1 インターネットを活用したコミュニケーション STEP2 メールコミュニケーション STEP3 ルールやマナーの原則  2. HTMLによるホームページ作成演習第3回 表組み,フレームを記述するタグ ★ 第14回 課題

インターネットコミュニケーションⅠ セクションの目的 メールや掲示板など,インターネット上で他者とコミュニケーションを取るスキルの習得を目的とする。 インターネットの活用方法はSection1で学習した情報収集だけではない コミュニケーション(情報伝達,情報交換)の手段としてもインターネットは活用されている メールや掲示板は日常的に使用されているコミュニケーションの手段である インターネット上でのコミュニケーションにおいては,他者の気持ちを想像することが大切

インターネットコミュニケーションⅠ 学習目標 STEP1 インターネットを活用したコミュニケーション STEP2 メールコミュニケーション インターネットを介した,さまざまなコミュニケーションツールについて理解する 各種コミュニケーションツールの特徴について確認する STEP2 メールコミュニケーション メールを使ったコミュニケーションの特徴について理解する メールのルールとマナーを理解する シチュエーションや目的に応じて,ルールやマナーを踏まえたメールの作成ができる STEP3 ルールやマナーの原則 インターネット上で,他者とコミュニケーションする際のルールやマナーの原則について理解する 掲示板へ投稿する際の考え方や判断基準について理解する

インターネットを活用したコミュニケーション (1)インターネットとコミュニケーション Webサイト,メール,ブログなどのコミュニケーションツールを利用する際は,その場にふさわしい振る舞いをすることが必要 (2)さまざまなコミュニケーションツール 1)直接やり取りをする メール       特定の相手と直接やり取りできる メッセンジャー  接続中のユーザー同士で会話ができる 2)情報を発信する Webサイト    文字情報だけでなく,画像や動画などを扱える ブログ 手軽に記事の投稿ができ,定期的な情報発信 がしやすい。閲覧者の反応を受け入れることができる

インターネットを活用したコミュニケーション 3)ソーシャルネットワーク SNS(Social Networking Service)・・・会員制のサービス 限られた利用者の間でのみ情報交換や情報共有ができる ミニブログ・・・気軽に日常の出来事や所感を発信できる          ブログと違い1回の投稿に文字数制限がある 代表的なSNS     mixi,GREE,Facebookなど 代表的なミニブログ  Twitterなど

メールコミュニケーション (1)メールコミュニケーションの特徴 メールはパソコンや携帯電話など,さまざまな環境で利用されるため,相手の環境・状況によってはメッセージが適切に伝わらないことがある。 メールは複数のコンピューター(サーバー)を経由して相手先に届くため,一定の約束事を守ってメールのやり取りをしなければ,正しくメッセージが伝達されない。 即時性          送信に時間がかかる場合もある 好きなときに読める  すぐに返事がほしいときには向かない 保存性 気軽に送信できる 画一的          冷たい印象を与えたり,内容によって は誤解を招いたりすることがある メッセージを不用意に送信し,トラブルの原因となることもある

メールコミュニケーション テキストの課題を解いてみましょう。 斉藤さんが村田さんに送ったメールについて,どんなトラブルが起こるか考えてみましょう。・・・P119の課題56

メールコミュニケーション (2)メールのルールとマナー 入力したメールの内容は,一度見直してから送るようにする 読み手の立場にたって,分かりやすい文章を書く 読み手との関係性や立場にふさわしい文体,言葉を選ぶ メールを受け取る受信側の環境を意識する 1)件名 本文の内容を簡潔に表現した件名をつける 好ましくない件名の例 田中です 質問 提出 (無題) Thanks! 好ましい件名の例 7月定例会報告書送付 情報活用力授業の質問 レポート提出_田中 テキストお問い合わせについて 【要返信】交流会のお知らせ

メールコミュニケーション テキストの課題を解いてみましょう。 紺野さんが作成したメールの件名として適切なものはどれか,考えてみましょう。・・・P121の課題57

メールコミュニケーション 2)宛先 「宛先(To)」,「CC」,「BCC」を用いることができる それぞれ複数のメールアドレスを指定することができる 宛先とCCに指定されたメールアドレスには,他の人のメールアドレスが相互に通知される(送信者が送信したメールの本文だけでなく,互いのメールアドレスが分かってしまう) BCCに指定されたメールアドレスは,他の受信者に通知されない(互いのメールアドレスが分からないように送信できる反面,受信者は自分が受信したことを,他の受信者に知られてはならない) 宛先(To) 内容を伝えたい相手,返信が必要な相手 CC 直接は担当しないが内容に目を通しておいてもらいたい相手,特に返信を必要としない相手 BCC 宛先,CCの人からはBCCの情報が通知されない

メールコミュニケーション テキストの課題を解いてみましょう。 高橋さんが作成したメールについて,サークル顧問の阿部先生とサークル部長の藤本さんのアドレスは,「宛先(To)」,「CC」,「BCC」のうち,どの欄に入力するのがよいか,考えてみましょう。・・・P122の課題58

メールコミュニケーション 3)本文 分かりやすく丁寧に 使用できない文字 大切な情報を安易にメールに書かない 誰が誰に送ったのかを本文中に明示する 挨拶などは簡潔かつ丁寧に 最大35文字程度で適宜改行する 用件は簡潔かつ具体的に 署名を付ける 使用できない文字 機種依存文字・・・詳細はP124の解説を参照 半角カタカナ,半角の句読点,半角のかぎ括弧 大切な情報を安易にメールに書かない クレジットカード番号 銀行のキャッシュカードの暗証番号 パスワード

メールコミュニケーション テキストの課題を解いてみましょう。 1)田中さんのメールをふさわしいものに修正しましょう。   ・・・P125の課題59 2)光井さんのメールをふさわしいものに修正しましょう。   ・・・P125の課題60

メールコミュニケーション 4)添付ファイル メール本文に記載できない情報を添付ファイルとして送信 添付ファイルを送受信する際の注意事項 ワープロや表計算ソフトで作成したファイル 画像,音声,動画など 秘密にしたい内容をパスワード付きファイルにして 添付ファイルを送受信する際の注意事項 添付されたファイルにウイルスが混入している場合がある メールのサイズが大きくなる 添付したファイルを開くためのアプリケーションを相手が持っていない場合がある ある程度大きな添付ファイルを送るときには,下記の配慮が必要 ファイルを圧縮するなどして,ファイルサイズをなるべく小さくする あらかじめ相手と連絡をとって,送信してよいかどうか確認する

メールコミュニケーション テキストの課題を解いてみましょう。 フォルダー『送付資料』の中にあるファイルを,テキストに記載された条件のもと,メールに添付して送信してみましょう。・・・P126の課題61    (フォルダー『送付資料』は配布用フォルダにある)

メールコミュニケーション 5)返信機能 受信したメールに対して「返信」する 件名 引用 「宛先」・・・送信元のアドレスが追加される(必ず確認) 「件名」・・・元のメールの件名に「Re:」を付けてコピーされる 「本文」・・・元のメールの本文が引用される 件名 そのまま利用したり,新たに付けたりすることができる 引用 元のメールをすべて引用したり,必要な部分だけ残したりすることができる

メールコミュニケーション テキストの課題を解いてみましょう。 1)テキストのメールに返信してみましょう。 ・・・P128の課題62 2)高橋さんのメールは,適切な内容になっているでしょうか。修正が必要な場合は,どのように修正すればよいか,考えてみましょう。   ・・・P129の課題63 3)村田さんのメールは,適切な内容になっているでしょうか。修正が必要な場合は,どのように修正すればよいか,考えてみましょう。   ・・・P130の課題64

ルールやマナーの原則 (1)インターネットコミュニケーションの基本 1)誰とどんなやり取りをするのか考える 2)相手の立場にたって考える どのようなコミュニケーションがしたいのか 誰とコミュニケーションをとるべきか どんなコミュニケーションツールを使うのか 2)相手の立場にたって考える ツール/コミュニティのルールを守る 送信前に読み返す 個人情報が含まれていないか インターネットコミュニケーションの例・・・P133,134の例題22

ルールやマナーの原則 テキストの課題を解いてみましょう。 1)テキストの掲示板のやり取りを見て,問題のある投稿がないか,考えてみましょう。・・・P135の課題65 2)テキストの掲示板のやり取りを見て,No.4の投稿の問題点について考えてみましょう。・・・P136の課題66

HTMLによるホームページ作成演習第3回 今日演習するタグ 表組み(テーブル)を表現するタグ 参考:フレーム

サイズは表、セルごとに、縦、横の指定が可能 HTMLによるホームページ作成演習第3回 表組み(テーブル)の作成でできること タイトルの設定 セルの横方向の結合 学園の風景 見出しの設定 種 類 写真へのリンク  風景 建物 本館、図書館、講堂 造形 彫像、タワー 行揃え セルを縦方向に結合可能 外枠の 太さ指定 セルの内容は文字、リンク、画像を扱える サイズは表、セルごとに、縦、横の指定が可能

HTMLによるホームページ作成演習第3回 表組み(テーブル)に用いるタグ <table> 表組み全体  <table> <caption> タイトル </caption>           <tr> <th> 見出しセル </th> ・・・ </tr>    <tr> <td> セルの内容 </td> ・・・ </tr>         ・  </table> 表題 表組 行 見出しセル セル

HTMLによるホームページ作成演習第3回 表組み(テーブル)に用いるタグ <table> 表組みとして表現する部分を<table>と</table>で囲む <tr> 表の中の一つの行を指定する <td> 行の中の一つのセルを指定する テキストエディタで「index.html」を開き、 HTMLファイル作成例3.pdfを見ながら編集を加える ブラウザで確認する

HTMLによるホームページ作成演習第3回 表組み(テーブル)に用いるタグ <table border=“幅”> テキストエディタで「index.html」を開き、 HTMLファイル作成例3.pdfを見ながら編集を加える ブラウザで確認する

HTMLによるホームページ作成演習第3回 表組み(テーブル)に用いるタグ <th> 見出し用のセルを指定する テキストエディタで「index.html」を開き、 HTMLファイル作成例3.pdfを見ながら編集を加える ブラウザで確認する

HTMLによるホームページ作成演習第3回 表組み(テーブル)に用いるタグ <caption> 表に説明文をつける テキストエディタで「index.html」を開き、 HTMLファイル作成例3.pdfを見ながら編集を加える ブラウザで確認する

HTMLによるホームページ作成演習第3回 表組み(テーブル)に用いるタグ colspan <td>、<th>タグのオプションとして使用され、セルの横方向への結合を表わす。指定した数のセルが横方向で結合される rowspan <td>、<th>タグのオプションとして使用され、セルの縦方向への結合を表わす。指定した数のセルが縦方向に結合される

HTMLによるホームページ作成演習第3回 セルの横方向の結合の設定例 <table border="1"> <caption>学園の風景</caption> <tr> <th colspan="2">種類</th> <th>写真へのリンク</th></tr> <tr> <td>風景</td> <td>建物</td> <td>本館、図書館、講堂</td></tr> <td>造形</td> <td>彫像、タワー</td></tr> </table> 配布用フォルダから「index-colspan.html」を作業フォルダへコピーする ブラウザで表示し、ソースと見比べて確認する

HTMLによるホームページ作成演習第3回 セルの縦方向の結合の設定例 <table border="1"> <caption>学園の風景</caption> <tr> <th colspan="2">種類</th> <th>写真へのリンク</th></tr> <tr> <td rowspan="2">風景</td> <td>建物</td> <td>本館、図書館、講堂</td></tr> <tr> <td>造形</td> <td>彫像、タワー</td></tr> </table> 配布用フォルダから「index-rowspan.html」を作業フォルダへコピーする ブラウザで表示し、ソースと見比べて確認する

HTMLによるホームページ作成演習第3回 写真 フレームとは 分割したそれぞれのフレームに対応するファイルと、その分割  学園の風景目次  1.学園の建物  2.モニュメント  3.講義室の様子  4.クラブ活動        ・ 1.学園の建物   (文章) 写真 縦、横、幾つにも分割が可能 分割したそれぞれのフレームに対応するファイルと、その分割 方法(フレーム)を定義したファイルを用意する

HTMLによるホームページ作成演習第3回 File ①:frame.html Main page 写真 File ③:gakuen.html  学園の風景目次  1.学園の建物  2.モニュメント  3.講義室の様子  4.クラブ活動        ・ 1.学園の建物   (文章) Main page 写真 File ③:gakuen.html File ④:monument.html File ②:contents.html ・・・

右側のページにmainという名前を付ける HTMLによるホームページ作成演習第3回 フレームの定義 Frameset と指定する <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"> <html> <head> <title>左右2分割のページ</title> </head> <frameset cols="30%,70%" title="学園紹介"> <frame src="contents.html" title="目次"> <frame src="gakuen.html" name="main" title="学園の建物"> </frameset> </html> 右側のページにmainという名前を付ける <frameset cols="30%,70%">という指定で、左側の表示幅30%,右側70%という割合の表示になる frame.html というファイル名を付けて保存する

contents.html というファイル名を付けて保存する 目次用のホームページ作成 右側のmainページに本文を表示する <html> <head> <title>目次</title> </head> <body> <h1>目次</h1> <ol> <li><a href="gakuen.html" target="main">学園の建物</a> <li><a href="monument.html" target="main">モニュメント</a> </ol> <a href="http://www.pu-hiroshima.ac.jp" target="top">          県立広島大学HomePageへ</a> </body> </html> contents.html というファイル名を付けて保存する

HTMLによるホームページ作成演習第3回 スクロールバーの表示  目次が一画面に収まらない場合には、スクロールバーを表示し、スクロールしながら見れるようにする。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"> <html> <head> <title>左右2分割のページ</title> </head> <frameset cols="30%,70%" title="学園紹介"> <frame src="contents.html" title="目次" scrolling="yes"> <frame src="gakuen.html" name="main" title="学園の建物"> ・・・中略・・・ </frameset> </html>

HTMLによるホームページ作成演習第3回 フレームの境界線を消す <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"> <html> <head> <title>左右2分割のページ</title> </head> <frameset cols="30%,70%" title="学園紹介" frameborder="0"> <frame src="contents.html" title="目次" scrolling="yes"> <frame src="gakuen.html"name="main" title="学園の建物"> </frameset> </html>

第14回 演習課題 HTML作成練習(3) ■ 「架空の自己紹介」をホームページにしてみる(続き) 第14回 演習課題 HTML作成練習(3) ■ 「架空の自己紹介」をホームページにしてみる(続き)    自己紹介のホームページをグレードアップし、次回の授業の始まりまでに提出する。 完成したhtmlファイル等は専用フォルダ( q201099xx )内にまとめ、サブフォルダごとYドライブの提出用フォルダへコピーして提出する。(クラスを間違えないように)   (ファイル名は、ユーザIDで区別する) 例:htmlファイル名 Q201099XX-HTML3.html   (メインページからリンクを張った画像ファイル等のファイル名は半角英数字の文字列であれば好きに名付けてよい) 今日紹介したタグを最大限に活用すること!

情報処理入門 第14回 終 了