HTMLの基礎知識を養おう。新人ではなくても、間違いなく知っておきたいこと。超重要基礎知識。その１。
HTMLと言えば、マークアップ言語です。サイトの骨格を成すものであり、エンジニアに限らず触ったことがあるはずです。
HTMLには、抑えておきたいことがいくつかあるのでそれを紹介します。
パート1の内容です。
1. htmlタグに関して
langを設定して下さい。サイトのデフォルトの言語はなんですか？日本語ならlang="ja"を、英語ならlang="en"を。単純なことです。
2. headタグに関して
headタグ内には、色んなタグの種類があります。Googleに通知するような情報だったり、サイト自体の情報だったりと。
この中で重要なのは、titleタグとmetaタグ、ファビコンです。
titleタグ
Googleなどで検索した時に表示されるページ名になるので、必ず設定しましょう。設定しないということは、SEO的に良くない結果をもたらします。
metaタグ
まず重要なのはdescriptionプロパティです。この情報は、Googleなどで検索した時にページ名の直下に表示される説明文です。こちらも必ず設定しましょう。こちらも設定しないということは、SEO的に良くない結果をもたらします。
次に重要なのはFacebookが開発したメタデータプロトコルです。これは、op:descriptionなどのように使い、SNSなどでリンクがシェアされた時に、表示される情報になります。ここには、画像も設定できます。これは、Twitterなども似たようなメタデータプロトコルを用いることで、定義できます。
ファビコン
これは、サイトにアクセスした時にサイト名の左に表示される16ピクセルのアイコンになります。こだわっているサイトになってくると、各端末ごとにそれぞれ最適な解像度のアイコンを設定して、ユーザに提供しています。ユーザが自分のサイトのファンになってくれるためのアイコンを選びましょう。
3. bodyタグ
h：見出しタグ
まずは、<h1>タグですが、これは各ページに1つにして下さい。なぜなら、最も上位にある見出しになるからです。また、それぞれの見出しの数字は昇順にして下さい。
例えば
<h1>hoge</h1>
<h2>fuga</h2>
<h3>piyo</h3>
のように、して下さい。
<h1>hoge</h1>
<h3>piyo</h3>
<h2>fuga</h2>
のようにしないで下さい。
これでパート1を終了します。
次は、パート2ですが、また時間がある時に追加します。
