情報基礎 講義メモ(第13回)

予定

日ごとの内容

試験について

試験は、しない。出席状況と、課題の提出状況と、から評価する。

今日学ぶことの概要

• 情報システムの利用と社会的問題(1)
• 先々の演習(CSSを用いたWebページ作成)の説明　(今週の11:50までに仕上げる)
• 先週の演習(MS-Word)の説明　(来週の11:50までに仕上げる)

今日の内容

情報システムの利用と社会的問題(1)

• 情報システムの利用と社会的問題(1)
  • 　資料　h-1ページ　から　h-8ページ　まで

課題ファイルへのアクセスの確保　(一部省略)

以前の講義メモの「課題ファイルへのアクセス確保」に従って、kadai.html　から、課題成果のデータファイルへのリンクを張ること。

• 今後の課題では、各種のファイルを、public_htmlにコピーした後、その属性が以下のようになっているかチェックする。違っていたときに変更するのには、ファイルのアイコン　を右クリック→プロパティ。
  　　　　　

Windowsファイルのディレクトリの位置関係 (省略)

• 以前の講義メモを参照されたい。

LinuxとWindowsの各領域間のコピー(省略)

以前の講義メモを参照されたい。

CSSを用いたWebページ作成の実習　(今週締め切り)

ディレクトリの構成(前回と同じ)

図のように、ディレクトリを作っておく。「css_sample」、「css_material」、「css_practice」のディレクトリ名は、実は、何でもよい。その中の「css」と「images」 のディレクトリ名は、このとおりにした方が楽である(実際には、「css」も「images」もきちんと名称を指定するのなら、どんな名称でもよい)。

村上先生および中野の作ったサンプルのダウンロード　(省略)

第12回　講義メモを参照されたい。

CSSの役割(2)(前回と同じ)

css_sample の中にコピーしてもらった　gojou.html と　css_sample/cssの中にコピーしてもらった　いくつかの　index_MM_NN.css　をもとに、CSSファイルの役割をデモンストレーションを通じてみてみる。　MM、NN　とは、00、05、10　などの2桁の数字を意味する。

今週までの課題

• 今週の11:50までに下記の作業を実施する。
  • 準拠する資料(教科書)として、村上先生のスライド　http://www.media.osaka-cu.ac.jp/~harumi/edu/ikiso/ikiso-05/css.pdf　を参照すること。
  • ディレクトリ構成などについては、今日の講義メモの　css_practice　などが入った図を参照する。kadai.html　からリンクが張ってあれば、ディレクトリ名などを変えてもかまわない。
  • 自分のウェブページか、css_material　に先週コピーした　index.hmtl　や　features.html　を、CSSを使う形(　CSSを別ファイルにすること　)に書き直す。自分のウェブページは、所定のディレクトリにコピーした後、修正する。
  • 文章部分は、DIV　か　P　で括り、それによりレイアウトにアクセントを持たせる　(gojou.html と　index_MM_NN.css　との組み合わせを参考に)。
    
  • DIV　や　P　の　text-align は、left　か　center。
  • DIV　や　P　のバックグラウンドカラーは、原色でなく、パステルカラー(中間色)にしてほしい。
  • 文字(見出しを含む)は、黒か、濃い目の青(紺)か、濃い目の茶色か、濃い目の深緑にしてほしい。地の文章と見出し(h1、h2など)で、文字の色が異なってもよい。
    
  • margin　(スライド　http://www.media.osaka-cu.ac.jp/~kiyoshi/info_edu/2007_first_half/css.pdf　の　5ページ目の右下のスライド「marginとpadding」から数枚分のスライドを参照)は、10px以上30px以下、padding　は、05px以上20px以下、marginの数値とpaddingの数値との合計が　20px以上40px以下　になるようにする。
    
  • 自分のウェブを書き直す場合：この情報基礎の中で作った自分のウェブページ群を、css_practice　(kadai.htmlからリンクを張る。リンクが張ってあれば、実は、どんな名前でもいい)　の中にそのままコピーする。その後、css　の中に　村上先生のサンプルを真似て　index.css を作り、村上先生のサンプルを真似て、各HTMLファイルが　index.css に従ってレイアウトされるように、index.css を参照する記述を各HTMLファイルに入れる。
    
  • このようにして、レイアウトが、index.cssに従ってなされるようにする。
  • 自分のウェブページ群を触る　(実は、コピーしてから書き換えるので、オリジナルはそのままだが)　のが嫌な場合、前記　で、css_material　にダウンロードしたファイル群を、そのまま、css_practice にコピーする。その後、css　の中に　村上先生のサンプルを真似て　index.css を作り、村上先生のサンプルを真似て、各HTMLファイルが　index.css に従ってレイアウトされるように、index.css を参照する記述を各HTMLファイルに入れる。
    
  • 中野のサンプルでいうと、まず、HTMLファイルの中に、span や　div　の定義があれば、それを　index.css に移動する。それから、HTMLファイルの中に、<font　・・・>などによる文字サイズの変更や、文字の色の変更があったときには、次のようにして、それを　　index.css による指示に移行する。
    行を変えずに行の中で、文字サイズや文字の色を変えている場合には、span　というタイプ、文字サイズや文字の色を変えているのが、行単位である場合には、div というタイプで、新しいスタイル　chuui とか　osusume といった指示のタイプを作る。文字のサイズや色を変更していた部分を　<div class="osusume">　と　</div>　で挟む。
    

MS-Wordの課題(来週まで)

• 型紙ファイルを、以下の場所に保存する。
  • http://www.media.osaka-cu.ac.jp/~kiyoshi/
  • →掲載されている講義資料
  • →情報基礎(情報処理I)　講義資料
  • →2007年前期
  • その他関連資料
    • 12.MS-Wordによるレポートの型紙ファイル
      • 型紙ファイル
        • http://www.media.osaka-cu.ac.jp/~kiyoshi/info_edu/2007_first_half/template.doc 　→　新しく設けた　wordデータ用ディレクトリ　の中に

• 字数は、1000字から2000字
• MS-Wordのデータが、次の条件に適合するようにする。
  • タイトルをつけること、適度に見出し(章の見出しや節の見出し)を入れること。
  • 段組(2段組)をはじめとしたページレイアウトの実際については、型紙ファイルをなぞればよい。
  • 教員の出した課題の内容について冒頭でまとめて明記すること。

以上