2007/07/07
高校生のためのHP検索上位HIT術 2007/7/7
★☆★☆★ 高校生のためのHP検索上位HIT術 2007/7/7 ★☆★☆★ ■CSSファイルを使ったホームページの作成２■ ■お詫び 前回のHTMLファイルの見本は、厳密なHTMLの文法に適合していませんでした。 ＜B＞（誤）→＜ｂ＞（正） ＜meta・・・＞（誤）→＜meta・・・ /＞など。 現在の見本は正しく直しましたが、以前のものでも支障なく動くと思います。 ●HTMLタグは＜ｈ１＞開始タグと＜/ｈ１＞終了タグがセットになっています。 セットになっていないものは ＜meta＞＜img＞＜br＞＜hr＞などですが、 新しい文法では ＜meta /＞＜img /＞＜br /＞＜hr /＞と表す事になっています。 ほとんどのブラウザは新旧どちらの表現にも対応しているようです。 ■css11.htm（HTMLファイル）の解説２ ●css11.htmの内容と★解説★ <body> <div id="header"><!-- header --> <div id="logo"> <a href="http://www.google.co.jp/" target="_blank"> <img src="google.gif" width="128" height="53" alt="google" />googleへ </a> ★target="_blank"と指定すると、リンクをクリックした時、別ウィンドウで表示されます。★ ★<a href=>と</a>に、<img>タグとテキスト「googleへ」が囲まれているので、 図形とテキストのどちらをクリックしても、指定先(href)にジャンプします。★ ★width="128"図形の幅を128pxに height="53"高さを53pxにします。★ ★幅と高さを指定しないと元の大きさで表示されます。★ ★どちらか一つだけを指定すると、もう一つは自動的に計算されます。★ ★alt="google" altはalternativeの略で、二者択一、代替手段の意味★ ★図形が表示されない環境で、"google"という文字が代替される★ ★目が見えない人には、特別のソフトにより、"google"という音が発音される★ ★altの指定は最重要課題。★ ★特に説明の必要がない→アイコンなどは、alt=""でも可。★ </div><!-- logo終了 --> <div id="hright"> <span class="menutytle">■メインメニュー■</span> ★spanは期間、幅という意味ですが、授業では範囲と訳しています。divとほぼ同じ意味。★ ★divはブロックレベル要素、spanはインライン要素★ ★class。授業では名前と訳していますが、idとほぼ同じ意味。★ ★idは一つのHPで１回しか使えないが、classは何回も使える。★ <ul> <li><a href="css11.htm">１章へ</a></li> <li><a href="css21.htm">２章へ</a></li> <li><a href="css31.htm">３章へ</a></li> <li><a href="css41.htm">４章へ</a></li> </ul> ★ul。unordered list。順序なしのリスト。★ ★li。list item。リスト項目。★ ★表示は以下のようになります。★ ★・１章へ★ ★・２章へ★ ★・３章へ★ ★テキスト「１章へ」は<a href="css11.htm">と</a>で囲まれているので、 下線が引かれ、クリックするとcss11.htmにジャンプする。★ <p> ★<p>パラグラフ、段落。前後に空白行が入る。★ 《<b>私からのメッセージ</b>》<br /> ★<b>bold、太字。★ ★<br />break、改行。★ <b>優しい心</b>を、失わないでください。<br /> <b>優しい心</b>の人は、勉強してください。<br /> Ｓｔｕｄｙ ｆｏｒ ｙｏｕｒｓｅｌｆ ， ａｎｄ ｆｏｒ ｙｏｕｒ ｌｏｖｉｎｇ ｓｏｍｅｂｏｄｙ． </p> </div><!-- hright終了 --> </div><!-- header終了 --> <div id="pagebody"><!-- pagebody --> <div id="navigation"><!-- navigation --> <span class="menutytle">■サブ メニュー■</span><ul> <li><a href="css11.htm">１章１課へ</a>css11.htm</li> <li><a href="css12.htm">１章２課へ</a>css12.htm</li> <li><a href="css13.htm">１章３課へ</a>css13.htm</li> </ul> </div><!-- navigation終了 --> <div id="content"><!-- content --> <!-- ============================== --> ★この間は自由に変更しても、変な事は起こりません。★ <!-- ============================== --> ■次回はこの続きと、検索で上位表示される為のタグの使い方、cssファイルの解説です。 ========== M君の３つのメルマガ １【愛＞恋＞好きの物語】 高校生の恋愛物語 ２【高校生のためのHPアクセスアップ、検索上位HIT術】 「就職率の良い短大」「二次式の因数分解」「二次不等式の解法」 「バンクバンド」「１０００円札の謎」「検索 上位HIT」 を検索してみてください。M君のHPが上位でHITします。 この経験を基に、検索結果での優先順位のしくみを解説します。 ３【高校の英単語、数学、理科、社会、国語、進路情報】 勉強が好きになるノウハウ集。 「イースター島の神マケマケ」「女の子の名前の名付け方」 を検索してみてください。進路情報などもあります。 ========== 私のHP「グーグル検索とヤフー検索で上位HIT」 http://www7a.biglobe.ne.jp/~mkun/google/index.htm 以下のＨＰに４月３日以降の更新のリストがあります。 http://www7a.biglobe.ne.jp/~mkun/other/new.htm ご感想・ご要望は下記のいずれかへ。 mkun5love@gmail.com http://www2.rocketbbs.com/625/aikoi.html mixiの私のアドレス mixi.jp/show_friend.pl?id=5377274 ========== 配信中止は http://www.mag2.com/m/0000198720.html ==========
