HTMLとSEOとCSSの各関係_2018_3_1
- HTMLは情報を分類する言語
- SEOは検索エンジンのための情報の最適化するテクニック
- CSSは情報分類の初期設定を変えるカスタマイズの言語
HTMLの紹介
HTMLとは、特別なテキストによる、マークアップ（タグをつける）する言語です。
マークアップというのは、<分類>情報</分類>のように情報を<分類>のタグと言われる
もので囲ってあげます。ハイパーなテキストによる、マークアップするラングエッジ（言語）が
HTMLの名前の由来です。
HTMLはもともと「本」のような情報をまとめるために生まれたので
本（または新聞）で使われるようなマークの名前が多いと思います。
シンプルなHTMLを紹介します。
<html> ここからHTMLが始まるというマーク
<head></head> 本でいうと背表紙に当たる部分
<body></body> 本でいうと中身を表す部分
</html> ここでHTMLが終わるよというマーク
このHTMLタグは必ずHTMLファイル内にあるタグです。
このテキストを入力し、「××.html」という名前で保存します。
これで一番シンプルなHTMLファイルができます。
HTMLとSEOの関係
HTMLを利用するメリットは、情報にマークをつけて理解しやすくなります。
単なるテキストが並んでいた場合、この情報を分類しにくいです。
例えば以下のようなテキスト。
いぬねこたぬき
こうしたらどうでしょうか？
<動物>いぬ</動物>
<動物>ねこ</動物>
<動物>たぬき</動物>
３匹の動物がいることがわかります。
情報を分類するということは、検索エンジンが各ページを検索ワードによって分類するときにも
役立つということです。
では、検索エンジンのために、情報をタグをつけるなどして最適な情報にしていきましょう。
検索エンジンのための最適化、これをSEOといいます。最適化はさまざまなテクニックがあり
今回はその一つtitleをお伝えしました。
CSSの関係
<h1>や<p>を使ってマークアップするだけでは、人間が好むデザインにならなかった場合
その表示をカスタマイｽズするルールシートを作ると表示を変えることができます。
これがCSSです。
例えば
<style type=”text/css”>
<!–
h1 {
color:blue;}
–>
</style>
上記の記述を<head>タグ内に書くことで、h1のタグを利用しているところの文字の色が青くなります。
HTMLの表示で気に入らないところはどんどんとカスタマイズしていきましょう。
今回、テキストをお持ちでしたが、そのテキストに沿ってしていくと後で復習がしやすいです。
お手元にあると役に立ちますが、あまりに重い！場合はPDF化して持ち歩くこともできますので
そうされたい場合はまた教えてください。
