ＨＰ作成テクニック
■ レイアウト tableによる中央表示 CSSでレイアウト 　 　 　
■ ページテクニック ページ拡大縮小 ソースを表示 リンクをTopへ案内 　 ソースエディタの変更
■ その他 カレンダーを付ける 　 音や音楽を挿入 　 　
■ メニュー表示 frameを使う iframeを使う スタイルシートを使う CSSプルダウンメニュー スマホ対応メニュー
(使い回しメニュー→)
 JavaScriptで水平枠 JavaScriptで垂直枠 flashメニュー 　 　
　
　【tableで中央表示】 <table>タグを使うとページの中央表示が出来ます。一行一列の表の中にページとなる内容を記述します。
  　　【記述例↓】
<html><head>
  <title>中央表示</title>
</head>
<body bgcolor="silver">
  <table border="0" width="600" height="100%" align="center" bgcolor="white">
    <tr><td align="left" valign="top">
        <center><font size=+3>ページを中央表示する</font></center><hr>
        　表の中に、実質的なページを作ると、ブラウザの幅が変わっても、
        ページを中央表示することが出来ます。
        <br><br>
        <table border="0" align="center" width="95%">
          <tr><td align="right">
              <img src="y0399s.jpg" border="0"></td>
            <td align="center">
              写真の説明文を、このようにレイアウトできます<br>
              <br>(tableタグを使ってレイアウト)
        </td></tr></table>
  </td></tr></table>
</body></html>

【左記表示例】


　【参考サイト】
<table>
　
　【リンクをTopへ案内】 JavaScriptを使って、途中ページへのリンクをトップページへ案内します。
  　　【記述例↓】　　toplink.html (経由1)
<html><head>
  <meta http-equiv="Content-Type" content="text/html; charset=Shift-JIS">
  <title>リンク制御</title>
  <script type="text/javascript" language="JavaScript">
    <!--
      preUrl = document.referrer;
      page1 = "http://park15.wakwak.com/~kurage/jhp_g/tech/";
      page2 = "http://park15.wakwak.com/~kurage/jhp_g/hp_g.html";
      if( preUrl.indexOf( page1, 0 ) < 0 ){
        this.location.href = page2;
      }else{
        myMsg = preUrl;
        myMsg = myMsg + " からお越し下さって有難う御座います";
      }
    //-->
  </script>
</head>
<body bgcolor=#ffffbb>
  http://park15.wakwak.com/~kurage/jhp_g/tech/ からくると、
  このページを表示、<br><br>
  そうでないと、
  http://park15.wakwak.com/~kurage/jhp_g/hp_g.html　に飛ばす
</body></html>
【実行例】　　 ≪経由1≫　 ≪経由2≫　　 . 　.
　
　【ページの拡大縮小】 JavaScriptを使って、表示ページを拡大／縮小表示をします。 　(本機能はＩＥ限定です)
  　　【記述例↓】　　　 参考サイト 
<html><head>
  <meta http-equiv="Content-Type" content="text/html; charset=Shift-JIS">
  <title>ページを拡大／縮小する</title>
</head>
<body bgcolor=#ffffbb>
  <h2>ページ全体を拡大／縮小【例】</h2>
  <select onChange="document.body.style.zoom=this.options[this.selectedIndex].value">
    <option value="60%">60%
    <option value="80%">80%
    <option value="100%" selected>100%
    <option value="120%">120%
    <option value="150%">150%
    <option value="200%">200%
    <option value="300%">300%
  </select><br><br>
  上のセレクトボックスで、ページ全体の倍率を変更できます (本例ではiframe分を)
  <br><br><img src="y0399s.jpg">
</body></html>
　　【実行例】
　
 
【ページソースの表示】

　 Web 表示ページ上で右クリックし、「ソースの表示」をクリックするとページソースを見ることができます。

　(右クリックで起動するソースエディタを変更する方法は、こちら。) 		　
　
　【カレンダーを付ける】 JavaScriptを使ったカレンダーを表示します。
  【実行例】
【参考サイト】
「国民の祝日」
祝日判定マクロ
暦 例１ 　例２
祝祭日を取得
国立天文台の暦 		　　　【記述例↓】　 祝日表利用版はこちら 　推奨版はこちら
　
　【音や音楽の挿入】 <embed>や<object>を使います。 ( IE7ではtypeでMIME タイプを記述しないと動かないことがあるようです。)
  　　【記述例↓】
<html>
<head></head>
<body>
  <embed src="trip.mid" type="audio/x-mid" autostart="false" loop="true" width="50" height="28">
</body>
</html>

　【参考サイト】
　<embed>
　 MIME タイプ
　 MIME 一覧

←BGM SW
　
　【 ActiveX コントロール】 APPLET、 EMBED、又は OBJECT 要素で読み込まれた Microsoft ActiveX controlとは直接対話出来ません。
　下図のように「クリックするとこのコントロールをアクティブにして使用します」と表示され、クリックを要求します。
コントロール要求表示例　　　←表示例

　この表示を避けるためには、例えば次の例のように、外部スクリプト ファイルからコントロールを読み込みます。 参考１ 　参考２ 　参考３
　下記の例では、document.write を記述した外部ファイル (act.js) を、本文から読み込んで、ActiveX コントロールのアクティブ化を行ない、 コントロールが対話できる状態で読み込んでいます。
　 　　【記述例↓】　　 実行例
<html>
<head>
  <meta http-equiv='Content-Script-Type' content='text/javascript'>
</head>
<body>
  <script src='act.js'></script>
</body>
</html>

  【act.js】
document.write("<embed src='trip.mid' type='audio/x-mid' autostart='false' loop='true' width='50' height='28'>")