PC研修会０９ テキスト

ホーム > PC研修会 > ホームページビルダー活用

・ 出来るかな？ WEB道場 ヘッダー・フッダーデザイン

今回は表を利用したヘッダーとフッダーのデザインです。
   下記の１〜7の作業にチャレンジしましょう！ （1人で出来れば中級者）
  1. 今回は表でデザインです。先週作成したindex.htmを開きまます。
    １行目の店名をフレーム風にデコレーションしてみましょう。
  2. サイト/素材ビューより、レイアウト用素材をクリックします。
  3. 表示されたレイアウト素材から、お気に入りの素材を1行目に挿入します。
    （レイアウト素材は、表に色を付けてデザインされています。）
    挿入後、<フィールド>に店名及びキャッチフレーズを入力しましょう。
    （完成品参照；ironman01/ ・デザインは自由です）
    (色はこちらの216色から選ぶのが無難です。）
  4. HTMLソース画面で<BODY>を、<BODY leftMargin="0" rightMargin="0" topMargin="0">に、書き替えます。（左右と上部の余白を０にします）
    続いて表の幅を100％に指定しましょう。

    プレビュー画面で確認してください。
    ちょっとフレーム風デザインに仕上がったでしょうか？
    （完成品参照；ironman02/）
  5. 同様に最終行にフッダーデザインをほどこして見ます。
    ヘッダー部と同じ色使いでOKです。
    上記4.の<BODY>タグに、bottommargin="0" を追加すれば下部余白が0になります。
    完成品↓のソースをコピーして、アクセスカウンターも設置しましょう。
    （完成品参照；ironman/）

    【Copyright って？】
    copy・right 版権［著作権］（を得る［を有する］） の意味です。
  6. 完成後、WEB道場のあなたのディレクトリーにアップロードしてください。
  7. 最後に、転送が出来ているかブラウザで表示を確認して作業完了です。

表でフレーム？

なぜ、フレームを使用せずに表でフレーム風にするのだろう？
「検索エンジン最適化」技法(ロボット型検索エンジンに上位表示させるための手法)関連の、ホームページが指摘しているように、フレームは検索エンジンと親和性が余り高くないようです。Googleで検索すると上下左右のフレームページが、ばらばらに表示される事が多いようです。
2003/7/14
尚、このテキストは松原駅前商店会 PC研修会で使用されたテキストです。
ご意見・ご質問・リクエスト等は、専用掲示板にご記入下さい。  【 事業部 】
Copyright(C)  2000.-2003. Isono.biz AllRights Reserved