52回目授業内容 SEOの基本〜HTML5の基本〜PHP〜脱線

[授業][Dreamweaver][JavaScript]

SEOの基本

  • bodyの次の「p」は一番重要!
  • ディスクリプションには余計な事はしない!
  • キーワードの設計には神経質で丁度良い。組み合わせ方が重要!
  • 日本語(文章)の能力が重要!

SEOの調べ方

  • URLに「link,」「site,」でキャッシュで「h1」「p」のキーワード、件数を調べて
  • 検索エンジンは上から数十行しか読まないのでいらないモノは削除していく。
  • 「meta keywords」で使ったワードは「p」で使わない物は評価を下げる。
    • トリガーになるだけでエンジンには引っかからない。
  • 「description」では
    • ワードを分ける場合は「、」は文節なので「・」で分ける方が効果は高い。
    • 単語区切りが一番だめ!文章化することが重要!
    • 3文節が基本
  • 1位と同じ事をしても駄目。違うやり方をするのが吉!
  • google analysticはbody最下でも大丈夫
  • 「header」最初の「p」にmeta keywordとdescriptionのワードが必ず入っていないと駄目!
  • phpをhtmlに変換するプログラムを作らないと駄目
  • ?マークのURLは検索対象外
  • サイトマップxmlの用に構造化されてないと意味が無い
  • googleは各ページのmeta_discriptionは別のワードで無いとエラーと取る
  • SEOは最適化することのみ
  • phpは「,link」(外部リンク)を拒否している。要するに「0」になる。かなり重要。

HTML5の基本

  • IE対策として記述する
  • 「style」にあるタグをIEで認識させるために記述する。
<!--[if let IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]>

<!--[if lte IE 9]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
<![endif]-->
<style>
  article, aside, dialog, figure, footer, header,
  hgroup, menu, nav, section { display: block; }
</style>
  • 現時点ではスマートフォンに使われる傾向にある。
  • PCサイトではまだ難しい
  • メインはJavaScriptActionScript2.0
  • 広義のHTML5
    • CSS3やECMAScript5を含む
    • 特定のOSやブラウザに依存しない、はずだったがGoogleの先走りで依存がある。
  • DTDは「!DOCTYPE html」
    • XHTML1.0を継承している半分小文字を使用
  • xmlとは
    • 「html xmlns」= xml name space
      • 名前空間=「div id="#"」のタグを自由に定義できる。
    • 検索サーバーに一番仲が良い

HTML5の新しい要素・属性

  • 「section」
    • HTML5の本質はアウトライン構造にするため。
    • その為に
      を使って構造化する。
    • アウトラインは3構造以上は意味が無くなってくる・・・やっても4まで
  • 「article」
    • 見出しと本文が無い場合は使わない
    • 「section」の外側に使う傾向が強い
  • 「aside」
    • 昔で言う
  • 「nav」
  • 「footer」
    • アドレスタグは「small」を使う。

Chrome拡張機能

  • HTML5 Outlinerをインストール