（A）平成２４年４月度例会：
４月２７日(金)午後1時より４時４５まで例会と勉強会が開かれました。今月からプロミス事務所の会議室を借りての開催となりました。下の写真のように借りられた会議室は非常に明るくて清潔でした。プロジェクターも利用できて大変便利でした。
討議された事項は以下の通りです。
- 月例会の会場に就いて
京葉銀行文化プラザにあるボランティアズ・カフェが4月よりパルコの隣のツイン・ビルに移転しましたので、今月から三越デパートの先にあるプロミスの事務所の会議室をお借りすることになりました。
差し当たり５月もここをお借りすることにしますが、将来会員を増やしていこうという意図を考慮して、候補会場としてツイン・ビルの新ボランティアズ・カフェの下見等をして検討する必要があるだろうということになりました。一先ず、会場設定担当役の方に検討をして頂くことになりました。
この他にも新宿公民館もそのうちに候補会場として検討してみる価値があるかもしれません。 - 夏の合宿に就いて
昨年は８月第１週に奥志賀高原のペンション・シャレー・クリスチャニアで行われましたが、今年は何処にしようかという話が先月の例会で出ました。夏の合宿はJavaScriptやCGIといった少々レベルの高いテーマを集中的に学習するには良い試みだと思われます。今月はこの件について話し合う時間がありませんでしたので、来月は時間を作って忘れないように話し合いましょう。
（B）勉強会：
プロミスの事務所の会議室での勉強会風景
テーマ：ＨＴＭＬとＣＳＳの連携
（1） ＣＳＳ2.1対応の為のホームページ・ビルダーの設定
- 将来の技術動向の先にあるHTML5.0に徐々に対応するために、現在からXHTML1.0準拠の仕様に準備しておく
- メニュー「ツール」→「オプション」→＜新規ファイル作成場合のフォーマットをXHTML1.0に指定する
- 新規ページ作成時に編集→DocType宣言→＜XHTML 1.0 Transitional//ENであることを確認する
- HTML構文エラー自動修正をさせない
メニュー「ツール」→「オプション」→「一般」→＜自動修正の☑をはずし、全てのエラーを無視させる＞ - バック・アップ ファイルを作成しない方が良い。
メニュー「ツール」→「オプション」→＜保存オプションでバックアップ作成を指定しない＞
ページが失われた場合はリモート・サイトからダウンロードすればよい。
（２）Ｄiv(大枠と中枠）設定のコツ
- 先に「挿入」→「レイアウト・コンテナー」→「DIVの属性」→「属性ダイアログ」→で＜id名を指定＞指定しておく
- 次に「表示」→「スタイルシート・マネジャー」→「ルール情報ペインで追加」→「IDのスタイルを設定」→「ID名入力名」→
「位置タブで幅と高さを指定」
＜注＞「ページ編集」タブの左にあるSマークをクリックしても「スタイルシート・マネジャー」は表示される。 - 大枠containerの幅は正確なサイト・デザインのもとで決めておく。 高さは暫定的に大きめに入力しておき、後で調整する。ボーダーは指定しない。その代りに枠の範囲が作業中に判るように薄い色の背景色を指定して置くと便利です。、最終的にはその背景色を削除する。
- 大枠をページの中央配置するには、左右のマージンを１pxに指定しておいて、後でHTMLソースで左右ともautoに変更する。その際、大枠containerの回り込みfloatingをleftに指定しない。
- 中枠menu_side、 main_side等にはボーダーを指定し、幅はボーダーの幅を差し引いた正確なサイズを指定する。
背景イメージは内容物の邪魔にならないような薄い色で模様などもないものを選ぶことがお勧めです。 - 中枠、小枠の入れ子配置は「位置」タブの回り込みを左に指定する。
入れ子の直前の中枠、小枠の「回り込み解除―両方」を忘れないように。 - 入れ子が思うように配置されない場合は、横幅のサイズ、回り込みの解除、それに枠内の内容物Objectのサイズを検証すること。
（３）枠内の内容物Objectのスタイル設定手順のコツ
- 先ず、枠に入る内容物Objectの配置を考慮してSマークでスタイルの配置・大きさ等のルールを設定し、名前を付けておく。
- 次に、文字列等の内容物を枠内にBoxとして入力する。これは入力に際して<p>とか<h1>とか<li>とかBoxの種類をを指定して入力することです。決して裸の文字列としては入力しないこと。
- 最後に、入力した内容物を指定して、画面右上隅に表示される該当属性タブをクリックして、「属性ダイアログ」を表示させ、その右下隅にある「スタイル」ボタンをクリックして、「スタイル設定ダイアログ」を表示する。このダイアログの下端にある「定義済ID」や「定義済クラス」や「選択されたタグを指定する」欄で内容物とスタイルのルールを関連付けます。予めスタイルのルールを定義しておけば、その定義済のIDやクラスやタグは▼をクリックすると選択リストに表示されて、指定することが出来ます。
（４）文字列の見栄を良くするスタイル設定のコツ（来月学習します）
- 「文字のレイアウト」： 行の高さの指定で文字列の見栄が変わってくる
例えば、行の高さを150%にすると行間がゆったりしてくる。
但し、「文字レイアウト」の水平方向の配置はObject内の文字配置で、Object自体の配置ではない。 - 「レイアウト」： 上方向と左方向のマージンの指定でObjectの枠内の配置が決まる。
マージンは隣のObjectとの距離で、パディングはそのBox内の配置を決める - 「位置」： 幅はそのObjectの横幅を指定する非常に大事な指定です。このサイズを指定しなかったり、入る枠の幅より長い幅を指定したりすると、入れ子枠が乱れる原因になります。高さはむしろ指定しない方が無難です。
（５）疑似クラスの設定のコツ（来月学習します）
- 最近ハイパーリンクには下線を付けたり、色を変えたりしないものが増えてきた。演習例題のリンクがその例です。
その為に、疑似クラスを使い、クラス名を「link_01 a」のようなクラスを設定し、フォントの前景色を元の色に指定し、飾りを無しに指定すればよい。
（６）「乗鞍高原スキーとスノーシュー旅行」の例題作成演習
- Step1：枠組み作成
大枠containerサイズ1100 X 3200px マージン右auto左auto 暫定bgcolor薄い色
中枠header サイズ 1098 X 330px ボーダー 実線灰色 上４、左右１、下２５
中枠 page_index サイズ 1098 X 30px ボーダー実線灰色 上下左右１ 背景色オリーブ
中枠left_side サイズ 1098 X 2710px ボーダー実線灰色 上下左１ 背景wallppr04.gif 繰返し
中枠main_side サイズ1098 X 728px ボーダー実線灰色 上下右1 背景色薄水色
中枠footer サイズ1098 X 30px ボーダー実線灰色 上下左右1 背景色オリーブ
- Step2：headerに内容物を入力して、スタイルを規定する
「挿入」→「見出し１」により： <h1>乗鞍高原スキーとスノーシュー旅行</h1>
「挿入」→「標準」により： <p >休暇村乗鞍高原の第一スキー・リフトを登った地点から臨む乗鞍岳中央が主峰の剣ヶ峰
（標高3,026m）</p>
「スタイルシート・マネジャー」により：H1のスタイルをフォント；サイズ36px bold 白#FFF 位置；幅600px
レイアウト；マージン上10px マージン左320px
「スタイルシート・マネジャー」により：クラス；header_txtをフォント；サイズ14px normal 白サイズ；750px
レイアウト；マージン上285px マージン左470px
<注意> 内容物の入力の前には必ず「挿入」で<p>や<h1>や<li>等々のBoxを作っておいてからその中に入力すること。
「挿入」の場所を指定する時は、「HTMLソース」モードで正確に指定すること。
- Step3：page_indexに4つのlinkを入力して、スタイルを規定する
「挿入」→「標準」により： <p >サイト・トップへ</p>
「挿入」→「標準」により： <p >旅行・目次へ</p>
「挿入」→「標準」により： <p >2日目へ</p>
「挿入」→「標準」により： <p >3日目へ</p>
「スタイルシート・マネジャー」により：クラスlink_01のスタイルを規定する：
フォントサイズ18px bold 白#FFF 幅150px マージン上5px マージン左250px
「スタイルシート・マネジャー」により：クラスlink_02のスタイルを規定する：
フォントサイズ18px bold 白#FFF 幅150px マージン上‐37px マージン左450px
「スタイルシート・マネジャー」により：クラスlink_03のスタイルを規定する：
フォントサイズ18px bold 白#FFF 幅150px マージン上‐38px マージン左636px
「スタイルシート・マネジャー」により：クラスlink_04のスタイルを規定する：
フォントサイズ18px bold 白#FFF 幅150px マージン上5px マージン左800px
「挿入」→「リンク」により<p >サイト・トップへ</p>にサイト・トップへのリンクを設定する
「スタイルシート・マネジャー」により：クラスlink_01 A疑似クラスのスタイルを規定する：
前景色：白 デコレーション：なし
(Ｃ） 次回の例会とその討議テーマ
日時： 平成２４年５月２５日（第４金曜日）にプロミスの会議室の予約の申し込みをしてあります。
テ―マ： 「乗鞍高原スキーとスノーシュー旅行」の例題作成演習」の続きと「ルート・ラボ」の演習
準備として次の2点をお願いします：
- 本日の未完のの部分がありましたら完成しておく。
- 「たそがれ長兵衛」の「乗鞍高原スキーとスノーシュー旅」の1ページの部分をＰｒｉｎｔ-ｏｕｔして持参する。
