「情報処理III」話題メモ
これは、同時進行で2回の「情報処理III」があるために、なるべく
話題に不公平が無く同じような話をするために、主に最初に講議のある
水曜日1限目に話題とした事柄、あるいはその前週あたりにこんな話題で
いこうかな、と記したメモを、個人的な備忘録として置いたものです。
欠席した学生はあとから追いかけるために利用できるかもしれませんが、
そういう点はあまり考慮せずに書き付けていますので、
まぁ読み流す程度としておいて下さい。(^_^;)
初日(10/3)
- イントロ、講議ローカルルール、リテラシ
- TAは渡辺純子先生(^_^)
- 今日のセキュリティ「貴方の足跡はログで常に記録されている」
- 今日のセキュリティ「常時接続でWindowsでIEを使う人は何が起きても構わない人」
2日目(10/10)
- 環境設定、ブラウザの設定から始めよう(^_^)
- 今日のキーワード「URL」「HTML」
- 今日のキーワード 「ドメイン」「ファイアウォール」「プロキシ」「サーバ」
- 「SUAC内」(www.is.suac.ac.jp)と「SUAC外」(www.suac.ac.jp)の区別
- 今日のセキュリティ「ワンタイムパスワード」、Secure IDカードの実物
- いよいよ「ホームページの作り方」
(http://nagasm.org/1106/joho3/tutorial/tutorial01.html)
をゆっくり始めよう
- HPのHTMLソースはNetscapeの「ページのソース」で必ず見える(秘密にできない)
- 上手いHPテクニックは「ページのソース」でイタダキ(^_^)
- ファイル名には「半角英数字」だけを使う。日本語厳禁
- ファイル名のピリオド以降を「拡張子」と言う
- デフォルトのHTMLファイル名「index.html」「index.htm」
- はじめての(自力で作った)ホームページを完成させてブラウザに表示させる
3日目(10/17)
- 今日のセキュリティ「セキュリティ・ポリシー」
- セキュリティ上もっとも危険なのはWindowsの人。不正者はメジャーな
Windowsを狙うし、ユーザの利便性を口実にMicrosoft社はセキュリティ上の
リスクをユーザの自己責任に転嫁するというポリシーであるため。
- 「Windows環境でパソコンを使う人は、いつ全てのデータが消えても
構わないという奇特な人」
- ホームページの発信→HTMLファイルをQドライブの「public_html」フォルダに置く
- タイトルは単なる題名でなく、ブックマークのリストとなるので重要
- タイトルは「半角英数字」だけを使う、という習慣がお薦め
- HTMLでは「改行」「タブ」「(半角)スペース」は無視される
- BODYタグのオプション(1) 背景色とテキスト色、光の3原色、16進数表現
- 本日はtutorial09まで(^_^;)
4日目(10/24)
- 「今日のセキュリティ」は無し。どんどんぶっ飛ばす !
- BODYタグのオプション(2) 背景画像
- 画像データについて
- 「色」と「光」
- タテとヨコの比(アスペスト比)
- 画面の解像度(VGA,SVGA,XGA,SXGA,...)
- スクリーンショットは画素ごとにカラー値を持つ。BMP,PICT,RGB。
- これをインターネットでは圧縮されたJPG(JPEG)かGIFに変換して利用する。
- 本日よりデジカメを毎回持参する。15台しかない。接続できるパソコンも15台。
- デジカメの解像度設定に注意。ポスターやカレンダーでもないのに巨大なデータに
するのは、どうせ後で縮小するのでまったく無意味。
- 賢いデジカメの選び方
- ホームページ上に見える画像は全てイタダキ可能。ただし著作権と肖像権を
十分に考えること。(^_^;)
- 「著作権フリー素材集」の活用
- 背景画像は配色、コントラストなどに注意
- 透明色指定により画像の後ろの背景色が見える
- 背景をアニメーション画像にすれば騒然とした画面もできる(^_^;)
- 「ルーブルのモナリザ」と「SUACのモナリザ」
- 本日はtutorial16まで(^_^;)
5日目(10/31)
- 本日はtutorial17から
- HTMLの考え方について(再考)
- 水平線について
- 水平線の長さを絶対値ドット数として指定することとパーセント指定することの意味
- センタリング
- 強制改行
- 段落
- 「強制改行」の連打
- 「段落」の連打
- HTMLの発想を強制停止させる「PRE」タグの使用には注意を
- フォントサイズ
- フォントカラー
- 「見出し」は「フォントサイズ」+「段落」+「強調」
- 強調(ボールド)
- 本日はtutorial32まで(^_^;)
6日目(11/7)
- 本日はtutorial33から
- 「ブリンク」: HTMLに最初から備わっている「動的な表示」
- いろいろな文字表現属性タグ
- 箇条書きについて
- ブロック引用
- インラインイメージ
- 画像と文字、キャプションなど
- リンク : HTMLの最大の本質
- リンクカラーの設定(BODYタグで)
- リンクカラーの設定(FONTタグで)
- リンクボタン = 「リンク」+「インラインイメージ」
- リンクボタンのBORDER
- 本日はtutorial48まで(^_^;)
7日目(11/14)
- 番外編・「一般のフリーサーバにWeb領域を持つ」(^_^)
- 本日はtutorial49から
- 本日はtutorial50まで
- ページ内リンク(Aタグのオプション)
- メイルをいただく方法(注意点もあり!)
8日目(11/21)
- 本日はtutorial51から
- ターゲットウインドウ(Aタグのオプション)
- ダイナミックドキュメント
- 「クリッカブルマップ」について(^_^)
- このページを参考にして、自分なりの画像で
クリッカブルマップ(クライアントサイドイメージマップ)を作ってみよう(^_^)
- クリッカブルマップを実現する方法としては、歴史的には大きく3種類ある。「情報処理III」では
もっとも歴史的には新しい手法であるクライアントサイドイメージマップ
しか扱わないが、他の手法も重要なので、作り方はともかく、参考に知っておくこと
- Webサーバ側にCGI(Common Gateway Interface)という機構を設定して、サーバ内の
プログラムに情報を引き渡して処理を行い、その結果をHTMLファイルと同じ形式の情報と
して返す手法。HTMLの歴史のスタートとともにあった手法。実例としては、
このページ
の、占いの項目を選ぶ部分がCGIによるクリッカブルマップである。マップ画像内で
クリックしたマウスの座標が、ブラウザからサーバのCGIに渡される。
これはサーバ内のイメージマップ処理プログラムに引き渡され、
あらかじめ座標領域ごとに定義したオリジナルの「占い」プログラムを起動する。この
占いプログラムの出力はHTMLファイルの先頭から読み出したような文字列になって
いるので、これが返ってきたブラウザは、普通のHTMLファイルだと騙されて(^_^;)、
その内容を「占い結果」として表示する
- CGIを使わずに、新しく登場してきたJavaを使う手法。Javaはホームページ上(ブラウザ内)で
走るプログラムを任意に作れる環境なので、画像(マップ)を表示して、その画像内でクリック
されたマウスの座標を取得すれば、リンクだろうがサウンドだろうが自由自在である。
このページの例(ブラウザの「詳細」の設定で
「Javaを有効にする」としていないと何も見えない(^_^;))では、マウスが指定領域にかかると
その部分がハイライト表示され、さらにサウンドが鳴るようになっている。このような動的な
クリッカブルマップとなると、JavaかShockwave(Director)でないと実現できない。
JavaとShockwave(Director)については、後日、解説の予定(^_^)
- CGIもJavaも使わないクライアントサイドイメージマップ。これは
HTML規格が拡張され、ブラウザが対応するようになって初めて実現された。今となっては、簡単な
クリッカブルマップには、これが一番(^_^)
- 画像処理ソフトでいちいち座標領域を調べてメモしてHTMLに書いていく、というのは面倒なことで、
実際には「ホームページ制作・お手軽ソフト」ではAREAタグのパラメータを自動生成してくれるが、
そのHTML規約に従ったメカニズムを知っておくことは、あらゆるホームページの仕掛けを「ソースを
見る」で理解できるためには重要なので、「テキストエディタで、素のHTMLとして作れる」ように
なってから、ツールを活用するようにしよう
- 本日はtutorial59まで(^_^;)
9日目(11/28)
- 本日はtutorial60から
- コメント
- 強制改行の取り消し(^_^;)
- 上付き文字、下付き文字
- テーブル(作表)
- テーブルは、実際にはツールに任せて作ることが多いが、テーブルを自分で改造する
という場合には中身が理解できていないと困るので、テーブルを使ったどこかのページの
ソースをいただいてきて、それを解読・改造する、というのは絶好の教材となる。
- 本日はtutorial72まで(^_^;)
10日目(12/5)
- 本日でtutorialシリーズ(HTMLの基礎)はオシマイ(^_^)
- 本日はtutorial73から
- フレーム(ブラウザ内の画面分割)
- サウンドについて
- ホームページにサウンドを盛り込む、という話題は「情報処理III」ではoptionalとする。
- 技術造形学科の学生は専門科目(「サウンドデザイン」等)で、みっちりやります(^_^)
- 詳しい解説は図書館の「コンピュータサウンドの世界」(長嶋洋一)を参照のこと
- サウンドには大きく二つあり、「音響」「音楽」で扱いが異なる
- 「音響」は、パソコンに付いているサウンドレコーダ等で簡単に録音でき、フリーウェア
やシェアウェアで簡単に加工できる。WindowsのWAV形式データはインターネット
では使わないので、AIFFかAUかMP3に変換すると、リンクのHREF先として指定するだけで
ブラウザがサウンド再生システムをインストールしていれば、鳴る(^_^)
- 著作権のある音源(CDやラジオ放送など)をMP3とかにしてホームページに置くのは禁止
- 「音楽」は、いわゆる「打ち込み(DTM)」ソフト等で音楽データを並べた
MIDI形式のファイルとする。ただしこれには音楽的知識なりアレンジの
ノウハウなりが必要となり、「情報処理III」の内容を超える。
- MID形式のファイルも、リンクのHREF先として指定するだけで
ブラウザがサウンド再生システムをインストールしていれば、鳴る(^_^)
- ページ内にMIDデータの自動演奏を組み込むには、EMBEDタグを用いる
- インターネットで公開されているMIDIデータは、元々の作曲家の死後50年が
経過して著作権が切れている曲であっても、打ち込みした人のアレンジという
著作物なので無断で使用することは違法行為
- 海外では著作権が切れているクラシックの場合にも、日本は第2次大戦の
敗戦国で戦時加算規定(戦争中は著作権のカウントが停止していた(^_^;))により
著作権が残っている場合があるので注意
- 結局、自分のオリジナル作品でなければサウンド関係は著作権の問題が
根強く関係してくるので、ホームページでは注意が必要である
- マイクロソフトのセキュリティポリシーを考えよう
11日目(12/12)
- Javaについて(optional)
- ホワイトボードに描くJava解説の「図」は、Web資料では置かないので、自分で写して理解
して欲しい。それほど重要なことを説明の予定(^_^)
- 「他人の褌」Java活用法について
- Javaソースが公開・提供されているページからソースを入手して、改造しつつ
コンパイルする
- Javaアプレットが公開・提供されているページからダウンロードする
- 「著作権フリーJavaアプレット素材集」のサイトやCDROM製品の利用
- Webに置いてあるJavaアプレットをURLとして指定する
12日目(1/23)
- 年末年始のセキュリティについて
(参考)ZDNN:ウイルス&セキュリティ★
- 「Webページを持つ」「サーバを立てる」「ドメインを持つ」ということについて
(参考)レジストラ・登録業者リスト★
(参考)INTERNIC★
(参考)JPNIC★
- 解説の抜けた内容について : 以下の解説を参照のこと
- HTMLの自動生成について★
- JavaScriptについて★
- Director(Shockwave)の実験室★
- 課題について
「メモ帳(NotePad)」でHTMLを編集する場合の注意点★