WEBサイトを作ろう!/head内の定義 metaタグ

今回はhead内の記述についてです。
前回の続きになりますがhead内に定義する項目は非表示項目です。
外部からcssファイルを読み込んできたり、titleやkeywordsなど、直接表示画面には反映されない定義をする箇所なんですね。
このhead内の定義でseo対策等も行っていくので充実させるとより良いサイト作りができると思います。
head内にも色々なタグを入れ込む事ができますがその中で特に重要な5項目を説明していきたいと思います。
まず一番最初に文字のエンコードの指定が必要になります。
HTMLの記述で文字コードが指定されていないと、ブラウザはそのページに最初に記述されている文字のコードによって、そのページの文字コードを判別します。通常はこれで問題無いのですが、たまに文字化けを起こすことがあります。これを避けるためには、使用した文字コードを指定しておく必要があります。
今最もスタンダードな形式は「utf-8」という形式です。
このエンコードのタグをhead内に打ち込みます。
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> この記述をhead内に入れ込みます。
<head></head>の中に入っているか確認して下さいね。
このようにmetaのタグで囲みます。
<META>タグはその文書に関する情報(メタ情報)を指定して、 ブラウザや検索ロボットに知らせるためのタグです。
このmetaのデータが無いとせっかくデザインにこったWebサイトを作ったとしても誰にも気付いてもらえないんです。
デザイン同様、meta要素も重要な項目なので是非覚えましょう!

それでは次に必要な2つめの定義は「title」です。
今から作り込んでいくサイトのタイトルになると同時に、このタイトルは検索した際ここに反映されます。
「title」はseo対策にも重要な項目なので「title」にサイト名を付けるだけでなく複合のキーワードで打ち込む事をお勧めします。
例えば。。
「東京 ギターレッスン guitarcafe」
のようにサイト名+絞り込みの情報も入れてあげて下さい。
一つの項目の指定だけだと競合他社がいる場合検索の上位にはなかなか食い込めません。
なるべくニッチでlocalな地域情報も入れてあげると絞り込まれて見て欲しいユーザーにリーチする事もできるかもしれません。
それでは、この「title」タグも入れてみましょう。
エンコードの下の行に入れました。
body内とは違ってタグを入れ込む順番は特にありません。
head内であれば自由にタグを配置してください。
次回は「keywords」と「description」についてです。