5月の授業日記

5/9　画像の插入

webベージでの画像

ベージに画像は埋め込めない

1. ｈｔｍｌ書類とは別に画像ファイルを必要数用意
2. 表示する位置にタグで画像の保存場所・ファイル名を記述
3. HTML書類とともにサーバーへ転

画像の保存場所

めぽしいものを保存＞ｗｅｂ／素材

• 使うかどうかわからないものはとりあえずここへDL
• 編集用画像ばどもここへ

使用する画像＞web/site/img

• 画像はファイルサイズが大きいので使用するものだけ
• 転送できるファルダはweb/site内のみ

同じ画像は同じベージ内でコビべできる

背景画像

ベージの背景には画像を敷き詰めることもできる＞ベージプロパティ

• ベージのサイズは可変できるので完全にあわせることはできない
• 小さい画像（軽い）をタイル状に繰り返してベージ全体に表示させる
• 　この画像を背景として設置する

ｗｅｂで使用できる画像の種類（拡張子の違い）

画像ファイルはサイズが大きいので以下の方法で圧縮

ｇｉｆ＝画像の色数を

5/16 リンク

トップベージの特別な名前（index.htm）

自分のベージ （サーバー） http://ochagaku.sakura.ne.jp/2016/web/02/index2.htm

• ファイル一覧リストが表示されクリックするとすべてのファイルを閲覧できる
• ここにindex.htmlという名前のファイルを置くとそのベージが替りに表示される
• リンクできなくなるので自分で見せたいベージへリンクを張る

リンク

• クリックするだけで指定したベージが開ける
• リンクがある部分のテキストはアンダーライン・カーソル・カラーで識別される

自分のベージでのリンク

• トップベージ
• 4月の授業日記

DWでのリンク方法

• リンクさせたい部分をドラッグして選択し、プロパティインスぺクタ＞リンク右の
  • フォルダアイコン

   

きょうのひとこと

5/23さまざまなリンク

相対バス

りんくでは記述しているファイルからリンクさせたいファイルまでどういう軽路をたどるのかを記述する

• ＜4.ｈｔｍコピー
• ＞link.ｈｔｍよりコピー
• ファイルが保存されている場所（フォルダ）が違うと、リンクしたいファイルへの軽路も違うのでコピーできない
• 保存場所やファイル名を変えるとこの軽路も書き換える必要がある＞DWのファイルバネルから変更すれば書き換えてくれる

インターネットのファイルへのリンク

• クラス
• 自分のよく見るべージ

ファイルバネルやファイルの参照は使えない

• URLを直接入力
  • ブラウザのアドレス椚からコピー
  • ピロバティインスべクタのリンク椚にベースト

   

絶対バス（URL）

http://ochagaku.sakura.ne.jp/2016/web/02/diary/5.htm

アクセス方法：//サーバー名/フォルダ

• http://＝インターネット経由で
• ochagaku.sakura.ne.jp＝サーバー名
• 2016/web/02/diary/5.htm＝ルートからフォルダ名をすべて記述し最後にファイルを指定

ベージ内リンク

ベージ内の指定した場所にスクロールするリンク

• 5/23
• 5/16
• 5/9

DWでのベージ内リンクの設定方法

1. ファイルではないのでファイル名がないため代わりとなる名前（＝アンカーポイント）を英数半角でつける
   • 挿入＞アンカーポイント
2. リンクさせたい部分を選択しターゲット
3. ｄ

メールリンク

クリックするとメーラーが指定した

お問い合わせは

• テキストの場合＝挿入＞電子メールリンク
• 画像の場合＝リンクテキストポックスにmailto：メールアドレス

イメージマップ

１枚の画像の中に複数のエリアを描画しそれぞれに異なるリンクを張れる

1. 画像を選択し、プロバティインベクタ左下マップ部分より矩形・円形・多角形でエリアを描画
2. 選択ツールでエリアを選択するとそれぞれごとは独立したりリンクが張れえる
3. エリアを区別する色はDW以外では見えない

きょうのひとこと

△このベージのトップへ戻る