タグ別アーカイブ: コード

metaタグ

押さえておきたい<metaタグ>について

はじめまして。
TRENSYS新入りデザイナーのあゆみんです。

現在WEBページを制作するにあたっての
HTMLとCSSというのを勉強しています。

ここでは勉強したことやその他にも様々なことを
日々綴っていきたいと思います。

今日は、HTMLのHEAD内に記述する
meta というタグについて紹介します。

metaタグとはHTML文書の内容ではなくHTML文書そのものの情報を
ブラウザや検索ロボットに知らせるためのものです。

metaタグに書くことのできる属性

  • charset=””
    文字コードを指定
  • http-equiv=””
    httpヘッダ名を指定
  • neme=””
    名前の指定
  • content=””
    内容を指定
  • scheme=””
    詳細を指定

metaタグに記述できる情報の代表的なものの一覧

  1. 文字コードの指定
    <meta charset="UTF-8">
  2. 標準で使うスタイルシートの書類
    <meta http-equiv="content-style-type" content="text/css">
    <meta http-equiv="content-script-type" content="text/javascript">

    HTML5では標準になるので書かなくてOK

  3. ユーザーエージェントの指定
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

    ユーザーエージエントとは
    ユーザーが使用するブラウザのバージョンを
    サーバ側が判断してそれに合った文書を送ること
    “IE=edge”はIEでは常に最新のバージョンを指定する
    “chrome=1″はクロームフレームを有効にする指定

  4. クリアタイプ オン/オフの指定
    <meta http-equiv="cleartype" content="on">

    クリアタイプオンで表示されるフォントの縁の
    ギザギザをなおしてくれる
    あまり効かないようだがたまに効くらしい

  5. フォーマットディレクションの指定
    <meta name="format-detection" content="telephone=no,address=no,email=no">

    電話番号やメールアドレスをリンクにさせることができる

  6. ビューポートの指定
    <meta name="viewport" content="width=device-width">

    レスポンシブサイトを制作する場合はこれを書く

  7. 検索ロボットの動きを制御する
    <meta name="robots" content="noindex,nofollow,noarchive">

    index=表示している語句
    follow=リンク先の情報
    archive=グーグル検索アーカイブにデータを保存

  8. 提供範囲の指定
    <meta name="coverage" content="worldwide,asia,japan">
    
  9. 作成・更新日時の指定
    <meta name="date" content="2015-01-01T00:00:00+09:00">

    書式通りに記述

  10. 作成日時の指定
    <meta name="creation_date" content="January 01, 2015 00:00:00">
  11. 著作権情報の指定
    <meta name="author" content="著作権情報">
  12. 対象年齢の指定
    <meta name="rating" content="general">

    日本国外ではかなり重要
    “general”で一般向け

  13. ジャンルの指定
    <meta name="classification" content="general">
  14. ページの詳細を記述
    <meta name="description" content="ページ詳細">

    以前では検索画面のページタイトルの下に表示された
    最大64文字くらい

  15. キーワードの設定
    <meta name="keywords" content="キーワード">

以上が代表的で実用的と言えるmetaタグです。

SEO対策の為に、
descriptionやkeywordsを設定しても
実際はあまり意味がありません。
検索の優先順位を上げる為には
‘書類に間違いがないようにする’
ということが大切です。