My Web道

WEB制作科 受講記録 …とその後も続くWEB制作に関する活動・学習記録です。

※ 当サイトはアフィリエイト広告を利用しています

3/24 ①HTML5, ②検索エンジン対策

f:id:sntkk3:20180715205655p:plain

【本日の授業】

HTML5とは?

これから普及していくと想定される。
問題は、IEの対応遅れ。
IEが対応すれば、HTML標準になる。


特徴

  • 高機能を実現
  • 記述がかなり難しい
  • 簡略化できる点も多い

(理論上は)記述が簡単になったと言われている。
(現実は)従来のルールに加えて新しいルールでマークアップするようになった分、作る側の負担は増大した。


HTML5以降)注目する変更点

  • ブロックレベル要素
  • インラインレベル要素がなくなり(コンテンツモデルカテゴリーがそれらに代わる)a要素がブロック的な要素を含めることができる(a に面積を取ることができるようになった)


便利ツール

HTML5 Outliner (Chrome拡張ツール)
ページ構造、文章のツリー構造を確認することができる。
HTML 5 Outliner
http://gsnedders.html5.org/outliner/

[ Point ]

  • 自分がページを作ったらOutline構造を見るべし。
  • HTML5 navの中身は拾わない。
  • Outline構造をどうやって作るかがHTML5の本質。


検索エンジン対策
[ Point ]

  • Section タグ内には、見出し、本文を入れる。
  • body直下はheader要素のh1

検索エンジンはこれを読み取る。(上位表示のポイント)

  • body直下のheaderは重要
  • ツリー構造ができていても、テキストが拾われていないとNG
  • ツリー構造でh1, h2
  • 検索エンジンはhのみしか拾わない(h3まで)
  • div要素について
    • div要素は、アウトライン構造に依存しない(アウトライン構造で拾われたくないものは、divを使う)
    • divを使っていけないわけではない。
    • アウトライン構造に関係しない箇所でレイアウトを操作するためのdivは積極的に使う。
    • アウトラン構造に関係するh1,h2をdivで囲むのはNG
    • 一行をdivで囲むのはNG

SEO
[ Point ]

  • 自分が上位表示したいビックキーワード、その後にユニークキーワードを追加
  • ビックキーワード + ユニークキーワード
  • 同じ記事タイトルはNG
  • 時々キーワードを入れる


3. ペーパーテスト([習熟度確認テスト]2回目)

(午後) 
[習熟度確認テスト]2回目

問題
1. IPアドレスドメイン名などの管理を行っている団体
2. インターネットで使われている通信規約(プロトコル)
3.パケット通信の概念と仕組みとしては間違っている文章
4. WebクライアントとWebサーバの間でやりとりされているプロトコル
5. URLをWebブラウザに入力した際、ドメイン名をIPアドレスに変換する作業を行う


【参考情報】
3分間 NetWorking
http://www5e.biglobe.ne.jp/~aji/3min/index.html

※ 当サイトはアフィリエイト広告を利用しています