５月の授業日記

5/9　画像の挿入

WEBページでの画像

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

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

画像の保存場所

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

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

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

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

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

背景画像

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

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

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

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

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

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

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

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

今日の一言

なんもない文字だけのページに画像がついて見やすくなった。

5/16 リンク

トップページの特別な名前（index,htm）

自分のページ（サーバー）http://ochagaku.sakura.ne.jp/2016/web/01/

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

リンク

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

自分のページでのリンク

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

DWでのリンク方法

• リンクさせたい部分をドラッグして選択し、プロパティオンスぺクタ＞リンク右の
  • フォルダイコンをクリックして選択し、参照ダイアログからリンクしたいファイルを選択
  • ターゲットアイコンからファイルパネルのリンクしたいファイルのアイコンまでドラッグして指定
• プロパティインスペクタのリンク欄にリンクしたいファイルまでの経路（パス）が記述されリンクできる
• リンクの確認はDWでは行えないのでブラウザでデビュー

リンクカラー

リンクカラーはページプロパティより設定

• リンク＝未訪問時のリンクカラー
• 訪問済みのリンク＝訪問したことがあるリンク先のカラー
• アクティブリンク＝クリック時のカラー

画像のリンク

• 画像にリンクさせる場合は画像を選択し、プロパティインスペクタより
• リンク画像をコピペするとリンクごとコピペされる（同じ階層のみ）

パス（経路）のコピーペースト

• リンクやイメージはそのファイルへの経路（バス）が記述されている
• フォルダが違うと行き方が異なるのでコピーできない

きょうのひとこと

リンク先が貼れるようになってホームページ感が増した。

5/30 テーブル

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

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

• 挿入＞テーブル
• 行・列・幅を最初に指定
• セルのサイズは内容に応じて自動で伸縮される

テーブルの用語

五月のカレンダー