第5回目

日　時：2015年1月24日　13:30～16:30

場　所：かるがも団体交流室 Ⅰ Ⅱ

出席者：受講者　13名、HPWG　13名

講　師：川上教子、松本恭彦、熊谷決

内　容：

文章の入力

文字列「コンテンツ」の後ろをクリック
ナビメニューの［文字の挿入］をクリック
「シニアになって始めたパソコンでの毎日です。」、あるいは「シニアになっても続けているパソコンと切り離せない毎日です。」と入力
入力後［Enter］キーを押す
続けて「最新のパソコンを使え色々なことが分かる喜びと、たくさんの仲間たちとボランティア活動に楽しく参加できることが大変嬉しいです。」と入力
［挿入］メニュー→［段落］→［標準］ (Shiftキー + Enterキーでも同じ)
「そんなつれづれの活動を紹介していますのでご笑覧ください。」と入力
［ページ/ソース］画面を表示
ソースで「ホームへ戻る」の行を一文字目のスペースから行末まで選択し、切り取る
コンテンツの締めの </div> の先頭（一文字目）をクリックし、貼り付ける
続けて識別用に入力していた個人名の行を削除
最初に挿入した写真の行を削除
［ソース］画面上で右クリックし、［ソースの整形］を選択する
「コンテンツ」の文字列を削除
上書き保存

コピーライトの入力

文字列「フッター」の後ろをクリックして、カーソルを移動
「Copyright」と入力
ナビメニューの［その他の挿入→特殊文字］を選択
［特殊文字］ダイアログで、コピーライトマーク（著作権記号）をクリック
［閉じる］ボタンをクリック
続けて「2015 Spring My PC Life All Rights Reserved.」と入力
「フッター」の文字列を削除

水平線の挿入

入力済みの文字列「Copyright ～」の先頭をクリック
ナビメニューの［レイアウト部品の挿入］から［水平線］を選択
水平線の太さを１ピクセル、幅を１００％に指定し、［OK］ボタンをクリック

文字サイズと色の変更

入力済みの一部文字列のサイズと色の変更を行います。

変更する文字列を選択する。ここでは「パソコンと切り離せない毎日」をドラッグして反転表示
メニューの［書式］から［文字飾り］、そして［フォントスタイルの設定］ボタンをクリック
［フォント］タブで、［サイズ］グループの右側ボックスが「予約語」となっているのを確認し、左側ボックスを▲▼により「やや大きい」に設定
［文字の属性］グループでは［太さ］の［太い］ボタンをクリック
［色と背景］タブで、［前景色］右側ボックスの v をクリックし、色のリストを表示し「オリーブ」を選択
［OK］ボタンを押す

設定した文字サイズや色を変更する場合

スタイルを変更する文字列の上でクリック
［スタイルエクスプレス］ビューを起動
［カーソル位置］タブを選択
半透明の背景を持つ <span style="...."> 要素を右クリック
コンテクストメニューの中から［タグ（span）のスタイル属性を編集］をクリック
現れた［スタイルの設定］ダイアログで必要に応じて変更

文字を太字で表示する強調表示があるが、本来は内容的に強調するためのものなので、視覚的に太字表示を目指すためだけには使用しない。（ここでは練習します）

強調表示する文字列をドラッグして選択、ここでは「ボランティア活動」の文字列をドラッグして選択
ニューの［書式］から［論理強調］を選択し、更に［ストロング］を選択

ブラウザで確認

作成したWebページを公開する前に、ブラウザーで確認する方法です。

ホームページ・ビルダーでブラウザで表示するページを開く
［ツール］から［ブラウザー］をクリック
リストの中から表示してみるブラウザーを選択（かんたんナビバーのブラウザアイコンからでも確認可能）
表示を確認（かんたんナビバーのブラウザアイコンからでも確認可能）
ブラウザを切り替えて表示を確認

補足説明

前回「ウエブアートデザイナー」を用いて画像のリサイズと切取を実施しましたが、「ウエブアートデザイナー」を使用しなくても処理が可能です。また、一旦挿入したボンタンやロゴを後から編集するには「_HPB_Recycled」フォルダーに保存された「XX.mif」ファイルが必要です。再編集の可能性のある時は削除しないようにしましょう。

リサイズ：

画像を右クリックから「デジカメ写真の編集」をクリック
写真挿入ウィザードのサイズの指定で「大きさを指定して」で目的のサイズを指定

切り取り：

画像を右クリックから「画像を編集」→「画像の切り取り」をクリック
画像の切り取りダイアログボックスで位置とサイズを指定