RIGHT:[[授業のページへ戻る>Lecture/CompPracR2003]] *コンピュータ演習(再) 第14回 [#n76eaece] **画像ファイル [#t125cd29] ***画像ファイルの種類 [#s0149f00] -GIFファイル(*.gif) --アイコン向き(256色しか扱えない) --Compu Serve(現在はAOL)が定められたフォーマット --透過GIFやアニメーションGIFなど機能が豊富 -JPEGファイル (*.jpg, *.jpeg) --写真やイラスト向き(フルカラーが扱える) --ファイルサイズが小さい(圧縮率を変える) -PNGファイル (*.png) --GIFファイルに代わるフォーマット --GIFファイルあるUnisysの特許問題を避けるために定められた -BMP(ビットマップ)ファイル (*.bmp) --Windows標準の画像フォーマット(「ペイント」で作成できる) --ファイルサイズが大きい --Webページ向きではない(ほかの形式に変換) -参考リンク --情報機器と情報社会のしくみ素材集:http://kyoiku-gakka.u-sacred-heart.ac.jp/jyouhou-kiki/index.html **著作権 [#r0961ab8] ***著作権とは [#v20d0c27] -著作権とは? --「著作者」が「著作物」に対して持つ権利(「著作権法」より) --著作者に無断で第三者に公開することはできない -著作物とは?(一部) --小説、脚本、論文、講演 --音楽(曲、歌詞)、舞踏 --絵画、彫刻、写真、映画 --コンピュータのプログラム -著作者とは? --著作物を創作した人 -著作権はいつ発生する? --特別な手続きは必要なし(創作した時点で自動的に発生) --著作者の死後50年後まで有効 -参考リンク --しゅんしゅんの著作権講座:http://www.geocities.jp/shun_disney7/ **画像ファイルの利用 [#s5e41ecf] ***画像ファイルの用意 [#vd04605d] インターネットに公開されている「素材集サイト」を利用して、 画像ファイルを用意します。 素材集サイトを利用するときには、利用に関する注意事項を確認しましょう。 「著作権フリー」のように、再利用が許可されているかどうかにに注意しましょう。 +Yahoo! JAPAN( http://www.yahoo.co.jp)にアクセス +「コンピュータとインターネット > インターネット > WWW > ホームページ作成 > グラフィックス、素材」の順にカテゴリを絞り込む +登録されているサイトにアクセスし、画像ファイルを探す +気に入った画像があったら、画像を右クリックする ++メニューから「名前をつけて画像を保存」を選ぶ ++ファイルの保存場所を指定して、「保存」ボタンをクリック -参考サイト --素材散策:http://www.tsukuru.com/sansaku/ ***画像ファイルの表示 [#j4bbe496] 画像をWebページに貼り付けるには、''<img>''タグを使います。 -<img src="..."> --Webページに表示する画像ファイルを指定します。 --「src=」の後には、画像ファイルの場所(URL)を指定します。 --「alt=」の後には、画像の名前を入力します。 <img src="画像ファイルの場所" alt="画像ファイルの名前" width=XXX height=XXX> <img src="title.gif" alt="タイトル" width=300 height=60> --「width」と「height」は、画像の幅と高さのサイズを指定します(省略可能)。 ***背景画像の表示 [#sd6c22ce] 背景画像を表示するには、スタイルシートを使います。 -<body>タグに''background-image''属性を指定します。 <style type="text/css"> <!-- body {color: black; background: white; background-image: url(ファイルの場所);} -参考リンク --とほほのWWW入門・背景画像(壁紙):http://tohoho.wakusei.ne.jp/how2/bgimage.htm ***表によるレイアウト [#me7b5fd4] HTMLには「表」を作る''<table>''タグがあります。 本来の目的は表を表示するためのものですが、 この機能を使って、Webページの内容をブロック状にレイアウトすることができます。 |>|CENTER:メインメニュー| |CENTER:サブメニュー|CENTER:コンテンツ(内容)| |>|CENTER:署名| -<table>...</table> --テーブル(表)を設定します。 --「<table border=X>」でテーブルの枠の太さを指定できます。数字を指定し0にすると枠線が見えなくなります。 -<tr>...</tr> --テーブルのひとつの行を設定します。 -<td>...</td> --テーブルのひとつのマス目を設定します。 <table border=1> <tr><td>1</td><td>2</td><td>3</td></tr> <tr><td>4</td><td>5</td><td>6</td></tr> <table> |1|2|3| |4|5|6| **参考リンク [#h9897c9a] -とほほのWWW入門 --http://tohoho.wakusei.ne.jp/ -Academic HTML --http://www.tg.rim.or.jp/~hexane/ach/ -The Quick Color Table --http://www.kanzaki.com/docs/colortable-t.html |