5の授業日記

5/9　画像の挿入

webページでの画像

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

1. ｈｔｍｌ種類とは別に画像ファイルを必要点数用意
• 素材フォルタへDL
2. 表示する位置にタグで画像の保存場所・ファイル名を記述
• 挿入＞イメージ
  • コピー元を指定（web/素材）
  • 保存先を指定（web/site/img）
3. HTML種類とともにサーはーへ転送

画像の保存場所

めぼしいものを保存＞web/素材

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

使用する画像＞ｗeb/site/img

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

同じ画像は同一ページ内でコピべできる

背景画像

ページの背景には画像を教き詰めることもできる＞ページプロバティ

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

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

画像ファイルはサイズが大きいので以下の方法で圧縮（最適化）し、軽くしたものを使用する

gif＝画像の色数を減らして軽量化する

• 色数の少ないイラスト・ボタン等
• 背景を透過させて四角以外にすることもできる

jpeg＝画像を劣化させて軽量化する

• 写真などの色数のおおいもの
• 背景は透過できないので四角い

今日のひとこと

面白かった。（笑う）

5/23　さまざまなリンク

相対バス

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

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

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

• 　クラス一覧
• 自分のよく見るページ

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

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

   

絶対バス（URL）

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

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

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

ページ内リンク

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

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

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

1. ファイルではないのでファイル名がないためかわりとなる名前（＝アンカーポイント）を英数半角でつける
   • 挿入＞アンカーポイント
2. リンクさせたい部分を選択しターゲットアイコンからアンカーポイントへドラッグしてリンク指定
3. アンカーポイントが見えない時は先にスクロール

メールリンク

クリックするとメーラーが指定したアドレスを宛先にした状態で立ち上げるリンク

お問い合わせは

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

イメージマップ

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

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

今日のひとこと

さまざまなリンクを勉強して　面白かったです。　

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

5/30　テーブル

エクセルのセル・ワードの表のようなものをページに挿入し、レイアウトにも用いる

DWでのテーブルの作成方法

• 挿入＞テーブル
• 行・列・幅を最初に指定
• セルのサイズは内容に応じて自動で伸t縮（指定しなければ）

テーブルの用語

５月のカレンダ