平成10年6月17日

平 成 22 年 3 月 15 日 Share Point Designer 2007 操 作 ガイド ホームページ 作 成 編 集 機 能 編 製 作 : 山 本 嘉 一 郎 目 次 1 SharePointDesigner の 起 動 と 終 了 1 2 ホームページとその 提 供 2 3 ホームページ 新 規 作 成 の 準 備 3 4 簡 単 なページの 作 成 4 5 テキストの 編 集 6 6 タイトルと 背 景 9 6.1 タイトル 9 6.2 背 景 9 7 画 像 の 挿 入 10 7.1 画 像 の 準 備 10 7.2 画 像 の 挿 入 法 10 7.3 挿 入 された 画 像 の 編 集 11 7.4 クリップアートなどの 挿 入 12 8 ハイパーリンク 12 8.1 ハイパーリンクの 設 定 の 基 本 手 順 12 8.2 ハイパーリンクの 操 作 13 8.3 同 一 ページ 内 のリンク(ブックマークの 利 用 ) 14 9 表 組 15 10 画 像 マップとホットスポット 16 10.1 画 像 マップの 準 備 16 10.2 画 像 へのホットスポットの 設 定 16 10.3 ホットスポットの 削 除 と 修 正 17 11 フォーム 17 11.1 フォーム 要 素 とその 挿 入 17 11.2 フォームデータの 送 信 とその 処 理 20 12 フレーム 21 12.1 フレームの 準 備 21 12.2 初 期 ページの 編 集 21 12.3 その 他 のページの 作 成 21 12.4 リンクの 設 定 22 12.5 フレームページとフレームの 変 更 23

平 成 22 年 3 月 15 日 SharePointDesigner 2007 操 作 ガイド ホームページ 作 成 編 集 機 能 編 製 作 : 山 本 嘉 一 郎 この 操 作 ガイドは,SharePointDesigner 2007( 以 下,SharePointDesigner と 呼 びます)のホームページ 作 成 編 集 機 能 について,その 操 作 法 を 解 説 するものです.SharePointDesigner にはこのほか,ホームページの 管 理 機 能 があ りますが,ここでは 触 れません.またこのガイドでは,ホームページ 作 成 における 基 本 機 能 を 中 心 に 解 説 します. 1 SharePointDesigner の 起 動 と 終 了 起 動 ほかのソフトと 同 様,タスクバー 上 の スタートメニュー プログラム あるいは,デスクトップ 上 のショ ートカットアイコンから Microsoft Office SharePoint Designer 2007 を 選 択 して 起 動 します. SharePointDesigner を 起 動 すると, 図 1のような 画 面 が 表 示 されます.このように 起 動 直 後 は, 標 準 のページを 作 成 する 状 態 になります. ここで 標 準 のページを 新 たに 作 成 するのであれば,このまま 画 面 上 で 作 成 をはじめればよいわけですが, 後 述 の ようにテンプレートを 使 用 したりフレームを 使 用 したページを 作 成 するときは, 新 規 作 成 の 操 作 が 必 要 にな ります. 図 1 SharePoint Designer 2007 の 起 動 時 画 面 Microsofot, FrontPage, FrontPage 2002, SharePoint Designer 2007, ImageComposer, InternetExplorer は Microsoft Corporation の 登 録 商 標 または 商 標 です. 1

終 了 SharePointDesigner の 終 了 は,[ファイル]メニューの[ 終 了 ]あるいはウィンドウの 右 肩 にある[ ]ボタンに よってできます.ホームページの 作 成 や 編 集 をおこなったあとに 終 了 しようとすると,そのページを 保 存 するかど うかの 確 認 が 求 められることがあります.これは 作 成 編 集 したページがまだ 保 存 されていないためです. 保 存 の 要 否 を 判 断 して 答 えてください. 保 存 の 方 法 は,ワープロなどの 文 書 の 保 存 と 同 様 です. 2 ホームページとその 提 供 ホームページは 図 2 のように,インターネットに 接 続 された Web(あるいは WWW)サーバと 呼 ばれるコンピュ ータから 行 われます.これを 閲 覧 するには,インターネットに 自 分 のコンピュータ(パソコンなど)を 接 続 し, Web サーバにアクセスして 閲 覧 を 要 求 するということになります.したがって, 自 分 のコンピュータ 上 でホームペ ージを 作 っただけでは,インターネットや LAN を 通 してほかの 人 に 見 てもらうということはできません. そこで, 作 成 したホームページを 提 供 するときは,Web サーバとして 働 いているコンピュータに 必 要 なファイル (ホームページを 構 成 するファイル)を 送 って,そこに 載 せる 必 要 があります.これをサーバへのアップロードと いいます.こうしてはじめて,ネットワークを 通 して 見 てもらうことが 可 能 になります. 自 分 のコンピュータを Web サーバにすることもできますが, 通 常 はインターネットから 直 接 アクセスするようにはしないので,Web サー バ 用 に 特 別 に 用 意 されたコンピュータを 利 用 することになります.Web サーバは,あなたが 所 属 する 機 関 ( 学 校 な ど)やインターネット 接 続 業 者 (プロバイダー)のところにあり, 利 用 することができます. ブラウザ 閲 覧 Web サーバ アップロード Internet ホームページ 作 成 図 2 ホームページの 作 成 と 提 供 2

3 ホームページ 新 規 作 成 の 準 備 SharePointDesigner の 起 動 時 には 通 常, 標 準 的 なページの 新 規 作 成 状 態 となり,すぐに 新 しいページの 作 成 を 始 めることができるので, 特 に 準 備 は 必 要 ありません.ただ,すでに 作 成 中 のページがあって, 新 たにホームページ を 作 成 するとき,あるいは 予 め 用 意 されている 様 式 (テンプレート)を 利 用 したいときやフレームを 使 用 したペー ジを 作 成 するときは, 次 の 手 順 でその 準 備 をします. まず,[ファイル]メニューの[ 新 規 作 成 ] [ページ]を 選 択 します.すると, 図 3のような ダイアログボックスの[ページ]タブが 表 示 され 用 意 されたテンプレートから 作 成 したいページ を 選 択 します ここでは 標 準 の HTML ページ が 選 択 されたものとして 話 を 進 めます. 標 準 HTML ページ が 選 ばれたときの 画 面 は 図 4 の 通 りです. メニューとツールバー 画 面 上 には,ページを 作 成 する 領 域 を 中 央 に, 最 上 段 にメニューが,その 下 によく 使 用 されるボ タンを 配 置 したツールバーが, 作 成 領 域 の 左 上 に は 画 像 編 集 用 のツールバーが 表 示 されています.こ 図 3 新 規 作 成 時 のテンプレート 選 択 のダイアログボックス れらのメニューやボタンには,ページ 作 成 領 域 上 で ページを 作 成 するときに 必 要 な 機 能 が 割 り 当 てられています.どのメニューあるいはボタンを 使 うと 何 ができるか を 理 解 することによって,ホームページを 自 由 に 作 成 できるようになります.なお,これらのツールバーはユーザ の 設 定 により 表 示 させたり 閉 じたりすることができます.また, 図 4 にある 以 外 にもいくつかのツールバーがあり ます.その 表 示 / 非 表 示 の 選 択 は[ 表 示 ]メニューでおこないます. メニュー ツールバー 作 成 編 集 領 域 図 4 SharePointDesigner の 作 成 編 集 画 面 3

ページビューの 3 種 類 の 画 面 ページ 作 成 領 域 の 左 下 を 見 て 下 さい.3 つのタブ( 付 箋 )が 見 られます. デザイン, 分 割, コード の 3 つです.このようにページ 作 成 領 域 の 表 示 には 通 常,3 種 類 があり,これらを 切 り 換 えて 見 ることができます. 次 に,それぞれの 表 示 画 面 について 説 明 をします. (1) デザイン 画 面 ページの 作 成 をするときの 標 準 的 な 表 示 画 面 です.できあがり(ブラウザで 見 たときの 表 示 )に 近 い 形 で 表 示 さ れ,その 上 で 作 成 編 集 をワープロ 感 覚 でおこなうことができます. 通 常,この 画 面 上 で 作 成 編 集 をおこないま す. 他 のブラウザでプレビューする 場 合 は,[ファイル]メニューの[ブラウザでプレビュー]を 使 用 することが できます. (2) 分 割 画 面 コード 画 面 とデザイン 画 面 が 両 方 表 示 されます. (3) コード 画 面 ホームページは HTML と 呼 ばれる 言 語 を 使 って 書 かれます.ページのどこに 何 をどのように 表 示 するかなど, ホームページについてのすべての 指 示 は,HTML と 呼 ばれる 記 述 法 ( 書 き 方 )に 従 っておこなわれます.ただ, SharePointDesigner でホームページを 作 成 する 場 合, 作 成 者 は HTML を 意 識 することなく, デザイン 画 面 上 でワ ープロ 感 覚 でページを 作 成 することができます.SharePointDesigner はそのとき, 自 動 的 に HTML を 作 成 してい ます.HTML の 画 面 には, デザイン の 画 面 で 作 成 したページが HTML を 使 ってどのように 表 されているかを 見 ることができます.これを 直 接, 編 集 することによってページの 作 成 編 集 を 進 めることもできます.ほとんどの ことは デザイン 画 面 でできますが, 微 妙 な 調 整 や 高 度 な 機 能 の 組 み 込 みでは,HTML を 直 接 編 集 する 必 要 が 生 じる 場 合 があります.また, 繰 り 返 し 同 様 の 記 述 をしたり, 同 じ 変 更 を 複 数 の 個 所 に 対 しておこなうときなどは, HTML 画 面 でおこなう 方 が 能 率 的 なときがあります. 4 簡 単 なページの 作 成 ではここで,SharePointDesigner を 使 って 簡 単 なホームページを 作 ってみましょう. 標 準 の 画 面 で, 次 の 文 字 を 図 5 のように 入 力 してください.なお, 改 行 は 各 段 落 の 最 後 でのみおこなってください.ウィンドウの 大 きさによ って 文 章 途 中 の 改 行 位 置 は 変 わりますが,ワープロのときと 同 様 に, 改 行 しないで 入 力 を 続 けてください. ようこそ 葛 野 家 のホームページへ このたび 葛 野 家 では,インターネット 上 にホームページを 開 設 することになりましたホームページの 作 成 ははじめたばかりで,まだまだ 勉 強 することがたくさんあります.まずはシンプルなスタイルで, 葛 野 家 のご 紹 介 をしたいと 思 います. 葛 野 家 の 紹 介 父 光 男 46 歳, 会 社 員. 電 気 関 係 のメーカーに 勤 務 しています. 趣 味 はカラオケと 休 日 のごろ 寝. 最 近, 妻 の 華 子 の 影 響 で,インターネットへの 興 味 を 示 しています. 母 華 子 42 歳, 専 業 主 婦. 趣 味 はお 菓 子 作 りやテニス. 最 近, 知 的 魅 力 に 誘 われてパソコンを 始 め,ついにホー ムページの 作 成 に 挑 戦. 長 男 光 一 郎 18 歳, 花 (?)の 高 校 3 年 生. 受 験 地 獄 の 真 っ 最 中. 長 女 華 恵 13 歳, 中 学 1 年 生. 母 の 作 るお 菓 子 の 食 べすぎで 少 し 太 りぎみ.それがちょっぴり 気 になる 13 歳 です. 4

このようなページは, 文 字 だけを 入 力 し,まったく 編 集 を 施 さない 最 も 単 純 なページです.これを 保 存 して, 実 際 にどのように 表 示 されるかを,ブラウザで 見 てみることにします. 図 5 文 字 だけのホームページ 作 成 編 集 したページの 保 存 まず[ファイル]メニューの[ 名 前 を 付 けて 保 存 ]を 選 びます. 表 示 されるダイアログボックスで, 保 存 先 (ド ライブとフォルダ)を 指 定 し,さらに 保 存 時 のファイル 名 を 入 力 して[ 保 存 ]ボタンを 押 します.ここではファイ ル 名 として, kadono0 という 名 前 を 付 けて 保 存 することにします. 保 存 されるファイルには, 拡 張 子 として htm が 付 き, 実 際 には kadono0.htm というファイル 名 で 保 存 されます. ここで ブラウザ 上 で 閲 覧 した 際 にタイトルバーに 表 示 される,ページタイトルを 変 更 したい 場 合 は,[ページ タイトル]の 右 にある[タイトルの 変 更 ]をクリックします. 図 6 のような[ページタイトルの 設 定 ]ダイアログボッ クスが 表 示 されますので, 変 更 したいタイトルを 入 力 し 変 更 を 行 ってください. 図 6 ページ 保 存 とページタイトルの 設 定 画 面 5

ブラウザでの 閲 覧 まずブラウザを 起 動 します.ブラウザは 通 常,WWW サーバにアクセスして,そこでサービスされているホーム ページを 閲 覧 するものですが, 自 分 のコンピュータ 上 に 保 存 されている(フロッピーを 含 む)ファイルを 表 示 させ ることもできます.ファイルを 表 示 するにはまず,ブラウザの[ファイル]メニューの[ 開 く]または[ファイル を 開 く]を 選 びます.ブラウザやそのバージョンによっては(Internet Explorer の 各 バージョンなど),[ファイルを 開 く]というメニューはなく,その 場 合 はインターネット 上 のホームページと 同 様,[ 開 く]や ページを 開 く を 使 用 します.これらを 選 択 すると,ファイルの 所 在 を 入 力 するダイアログボックスが 表 示 されます. 通 常 は,[フ ァイルを 選 択 ]といったボタンがあり,(Internet Explorer では[ 参 照 ]),これを 押 して 目 的 のファイルを 探 します. 図 7 は Internet Explore を 使 って, 先 に 保 存 したファイル(kadono0.htm)を 表 示 したものです. 図 7 kadono0.htm をブラウザで 表 示 させたところ 5 テキストの 編 集 ここで,テキスト 部 分 についてのいくつかの 主 要 な 編 集 法 を 紹 介 します.これらの 編 集 を 加 えることにより,テ キスト 部 分 を 見 やすくしたり 表 現 力 を 高 めたりすることができます. 見 出 し 見 出 し は 通 常,それだけを 単 独 の 行 に 表 示 し, 本 文 よりも 目 立 つように 表 示 させます. 見 出 し に 指 定 す ると, 文 字 を 大 きく 太 く 表 示 させることができます. 見 出 し の 大 きさは 6 段 階 が 用 意 されています. ある 行 を 見 出 し にするにはまず,その 行 を 選 択 します(その 行 をクリックします).そこで, 上 部 のツール バーの 2 段 目 ( 図 4 参 照 )の 左 端 にあって 通 常 なし と 表 示 されたボックスを 開 き,その 中 から 目 的 の 見 出 し を 選 択 します.この 操 作 は,[ 書 式 ]メニューの[ 段 落 ]でもおこなうことができます. 図 8 の ようこそ 葛 野 家 のホームページへ の 部 分 は,このようにして 見 出 し 1 に 設 定 したものです. フォントの 変 更 文 字 の 書 体, 大 きさ, 色 を 変 更 することができます.ただフォントの 変 更 は, 使 用 するブラウザによっては 期 待 通 りに 表 示 されないことがあります. 大 きさを 変 えるには,ツールバー 上 の 通 常 ( 既 定 のサイズ) と 表 示 されているボックスで 目 的 の 大 きさを 選 択 します.8 ポイントから 36 ポイントまで 選 択 できます. 書 体 を 変 えるには,ツールバー 上 の 通 常 ( 既 定 の フ 6

ォント) と 表 示 さ れ て い る ボ ッ ク ス で 目 的 の フ ォ ン ト を 選 び ま す. さ ら に 文 字 の 色 を 変 え る には, の 右 にある のボタンを 押 して 目 的 の 色 を 選 択 します.ボタン 上 の 文 字 A を 押 すと,その 下 に 表 示 されている 色 が 適 用 されます. 図 7 ではこれらの 機 能 により, 葛 野 家 のご 紹 介 の 部 分 で, 文 字 のサイズを 18 ポイントにしています. 見 出 し の 場 合 と 違 って, 太 字 にはなりません.また, 行 の 一 部 の 文 字 だけを 大 きくすることもできます. 文 字 飾 り 文 字 は, 太 字, 斜 体,アンダーライン 付 けなどの 修 飾 をすることができます.これをおこなうには, 対 象 の 文 字 または 文 字 列 を 選 択 し,ツールバー 上 の ボタンのいずれかを 押 します. 図 8 では, 葛 野 家 のご 紹 介 の 部 分 にアンダーラインを 引 いています. 改 行 改 行 には 2 通 りあります. 図 7 の 例 ではすべて, 行 間 を 空 けるようにした 改 行 を 使 用 しています. 入 力 確 定 後 に Enter キーで 改 行 をおこなうと, 自 動 的 に 段 落 として 認 識 され, 次 の 段 落 との 間 に 適 度 な 行 間 が 空 けられます.こ の 例 では,このように 行 間 が 空 いている 方 が 見 やすくて 良 いでしょう.これに 対 して, 行 間 を 空 けずに 密 着 改 行 に することもできます. 密 着 改 行 をするには, 入 力 時 に 改 行 する 際,SHIFT キーを 押 しながら 改 行 をおこないます. また, 既 に 入 力 したものを 変 更 するときは,BS キーなどで 一 度, 改 行 を 取 り 消 してから 同 様 に 操 作 します. 水 平 線 図 8 のようにページの 任 意 の 箇 所 に 水 平 線 を 挿 入 することができます. 水 平 線 を 挿 入 するには, 挿 入 したい 箇 所 にカーソルを 置 いて, 右 上 の[ツールボックス]から[ 水 平 線 ]を 選 びダブルクリックします. 図 8 では,ページの 冒 頭 の 挨 拶 文 の 上 下 に 水 平 線 を 挿 入 しています. 挿 入 した 水 平 線 は,これを 選 択 (クリック)した 後, 右 クリックで, [ 編 集 ]メニューの[ 水 平 線 のプロパティ]を 使 って, 長 さや 太 さを 変 更 することができます. 図 8 様 々なテキスト 編 集 を 加 えたページの 例 7

リスト 表 示 リスト 表 示 とは 箇 条 書 きのことです. 次 の 2 通 りがあります. 記 号 付 きリスト 番 号 付 きリスト 用 語 リスト (1) 記 号 付 きリスト 図 9の 記 号 付 きリスト のように, などの 記 号 を 各 行 の 前 に 付 けて 箇 条 書 き にします.この 設 定 をするには, ボタ ンを 押 してからその 行 を 入 力 します.2 行 目 以 降 はそのまま 続 けて 入 力 し, 何 も 入 力 しないで Enter キーを 押 すと,そこでリ ストは 終 わります.また, 既 に 入 力 され た 行 を 記 号 付 きリストにするときは,そ の 行 にカーソルを 置 いて ボタンを 押 すと,その 行 が 記 号 付 きリストになりま す. 図 9 リスト 表 示 の 例 (2) 番 号 付 きリスト 図 9 の 番 号 付 きリスト のように, 各 行 の 前 に 番 号 を 付 けて 箇 条 書 きにします.この 設 定 をするには, ボ タンを 押 してからその 行 を 入 力 します.2 行 目 以 降 はそのまま 続 けて 入 力 し, 何 も 入 力 しないでリターンキーを 押 すと,そこでリストは 終 わります.また, 既 に 入 力 された 行 を 番 号 付 きリストにするときは,その 行 にカーソルを 置 いて ボタンを 押 すと,その 行 が 番 号 付 きリストになります. インデント インデントとは 字 下 げのことです. 字 下 げをしたい 部 分 ( 複 数 行 でも 可 能 )を 選 択 して,ツールバーの ボタ ンを 押 します.これを 解 除 するときは ボタンを 押 します. 前 出 の 図 8 の 家 族 の 紹 介 のところではこれを 利 用 して, 字 下 げがしてあります. 中 央 配 置 と 右 詰 め 配 置 文 字 列 の 配 置 は 通 常,ワープロなどと 同 様 に 左 詰 めです.これを 中 央 に 配 置 したり 右 詰 めで 配 置 したりすること ができます.これをおこなうには,ツールバー 上 の や ボタンを 使 用 します. 再 度 同 じボタンを 押 すと, 標 準 の 左 詰 め 配 置 に 戻 すことができます. 後 出 の 図 12 では, ようこそ 葛 野 家 のホームページへ を 中 央 配 置 に, By Hanae Kadono を 右 詰 め 配 置 にしています. 行 間 の 調 整 など SharePointDesigner では, 行 間 を 調 整 することができます. 標 準 では 図 10 のように, 日 本 語 はほとんど 行 間 のな い 状 態 で 表 示 されます.これを 広 げることができます. 行 間 の 調 整 は 段 落,つまり 改 行 ( SHIFT+ 改 行 を 除 く)と 改 行 の 間 にはさまれたブロックごとに 適 用 されます. 行 間 を 調 整 するには, 調 整 する 範 囲 を 反 転 して 選 択 した 後, 書 式 メニューの 段 落 を 選 択 します. 表 示 さ れるダイアログボックスで, 行 間 から 適 当 な 行 間 を 選 択 します. 選 択 できるのは1,1.5,2 行 で,これらと 異 なる 行 間 のときは, 数 字 部 分 をキーボードから 変 更 します.たとえば 130% といった 形 で 指 定 ができます.こ の 機 能 ではあわせて,インデント, 段 落 の 前 後 のスペース, 文 字 間 の 調 整 をおこなうこともできます. 8

図 10 行 間 調 整 6 タイトルと 背 景 6.1 タイトル タイトルとはページの 表 題 で,ブラウザ で 表 示 されたとき 通 常,ブラウザ 上 端 のタ イ ト ル バ ー の 位 置 に 表 示 さ れ ま す. SharePointDesigner では, 作 成 するページで 最 初 に 入 力 した 1 行 の 文 字 列 がタイトルと して 設 定 されます.ただし,1 度 これを 保 存 した 後 でこの 行 を 修 正 してもタイトル は 変 わりません. タイトルを 変 更 するには,[ファイル] メニューの[ページのプロパティ]を 選 択 します. 表 示 される ページのプロパティ ダイアログボックスの 全 般 タブを 選 択 するとタイトルの 入 力 箇 所 があります.こ こでタイトルの 入 力 修 正 をおこないます. また ページのプロパティ ダイアログボ ックスは,[ 書 式 ]メニューの[ 背 景 ]で も 表 示 させることができます. 図 11 ページのプロパティ の 背 景 タブ 6.2 背 景 背 景 としては, 背 景 色 の 設 定 と 画 像 を 並 べ る 形 の 背 景 の 設 定 ができます.いずれもタイ トルと 同 様, ページのプロパティ でおこないます. 上 記 のいずれかの 方 法 で ページのプロパティ を 表 示 し, 図 11 のように 背 景 タブを 選 択 します. 背 景 色 を 変 更 するにはここで, 背 景 と 色 を 指 定 する を 選 び(このタ ブを 選 択 したときに,たいていはこちらが 選 択 されている), 背 景 の 中 で 目 的 の 色 を 選 択 します. 9

背 景 に 画 像 を 配 置 するときは, 同 じく 背 景 タブの 中 で 図 11 のように 背 景 の 画 像 をチェックし, 背 景 と して 使 用 する 画 像 を 選 択 します. 図 11 では, 背 景 の 画 像 に asian.gif を 選 んでいます.その 結 果 をブラウザで 表 示 したものが 図 12 のページです. 背 景 に 画 像 が 使 われます. 7 画 像 の 挿 入 別 途 用 意 された 写 真 や 絵 などの 画 像 ファイルをページに 挿 入 することができます.また Share PointDesigner には 様 々なクリップアートも 用 意 されており,これを 挿 入 することもできます. 挿 入 できる 画 像 ファイルの 形 式 として は,JPEG または GIF を 主 に 使 用 します.さらに 最 近 では,PNG 形 式 も 用 いられます.PNG 形 式 は Web 用 に 最 適 化 された 形 式 で, 今 後 は 主 に PNG 形 式 が 使 用 されることが 考 えられます. 7.1 画 像 の 準 備 図 12 背 景 に 画 像 を 使 用 したページの 例 デジタル 化 されていない 画 像 まだコンピュータ 用 のファイルとして 用 意 されていない 画 像 については,まずその 準 備 が 必 要 です. 通 常 はスキ ャナによりこれを 読 み 込 んで 画 像 ファイルとして 保 存 します. 保 存 する 際 に GIF,JPEG または PNG 形 式 で 保 存 し ます. 単 にその 画 像 を 表 示 させるだけのときは JPEG がよいでしょう. 背 景 を 透 明 化 したり 画 像 上 でクリックする ポイントを 設 定 するような 場 合 には GIF がよいでしょう.PNG はいずれの 場 合 も 使 用 できます. 保 存 するときの ファイル 容 量 は 大 きくなりますが,BMP や DIB といった 非 圧 縮 形 式 で 保 存 をしておいて, 必 要 に 応 じて 形 式 を 変 更 する 方 法 もあります.また,JPEG や GIF 間 での 形 式 変 換 も 可 能 です. デジタル 化 された 画 像 上 記 のような 目 的 に 応 じて, 必 要 であれば JPEG,GIF,あるいは PNG 形 式 に 変 換 します. 7.2 画 像 の 挿 入 法 用 意 された 画 像 をページに 挿 入 するには 次 のようにしま す. まず, 画 像 を 挿 入 したい 所 を 選 択 し, 右 上 ツールバーの をダブルクリックします. 次 に, 図 13 のように を 右 クリ ックし,[ 画 像 のプロパティ]を 選 びます.すると 図 14 のよう な[ 画 像 のプロパティ]ダイアログボックスが 表 示 されます. 10 図 13 画 像 のプロパティ

参 照 から 目 的 のファイルを 指 定 して[OK]ボタンをクリッ クします.([ 挿 入 ]メニューの[ 図 ] [ファイルから]でも 同 様 の 画 面 が 出 ます) 図 14 では, Welcome.gif という ファイル 名 の GIF ファイルを 選 んでいます.こうすると 図 15 のように,ページの 中 にこの 画 像 ファイルが 挿 入 さ れます. 図 14 挿 入 する 画 像 の 選 択 注 意 ) 新 規 作 成 し 未 保 存 の 状 態 にあるページに 画 像 を 挿 入 すると, ファイル 名 の 前 に,そのファイルの 所 在 位 置 (パス)を 示 す 記 述 がが 自 動 的 に 挿 入 されることがあります.これは,サーバにアップロードしたときに, 画 像 が 表 示 さないなどの 問 題 を 起 こす 原 因 になります.これを 避 けるには, 画 像 を 挿 入 するより 前 にそのページを 保 存 するようにします. 画 像 を 挿 入 したときは,これを 必 ず 確 認 するようにしましょう. 7.3 挿 入 された 画 像 の 編 集 画 像 のサイズ 変 更 画 像 のサイズを 変 更 するには,マウスによるドラックで, 簡 単 に 変 更 することができます. この 方 法 による 画 像 の 編 集 は 表 示 上 のものです. 画 像 ファイルそのものは 変 更 されないので, 縮 小 してもファイ ルサイズは 小 さくなりませんし, 拡 大 すると 画 像 が 不 鮮 明 になります. 最 適 なファイルサイズで 鮮 明 な 画 像 ファイ ルを 挿 入 するには, 挿 入 前 に 専 用 の 画 像 処 理 ソフトで 編 集 するのがよいでしょう. 画 像 プロパティの 変 更 ( 画 像 枠, 表 示 位 置, 余 白 ) 対 象 の 画 像 を 選 択 して, 右 クリックをし,[ 画 像 のプロパティ]を 選 択 すると, 画 像 のプロパティ ダイアロ 図 15 画 像 を 挿 入 したページ グボックスが 表 示 されます.ここで 外 観 タブにより, 画 像 の 周 りの 枠, 画 像 の 表 示 位 置, 画 像 と 周 りのテキス トとの 間 隔 を 指 定 することができます. とくに, 画 像 にハイパーリンク(8.2 参 照 )を 設 定 した 場 合, 周 りに 枠 線 が 引 かれることがあります.これを 取 11

り 除 くにはここで, 外 枠 の 太 さを 0 に 設 定 します. 画 像 表 示 位 置 標 準 では, 挿 入 された 画 像 はページの 中 央 に 表 示 されます. 位 置 は 先 ほどのサイズ 同 様,マウスによるドラック で, 簡 単 に 変 更 することができます.また 画 像 を 右 寄 せ 左 寄 せなどにしたい 場 合 は, や ボタンを 使 用 しま す.これを 元 に 戻 すときは, 同 じボタンをもう 1 度 押 します. も 同 じ 左 寄 せの 意 味 ですが, 画 像 などを 左 寄 せ して,その 横 ( 右 )に 複 数 の 文 字 行 が 表 示 されるようにするという 特 殊 な 意 味 を 持 ちます. 画 像 の 横 への 複 数 行 のテキスト 表 示 画 像 の 右 や 左 に 複 数 行 のテキストを 表 示 するには,その 画 像 を 選 んで, または ボタンで 左 詰 めまたは 右 詰 めを 指 定 します.これにより, 画 像 の 横 に 複 数 の 行 を 表 示 させることができます. 図 の 解 説 文 を 加 えたり, 文 書 の 途 中 に 体 裁 良 く 図 を 挿 入 したりするのに 便 利 でしょう. 7.4 クリップアートなどの 挿 入 SharePointDesigner にはホームページ 上 で 利 用 できるさまざまなクリップアー ト( 画 像 集 )が 準 備 されています. 簡 単 な 操 作 でページ 内 に 挿 入 することができ ます. クリップアートを 挿 入 するにはまず,[ 挿 入 ]メニューの[ 図 ] [クリップアー ト]を 選 択 します.すると, 図 16 のような Microsoft Clip Gallery のダイアログ ボックスが 表 示 されています.ここから 目 的 の 画 像 を 選 択 すると,[アクセシビリ ティのプロパティ]ウィ ンドウが 表 示 されます. ここでは, 画 像 ファイル 図 17 アクセシビリティ 図 16 クリップアート 挿 入 をマウスポイントした 時 に 表 示 される 画 像 の 名 前 を 設 定 します. 任 意 の 名 称 を 入 力 し,[OK]をクリックします.( 図 17 では 画 像 ファイル_01 と 設 定 ) Microsoft Clip Gallery にはクリップアートのほか, 写 真,サウンド,およ びビデオが 用 意 されており,これらもクリップアート 同 様 に 挿 入 することができます. 8 ハイパーリンク ハイパーリンクとは,Web ページ 最 大 の 特 徴 の 1 つです.クリックすることによって, 次 々と 目 的 のページを 開 いていくことができます.このような 文 章 をハイパーテキストと 呼 びます.ホームページでは, 他 の Web サイト のホームページへのリンクを 設 定 することにより, 巨 大 なハイパーテキストが 構 成 されます.ここでは,その 仕 組 みと 作 り 方 (リンクの 設 定 法 )について 説 明 します. 8.1 ハイパーリンク 設 定 の 基 本 手 順 ここで 葛 野 家 のホームページ を 図 18a のように 変 更 し,ここには 各 家 族 の 名 前 だけを 表 示 し, 各 家 族 のペー ジは 別 途 用 意 することにしましょう.そしてこのページに 図 18b のような 各 家 族 のページをリンクし, 図 18a の 中 で 各 家 族 の 名 前 をクリックするとその 家 族 のページが 開 くようにします.これには, 図 18a の 家 族 名 をその 家 族 の ページにリンクします.その 手 順 は 次 のとおりです.ここで 図 18a は リンク 元, 図 18b の 方 は リンク 先 の ページと 呼 びます. まず,リンク 先 とリンク 元 のページを 用 意 します.ここで,リンク 元 のページを SharePointDesigner 上 に 開 いて 12

おくことはもちろんですが,リンク 先 のページも 開 いておくと 便 利 です. 次 にリンク 元 のページ 上 でリンクしよう とする 文 字 列 ( 図 18a 上 の 父 光 男 )を 選 択 します(ドラッグして 反 転 表 示 させる).そこで, 右 クリック[ハ イパーリンク]を 選 択 すると(あるいは[ 挿 入 ]メニューの[ハイパーリンク]を 選 択 すると), 図 19 のダイアロ グボックスが 表 示 されます.ここで, URL の 欄 にリンク 先 のページを 入 力 します.この 例 では,ファイル 名 mitsuo.htm を 選 びます. 最 後 に[OK]ボタンを 押 すと,リンクが 完 成 します. 注 意 )リンク 元 のファイルを 保 存 しないでこの 作 業 をしようとすると, 図 19 ダイアログボックスにリンク 先 のペ ージが 表 示 されません.リンクを 行 う 前 にリンク 元 のファイルは1 度, 保 存 をするようにしましょう. リンク 図 18 a)リンク 元 のページ( 左 側 ) と 18b)リンク 先 のページ( 右 側 ) リンク 先 のファイルがリンク 元 と 異 なるフォルダにあるときは, 図 19 の 検 索 場 所 を 利 用 してリンク 先 のフ ァイルがあるフォルダを 探 して,リンク 先 のファイルを 指 定 します. 図 19 のダイアログボックスには ファイルのリンク のボタンがありますが,これを 使 用 するとリンク 先 の 表 現 が 不 適 切 となり, 作 成 したホームページをサーバーにアップロードしたときに,リンク 先 のページが 見 つから ないといったエラーが 発 生 することがあります. 図 19 ハイパーリンク 作 成 のダイアログボクス 13

ハイパーリンク 先 の 確 認 ハイパーリンク 先 の 設 定 は, 以 上 のように 大 変 微 妙 です. 次 の ハイパーリンクの 修 正 を 利 用 して 確 認 すると よいでしょう. ハイパーリンクの 修 正 ハイパーリンクの 設 定 を 解 除 したり 変 更 したりするには, 設 定 のときと 同 様 にしておこないます. 右 クリック ハ イパーリンクノプロパティ を 選 択 します. 図 19 のダイアログボックスが 表 示 されるので, 必 要 な 修 正 をおこな います. 設 定 を 解 除 するには, リンクの 解 除.ボタンを 押 せば 解 除 できます. 8.2 ハイパーリンクの 応 用 操 作 画 像 からのリンク リンクは 文 字 列 だけでなく 画 像 からもおこなうことができます. 方 法 はまったく 同 じで, 右 クリック[ハイパー リンク]を 選 択 します. Web サイトへのリンク リンク 先 には 他 の Web サイトを 選 ぶこともできます.この 場 合, 図 19 のダイアログボックスで 直 接,URL 欄 へ そのアドレスを 入 力 するか, ボタンを 押 してそのサイトを 探 します. 8.3 同 一 ページ 内 へのリンク(ブックマークの 利 用 ) リンクは 通 常, 他 のページとの 間 で 張 られるものですが, 同 一 ページ 内 でもこれを 利 用 することができます.こ れを 利 用 すると, 長 いページの 場 合, 容 易 に 目 的 の 箇 所 に 飛 ぶことができます.たとえば あいうえお 順 に 整 理 された 名 簿 のようなページでは,あ 行,い 行,...といった 具 合 に 分 類 し,その 先 頭 へ 飛 ぶような 仕 組 みを 作 って おくと 便 利 です. このように 同 一 ページ 内 に 飛 ぶようなリンクを 設 定 するには,リンク 先 ( 飛 び 先 )にブックマークと 呼 ばれるマ ークを 付 けておき,これとリンク 元 の 文 字 や 画 像 との 間 でリンクを 設 定 します.したがってまず, 飛 び 先 にブック マークを 設 定 することが 必 要 です. ブックマークを 設 定 するにはまず,これを 設 定 しようとする 箇 所 にカーソルを 置 きます. 次 に[ 編 集 ]メニュー の[ブックマークへ 移 動 ]を 選 択 し, 図 20 のダイアログボックスを 表 示 させます.ここにブックマーク 名 (こ こでは[chichi]と 入 力 しています)を 入 力 して[OK]ボタンを 押 せば 設 定 が 終 わります. 図 21 は 葛 野 家 のご 紹 介 の 父 の 所 にブックマーク chichi へのリンクを 張 ろうとしたものです.ブックマークをリンク 先 と してリンクの 設 定 をするにはまず,リンク 設 定 しようとする 文 字 列 あるいは 画 像 を 選 択 します. 次 に 右 ボタン ハイパーリンク を 押 して,ダ イアログボックスを 表 示 させます.ここでダイアログボックスの 右 側 に 並 んでいるボタンの 中 から, ブックマーク をクリックし ます. ドキュメント 内 の 場 所 の 指 定 が 表 示 されるので,リンク 図 20 ブックマークの 設 定 させたいブックマークを 選 び,[OK]をクリックすると, ハイパーリンク のダイアログボックスに 戻 ります.ア ドレス 欄 に chichi と 表 示 されていることを 確 認 し,[OK]をクリックすると, 設 定 ができあがります. 母 長 14

男 長 女 にも 同 様 の 設 定 をおこなうと, 葛 野 家 のご 紹 介 とそれぞれの 紹 介 箇 所 とがリンクされ,たとえば 長 女 をクリックすると, 長 女 の 紹 介 欄 へ 飛 ぶことができます. 9 表 組 図 21 ブックマークへのリンクの 設 定 ホームページには 図 22 のような 表 を 挿 入 することができます. 表 組 は HTML で 記 述 するにはやや 複 雑 ですが, SharePointDesigner ではこれも,ワープロとまったく 同 様 の 感 覚 で 作 成 することができます. 表 組 をおこなうにはまず, 表 を 挿 入 しようとする 位 置 にカーソルを 置 きます.ここで ボタンを 押 して, 表 の 行 と 列 のサイズを 設 定 します.これで 標 準 的 な 表 組 ができあがります.あとは, 表 のセルに 文 字 などを 挿 入 すれば 完 成 です.また 必 要 に 応 じて, 罫 線 のサイズやセルの 色 の 設 定 などをおこなうことができます.またセルには 文 字 だけでなく, 画 像 などを 入 れることもできます. 表 の 様 式 の 変 更 は 右 クリック[ 変 更 ]メニューでおこないます.セルの 結 合, 分 割, 列 幅 や 行 高 の 統 一 などの 設 定 変 更 をおこなうことができます.その 表 あるいはセルを 選 択 後,[ 変 更 ]メニューの 中 の 適 当 な 項 目 を 選 択 し て 必 要 な 操 作 をします. 表, 行, 列,あるいはセルの 選 択 は,このメニューの 中 でもおこなうことができます. 表 組 みを 利 用 したレイアウト ホームページ 上 での 文 書 や 画 像 のレイアウトは,ワープロのように 自 由 になりません.そこで 表 組 みを 利 用 する と,ある 程 度,レイアウトを 自 由 におこなうことができます.その 原 理 は, 表 のセルを 利 用 して 表 示 位 置 を 制 御 し ようというものです.セルの 結 合 を 利 用 すれば,かなり 自 由 に 表 示 位 置 を 設 定 することができます.また,セルの 背 景 色 を 設 定 することによって, 異 なる 色 の 背 景 をページ 上 に 配 置 することもできます. ページの 新 規 作 成 時 に 用 意 されているさまざまなレイアウトも,このような 表 組 みの 機 能 によるものです. 図 22 表 組 の 例 15

10 画 像 マップとホットスポット ホットスポットとは, 画 像 内 の 特 定 の 場 所 に 他 のページやブックマークとのリンクを 設 定 するもので. 画 像 内 の 特 定 の 箇 所 をクリックすると,そのページやブックマークに 移 動 するようにすることができます.たとえば, 地 図 上 にホットスポットを 設 定 すると,そのポイントにある 店 の 紹 介 のページが 表 示 されるといった 仕 組 みを 作 ることが できます.ホットスポットを 組 み 込 んだ 画 像 は, 画 像 マップ,イメージマップあるいはクリッカブルマップと 呼 ば れます. 10.1 画 像 マップの 準 備 画 像 マップを 作 成 するにはまず,ホットスポットを 設 定 しようとする 画 像 と,ホットスポットをリンクしようと するリンク 先 のページあるいはブックマークの 準 備 が 必 要 です. 画 像 はどのようなものでも 構 いません.またリン ク 先 は 他 の Web サイトとすることもできます.このように,リンク 元 が 画 像 の 中 に 設 定 された 特 定 の 箇 所 である という 点 を 除 けば, 通 常 のリンクと 同 じ 仕 組 みです. 10.2 画 像 へのホットスポットの 設 定 まずホットスポットを 設 定 しようとする 画 像 をクリックして 選 択 します. 画 像 を 選 択 すると, 画 面 下 の 画 像 ツー ルバーが 使 用 可 能 な 状 態 になります. 画 像 ツールバーが 表 示 されていないときは,[ 表 示 ]メニューの[ツールバ ー] [ 図 ]を 選 択 すれば 表 示 されます.ここでは 1 例 として, 図 23 の 日 本 地 図 に 円 形 のホットスポットを 設 定 する 手 順 を 説 明 しましょう. 円 形 のホットスポットを 設 定 するにはまず, 画 像 ツールバーの 円 を 選 択 します.その 上 でマウスを 画 像 上 に 移 動 すると,マウスカーソルが 鉛 筆 マークに 変 わります.その 鉛 筆 の 先 を 円 の 中 心 に 置 いてクリックします.その 後, マウスを 円 の 外 側 へ 向 かって 動 かすと,ホットスポットとして 設 定 される 円 が 大 きくなっていきます. 描 かれる 円 が 適 当 な 大 きさになったら,もう 一 度 クリックします.すると ハイパーリンクの 作 成 ダイアログボックスが 開 きます.ここで,リンク 先 のページやブックマークを 指 定 します.その 方 法 は 8.1 節 (ハイパーリンク 設 定 の 基 本 手 順 )と 同 じです. 以 上 で,ホットスポットの 設 定 ができあがります.これを 必 要 なだけ 繰 り 返 して 完 成 させます. ホットスポットの 形 状 は, 円 のほか, 矩 形 あるいは 多 角 形 を 使 用 することができます.また 文 字 列 をホットスポ ットとすることもできます(テキストのホットスポット). 多 角 形 を 使 用 することにより,ほとんどの 形 状 に 対 し て 設 定 が 可 能 です.これらも, 基 本 的 には 円 形 の 場 合 と 同 じで, 図 形 を 描 画 する 要 領 で 画 像 上 にホットスポットの 範 囲 を 指 定 し,そのリンク 先 を 指 定 します. 文 字 列 は 基 本 的 には 矩 形 のホットスポットと 同 じです. 文 字 列 を 入 れ るテキストボックスとしての 矩 形 がホットスポットとして 設 定 されると 考 えてください.ただし,テキストのホッ トスポットは GIF 形 式 の 画 像 に 限 られ, 他 の 形 式 の 画 像 に 設 定 しようとすると,その 画 像 は GIF 形 式 に 変 換 されま す. 図 23 ホットスポットを 設 定 した 画 像 マップとページ 16

注 意 )ホットスポットを 設 定 する 画 像 を 挿 入 するときは, 画 像 を 挿 入 するページをあらかじめ 保 存 しておきます. これは 通 常 の 画 像 の 挿 入 と 同 様 ですが,ホットスポットを 設 定 する 場 合 にはさらに,リンク 先 のページの URL にも 余 分 な 記 述 が 入 り,あとで 変 更 が 必 要 になります. ホットスポットが 正 常 に 動 作 しないときの 処 置 ホットスポットを 設 定 した 画 像 が 表 示 されないなど,ページが 正 常 に 動 作 しないとき,その 原 因 のほとんどは 上 記 の 注 意 にある 不 具 合 によるものです.つまり, 画 像 のソース( 保 存 場 所 とファイル 名 )やリンク 先 の 記 述 に 余 分 な 記 述 があります.これを 修 正 するには, 次 のようにします.まず, 画 像 を 選 択 して,[ 書 式 ]メニューから [プロパティ]を 選 択 し, 表 示 される 画 像 のプロパティ ダイアログボックスで, 画 像 のソース の 記 述 を 修 正 ( 余 分 な 記 述 を 消 去 )します. 次 に, 各 ホットスポットのリンク 先 を 修 正 します( 下 記 参 照 ). 10.3 ホットスポットの 削 除 と 修 正 削 除 設 定 したホットスポットを 削 除 するには,そのホットスポットをクリックして 選 択 した 後,キーボード 上 の DEL (Delete)キーを 押 します. 移 動 ホットスポットをクリックして 選 択 すると,マウスで 自 由 にドラッグして 移 動 することができます. サイズの 変 更 ホットスポットをクリックした 際 にその 角 に 表 示 されるハンドルをマウスでドラッグすることにより, 拡 大 縮 小 することができます. リンク 先 の 変 更 ホットスポットをダブルクリックすると, ハイパーリンクの 作 成 ダイアログボックス( 図 16)が 開 きます. ここで 変 更 することができます. 11 フォーム フォームは 閲 覧 者 によるデータ 入 力 と 送 信 を 可 能 にするものです.フォームには 図 24 のように, 文 字 を 入 力 さ せるテキストボックスやいくつかの 選 択 肢 から 選 択 させるドロップダウンメニュー,ラジオボタン,チェックボッ クスなどを 配 置 することができます.こられを 使 って 送 信 したい 情 報 を 入 力 させ,プッシュボタンを 押 して 送 信 で きるようにすることができます. 通 常, 送 信 と 同 時 に,これを 受 けて 処 理 をおこなうプログラムが 起 動 するように 設 定 しますが,その 設 定 はフォームのプロパティとして 行 います. このようにフォームを 使 用 すると,ページを 一 方 的 に 閲 覧 者 に 表 示 するだけでなく, 閲 覧 者 からの 情 報 の 収 集 や 閲 覧 者 の 要 求 に 応 じた 処 理 をおこなったりすることが 可 能 になります.たとえば,ページを 見 ての 感 想 の 受 取,ア ンケート 調 査, 各 種 申 込 みの 受 付,データベースの 検 索 などのサービスを 実 現 することができます. ここでは,ページへのフォームの 挿 入 について 説 明 することにします. 11.1 フォーム 要 素 とその 挿 入 フォームに 用 意 する 部 品 をフォーム 要 素 と 呼 びます.フォーム 要 素 には 次 のものがあります. テキストボックス 1 行 の 文 字 列 を 入 力 するボックスです. スクロールテキストボックス 複 数 行 の 文 字 列 を 入 力 するボックスです. ドロップダウンメニュー いくつかの 選 択 肢 をメニュー 状 に 表 示 し,そこから 値 を 選 択 できるようにします. 17

ラジオボタン いくつかの 選 択 肢 を 並 べ,その 前 に 円 形 のボタンを 用 意 し,これをチェックすることによって 1 つを 選 択 でき るようにします. チェックボックス その 項 目 を 選 択 するかどうかのチェックができるようにします. プッシュボタン フォームに 入 力 されたデータの 送 信 とプログラムの 実 行 を 指 示 します.また, 入 力 を 取 り 消 す 操 作 にも 利 用 し ます. テキストボックス ドロップダウンボックス オプションボタン チェックボタン スクロールテキストボックス プッシュボタン 図 24 フォームの 例 基 本 操 作 手 順 フォーム 要 素 の 挿 入 には, 右 側 の[ツールボックス]ウィンドウを 使 用 します.その 中 に, 上 記 のフォーム 要 素 が 用 意 されているので,そこから 必 要 なフォーム 要 素 を 選 択 します. フォーム 領 域 の 設 定 最 初 のフォーム 要 素 を 挿 入 すると, 図 25 のように,フォーム の 領 域 が 破 線 で 示 されます.その 後 に 挿 入 するフォーム 要 素 は, この 破 線 の 領 域 の 中 に 配 置 します.この 外 にフォーム 要 素 を 挿 入 すると, 新 たなフォーム 領 域 が 設 定 されます.このようにし て, 複 数 のフォーム 領 域 を 同 じページ 上 に 配 置 することもでき ます. この 領 域 のサイズは, 最 初 は 挿 入 したフィールドを 含 む 行 だ けのサイズで,プッシュボタンも 挿 入 したフィールドに 密 着 し て 表 示 されるので, 図 26 のように 適 当 に 改 行 コードを 入 れて 領 域 を 拡 大 し,プッシュボタンとの 間 を 空 けるようにしてお 図 25 テキストボックスとプッシュボタンの 挿 入 直 後 18

くと, 作 業 がしやすいでしょう. 図 26 フォーム 領 域 内 の 拡 大 とアレンジ テキストボックス 挿 入 したい 位 置 にカーソルを 置 いて,[ツールボックス]ウィンドウの[ 入 力 (テキスト)]を 選 択 しダブルクリッ クします. 基 本 的 な 設 定 を 変 更 するには, 挿 入 されたテキストボックスを 右 クリック[フォームフィールドのプロ パティ]をクリックし, 図 27 のダイアログボックスを 表 示 させます.ここでボックスの 名 前 やボックスに 入 る 文 字 数 の 設 定 を 変 更 することができます.ボックスのサイズ( 入 力 文 字 数 )は, 画 面 上 でマウスを 使 って 変 更 すること もできます. 図 27 テキストボックスのプロパティ プッシュボタン 挿 入 したい 位 置 にカーソルを 置 いて,[ツールバー]ウィンドウの[ 入 力 ( 送 信 )]または[ 入 力 (リセット)]を 選 び ダブルクリックします. 通 常 は 図 24 のようにデータを 送 ってプログラムを 実 行 させるボタン 送 信 と 入 力 を 取 り 消 すボタン リセット の 組 み 合 わせとなるでしょう.プッシュボタンの 設 定 については 次 節 で 説 明 します. スクロールテキストボックス 挿 入 したい 位 置 にカーソルを 置 いて,[ツールバー]ウィンドウの[テキスト 領 域 ]を 選 んでダブルクリックします. 設 定 の 変 更 はテキストボックスと 同 様 です. ドロップダウンメニュー 挿 入 したい 位 置 にカーソルを 置 いて,[ツールバー]ウィ ンドウの[ドロップダウンボックス]を 選 んでダブルクリ ックします.ドロップダウンメニューでは 選 択 肢 の 設 定 が 必 要 です.これを 設 定 するにはまず, 挿 入 したフィールド をダブルクリックして 図 26 のダイアログボックスを 表 示 さ せ,[ 追 加 ]ボタンを 押 して 選 択 肢 を 追 加 します. 図 28 ドロップダウン ボックスのプロパティ 19

ラジオボタン 挿 入 した 位 置 にカーソルを 置 いて,[ツールバー]ウィン ドウの[ 入 力 (ラジオ)]を 選 んでダブルクリックします. さらにそのフィールドをダブルクリックして, 図 29 のダイ アログボックスで 設 定 を 行 います.ラジオボタンはグループ 内 での 択 一 となるので,グループ 名 が 必 要 です.さらに, 選 択 されたときの 値 と 初 期 状 態 を 設 定 します. 初 期 状 態 が オ ン に 設 定 されたボタンはフォームを 開 いた 時 点 で 選 択 状 態 になります.したがって,グループ 内 で 1 つだけ オン にしておくことができます. 図 29 ラジオボタンのプロパティ チェックボックス 挿 入 したい 位 置 にカーソルを 置 いて,[ツールバー]ウィンドウ の[ 入 力 (チェックボックス)]を 選 んでダブルクリックします. さらに 図 30 のダイアログボックスで 設 定 をおこないます.この 設 定 はほぼラジオボタンの 場 合 と 同 様 ですが,チェックボックスはそ れぞれ 独 立 しており, 個 々に オン オフ を 指 定 できるので, グループではなく 個 々のボックスの 名 前 を 指 定 することになりま す. 30 チェックボタンのプロパティ 11.2 フォームデータの 送 信 とその 処 理 フォームに 入 力 されたデータは, 用 意 されたプッシュボタンが 押 されると,そのプッシュボタンに 定 義 された 処 理 へと 送 られます.したがってデータ 送 信 をおこなうプッシュボタンには, 送 られたデータを 受 けて 実 行 される 処 理 を 定 義 しておく 必 要 があります.その 処 理 には 次 の 3 通 りがあります. 指 定 したプログラムへ 送 って 処 理 をさせる 指 定 された 宛 先 へメールとして 入 力 データを 送 る 指 定 されたファイルへ 入 力 データを 保 存 する 処 理 の 設 定 プッシュボタンへの 処 理 の 設 定 をおこなうにはまず, 挿 入 するプッシュボタンを 選 択 し, 右 クリック[フォーム のプロパティ]を 選 択 します. 図 31 のダイアログボックスが 表 示 されるので, 送 信 先 または 他 の 送 信 先 を 選 んで, 上 記 の 3 種 類 いずれかの 方 法 による 処 理 を 設 定 します.フォームに 入 力 されたデータをテキストファイル に 保 存 するだけであれば 設 定 は 簡 単 で, 送 信 先 を 選 択 して 保 存 先 の ファイル 名 を 指 定 します. 保 存 先 は, このページのファイルが 保 存 されたフォルダを 基 準 とする ので,そこからのパスを ファイル 名 として 記 入 します. 自 分 で 用 意 したプログラムを 起 動 させる 場 合 は, 結 果 の 保 存 先 として ほかの 送 信 先 を 選 び,ダイアログボックス 上 の オプション ボタンを 押 して, 表 示 されるダイアログボ ックスで 処 理 プログラムを 指 定 します. 入 力 データの 引 き 渡 し 20

入 力 データの 引 き 渡 しは,フィールドに 付 けた 名 前 で 行 われます.たとえば,あるプログラムを 実 行 するように した 場 合 は,そのプログラムの 中 でフィールドに 付 けた 名 前 を 変 数 名 として 用 いることにより 引 用 することができます. 図 31 フォームのプロパティの 設 定 12 フレーム フレームとはブラウザの 画 面 をいくつかの 枠 (フレーム)に 分 割 して,その 1 つひとつに 別 々のページを 表 示 す る 機 能 です.フレームを 使 用 すると,いくつかのページを 同 時 に 1 つのページの 中 に 表 示 することができます.フ レームの 中 のページからリンクを 張 るページは,その 表 示 先 のフレームを 指 定 することができます. フレームは 通 常 このような 機 能 を 利 用 して, 常 に 目 次 やバナーを 表 示 しておくことに 利 用 されます.こうすると, 目 次 のページに 戻 らなくても,どのページを 表 示 中 であっても 希 望 のページを 表 示 させることができます. 12.1 フレームの 準 備 フレームを 利 用 するときはまず,フレーム 自 体 のページ(フレームのページ)を 作 成 します.こ れを SharePointDesigner で 作 成 するときの 手 順 は 次 のとおりです. 1 メニューの ファイル 新 規 作 成 を 選 ぶ. 新 規 作 成 のダイアログボックスが 表 示 されます ( 図 32 参 照 ) 2 図 32 のように フレーム タブを 選 び,その 中 から 適 当 なフレームスタイルを 選 択 して[OK]ボ タンを 押 す. 図 33 のようなフレームに 分 割 された 新 しいペー 図 32 ページテンプレート のダイアログボックス ジの 画 面 が 表 示 されます. 3 各 フレームの 新 しいページ をクリックする. それぞれ 白 紙 のページが 表 示 されます. すでに 各 フレームに 入 れるページが 用 意 されているときは, 初 期 ページの 設 定 を 選 んで,そのフレームに 入 る ページを 指 示 します. 4 フレームページと 各 フレームに 入 れるページを 保 存 する. メニューの ファイル 名 前 を 付 けて 保 存 を 選 び, 各 ページとフレームに 適 当 なファイル 名 を 付 けて 保 存 します.ファイル 名 には 半 角 の 英 字 と 数 字 だけを 使 用 するのがよいでしょう.ここで 保 存 した 各 ページが,このフ レームが 表 示 されたときの 初 期 ページとなります. すでに 各 フレームに 入 れるページが 用 意 されている ときは,フレームページだけの 保 存 になります. 5 フレームページを 閉 じる メニューの[ファイル] [ 閉 じる]でフレームと 各 ページを 閉 じます. 以 上 でフレームの 準 備 は 終 わりです. 12.2 初 期 ページの 編 集 フレームの 準 備 で 用 意 したフレームを 構 成 する 初 期 ページを 編 集 して 完 成 させます.その 手 順 は, 通 常 のペ ージを 編 集 するときと 同 じです.まず, ファイル 開 く でページを 開 き,その 内 容 を 作 成 します. 図 33 フレームページ 作 成 の 画 面 12.3 その 他 のページの 作 成 21

フレームのページからリンクする 先 のページを 作 成 します.これは 新 規 作 成 として 作 成 します. 新 たなペー ジを 作 成 する 際 の 通 常 の 手 順 と 同 じです. 12.4 リンクの 設 定 フレーム 内 のページから 他 のページにリンクを 張 るときは, 表 示 するフレームを 指 定 する 必 要 があります.たと えば, 左 側 のフレームを メニュー とし,その 中 の 項 目 が 選 ばれたときに, 選 ばれたページが 右 側 のフレームに 表 示 されるようにする 場 合 などです.そのような 設 定 をするには, 次 のような 手 順 でリンクの 設 定 をする 必 要 があ ります.これにより,リンク 先 のページの 表 示 フレームを 指 定 します. 標 準 ではリンク 先 のページはリンク 元 と 同 じページに 表 示 されるので,そのような 場 合 は, 表 示 先 のフレームを 表 示 する 必 要 はありません. 1フレームのページを 開 く 表 示 先 のフレームを 指 定 するには,フレームページの 中 にそのページが 開 かれている 必 要 があります. 2 リンク 個 所 を 選 択 し,[ハイパーリンク]ボタンを 押 す. ハイパーリンクの 作 成 ダイアログボックス( 図 19 参 照 )が 表 示 されます.リンク 設 定 の 基 本 操 作 は 通 常 通 りですが, 次 のように 表 示 先 のフレームの 指 定 が 必 要 です. この12の 順 序 は 重 要 です. 逆 にすると, 表 示 先 の 指 定 ができません. 順 序 を 間 違 ったときは, 一 度 各 ページを 閉 じて, 正 しい 順 序 で 開 きなおします. 3 リンク 先 の URL を 入 力 した 後, ハイパーリンクの 作 成 ダイアログボックスの 右 側 にある ターゲットフレ ーム のボタンを 押 す. 図 34 のダイアログボックスが 表 示 されます. 4 作 業 中 のフレーム で 表 示 先 のフレームをクリック し, OK ボタンを 押 す. ハイパーリンクの 作 成 ダイアログボックスに 戻 りま す. 5 OK ボタンを 押 す. これでリンクの 設 定 が 完 了 します. 図 34 表 示 先 フレームの 設 定 12.5 フレームページとフレームの 変 更 フレームページおよびフレームの 表 示 様 式 などの 設 定 は 必 要 に 応 じて 変 更 することができます.これをおこなう にはまず, 次 の 手 順 で フレームのプロパティ ダイアログボックスを 開 きます. 1 いずれかのフレームを 選 択 する 特 定 のフレームの 設 定 をおこなう 場 合 は,そのフレームを 選 択 します.フレームページ 全 体 の 設 定 をおこなうときは, どのフレームでも 構 いません. 2 右 クリック[フレームのプロパティ]を 選 択 する. 図 35 の フレームのプロパティ ダイアログボックスが 開 きます. スクロールバーの 表 示 / 非 表 示 選 択 されたフレームに 入 るページにスクロールバーを 表 示 するかどうかを 設 定 することができます. 表 示 しない, 必 要 に 応 じて 表 示 する, 表 示 する の 中 から 選 択 するこ とができます.スクロールバーは,そのフレームの 内 容 が 表 図 35 フレームのプロパティ 22

示 しきれないほどの 幅 や 長 さになったときに 必 要 になるもので, このオプションはその 際 の 対 応 を 指 示 するものです. スクロールバーの 表 示 に 関 する 指 示 は, 図 35 の フレームのプロパティ 上 の オプション スクロール バーの 表 示 で 行 います. フレームのサイズの 変 更 図 35 の フレームのプロパティ 上 の フレームのサイズ で 指 定 します. 幅 および 高 さが,ピクセル, 相 対 比,および% 単 位 で 指 定 できます. また,フレームのサイズの 変 更 はフレームページの 編 集 画 面 ( 図 35)でフレームの 境 界 をドラッグしておこな うこともできます. 初 期 ページの 変 更 初 期 ページを 当 初 設 定 したものから 別 のページ(ファイル)に 変 更 することができます. 変 更 は, フレームの プロパティ 上 の 初 期 ページ の 欄 で 行 います. フレームページ 全 体 に 関 する 変 更 フレームページ 全 体 の 仕 様 を 変 更 するには, 図 35 上 の フレームページ ボタンを 押 し, 図 36 の ページのプ ロパティ ダイアログボックスを 表 示 させます.ここでは, 次 のような 変 更 ができます. フレームを 分 割 する 枠 線 フレームを 分 割 する 枠 線 は,その 幅 を 変 更 したり 非 表 示 にしたりす ることができます.この 変 更 は, ページのプロパティ ダイアロ グボックスの フレーム タブで 行 います. フレームページのタイトル フレームページのタイトルは,このフレームページがブラウザ 上 に 表 示 されたときにタイトルバー(ブラウザの 最 上 部 ) 上 に 表 示 され る 文 字 列 です.その 変 更 は, ページのプロパティ ダイアログボ ックスの 全 般 タブで 行 います. 図 36 フレームページのプロパティ 編 集 画 面 23