KUBOGENKUBOGENデザインプログラミングマーケティングWordPressプログラミングmeta要素とは?文書におけるメタデータを表す【HTML】meta要素は、メタデータという文書に関する様々な情報を表し、ブラウザや検索エンジンに知らせるためのタグのこと。メタデータには文書の概要やキーワード、文字コードなどがあります。meta要素には、name・http-equiv・charset・itempropなどの属性を指定できます。name属性name属性は、要素に名前をつけてデータの種類を示します。どのようなものがあるか、順番に確認していきたいと思います。ちなみにcontent属性を使って、name属性のメタデータを記述していきます。descriptionは文書の概要を指定するために記述します。検索エンジンのクローラーとよばれるロボットにも読み取られ、検索結果に表示されたり、RSSでコンテンツを配信するときにも配信先サイトで表示されるので指定しておいたほうがいいです。だいたい50〜100文字程度を目安にすればいいかなと思います。keywordsは文書の内容を表すキーワードを指定するためのものです。カンマ(,)区切りで複数のキーワードを記述することができますが、キーワードをむやみやたらに詰め込みすぎないようにしましょう。content=”noindex,nofollow”>name属性にrobotsを指定することによって、検索エンジンのクローラーによるWebページのインデックスをさせなくしたり、Webページ内のリンク先へのリンクジュース(ページの評価)を無効化したりできます。必要な設定ではありますが、インデックスさせたいページなのに、間違えてnoindexを指定してしまったりしてしまわないように気をつけなければいけません。authorは文書の著作者を表すために指定します。個人名や企業、団体名などを記述すればいいと思います。content=”アプリケーション名”>文書がWebアプリケーションを利用している場合、そのアプリケーション名を指定するために使います。generatorでそのツール名もしくはソフトウェア名を指定します。content=”width=device-width,initial-scale=1.0′′>viewportはスマートフォン向けに文書の表示方法を指定するために使います。スマートフォンやタブレット端末などのブラウザは、980pxの幅でWebページを表示しようとするのですが、以下のような値を指定することで、ブラウザでのWebページの表示方法を制御することができます。ちなみにこの属性はもともとiOSのSafariが実装した独自の属性だったんですけど、今では多くのブラウザが対応しています。viewportで設定できるcontent属性の値viewportで設定できるcontent属性の値は以下のようなものがあります。widthheightinitial-scaleuser-scaleminimum-scalemaximum-scalewidth表示する幅を200px〜1000pxの数値で指定することができ、初期値は980pxとなっています。端末の画面の幅を指定するときはdevice-widthを設定します。height表示する高さを223px〜10000pxの数値で指定することができます。端末の画面の高さを指定するときは、device-heightを設定します。initial-scaleWebページが最初に読み込まれたときの拡大・縮小率を指定するもので、初期状態ではWebページを端末画面に合わせるようになっています。指定できる値の範囲はminimum-scaleおよびmaximum-scaleの値の範囲です。user-scale閲覧者にWebページの拡大・縮小を許可するかyes,noで指定することができ、初期値はyesとなっています。minimum-scale許可する拡大率の下限を0〜10の数値で指定することができ、初期値は0.25です。maximum-scale許可する拡大率の上限を0〜10の数値で指定することができ、初期値は1.6です。http-equiv属性http-equiv属性は、文書の処理方法や扱いを指定することができます。使われるものを紹介します。charset=UTF-8′′>文字コードの指定は基本的にこのように記述しますが、その際にcharset属性を使って文字コードを指定します。<title>〜</tile>で日本語を使う場合もあると思うので、<title>タグよりも前に<meta>タグを記述する必要があります。http-equiv=”refresh”>regreshを使って、Webページの更新をしたり、リダイレクトさせたりすることができます。content=”60′′>60秒ごとにページを更新する。URL=kubo.html>30秒でkubo.htmlページへリダイレクト。いった意味になります。ページを閲覧している人の意に反するような強制的な再読み込みなどは避けるべきですし、リダイレクトに関しては、リダイレクト先へのリンクもあわせて表示させる(非対応環境のために)など配慮する必要があります。meta要素まとめmeta要素は基本的にhead要素内に記述するので、直接Webページにコンテンツとして表示されるものではないですが、文書の情報を検索エンジンに伝えるという意味でも、とても重要なものです。他にもキャッシュを制御するものや、文書の記述言語の指定、Cookieの設定、優先スタイルシートの設定などたくさんありますが、よく使うものは覚えておくようにしましょう。*Website次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。KUBOGENサイトマップ。