5月の授業日記

5/11　リンク

トップページの特別な名前(index.htm)

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

• ファイル一覧リストが表示されクリックすると開ける
• ここにindex.htmという書類を置くとそのページが替わりに表示される
• ファイル一覧が見えないので自分で見せたいページにリンクを張る

リンク

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

自分のページでのリンク

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

DWでのリンクの指定方法

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

保存場所やファイル名の変更

• リンクしたいファイルまでの経路（パス）が記述されている＝ファイル名や保存場所を変えるとその記述を変えなければならない
• DWのファイルパネル内で変更すれば自動で記述を変更してくれる

画像のリンク

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

きょうのひとこと

次回はインターネットを介したリンクなどリンクのバリエーションをやります。

5/18　リンク2

相対パス

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

• ＜4.htmからのコピー＝同じフォルダ内は経路は同じ
• ＜homeからのコピー＝ファイルが保存されている場所（フォルダ）が違うと、リンクしたいファイルへの経路も異なるのでコピペできない
• 保存場所やファイル名を変えるとこの経路も書き換える必要があるがDWのファイルパネルで変更しアラートで更新を押すと書き換えてくれる

インターネット上のサイトへのリンク

• クラス一覧

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

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

絶対パス(URL)

• http://ochagaku.sakura.ne.jp/2015/web/00/diary/5.htm

アクセス方法://サーバー名/フォルダ階層/ファイル名をすべて記述したもの

ページ内リンク

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

• 5/11
• 5/18

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

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

メールリンク

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

お問い合わせは

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

イメージマップ

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

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

きょうのひとこと

次回からページレイアウトで段組みなどにも使われるテーブルをやります

5/25　テーブル

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

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

テーブルの用語

5月のカレンダー

△このページのトップへ