《Webページ制作のサポートツールです》
 メタタグ(Meta Tag)は、Webページの情報(言語設定や著作者、ページ概要など)を、画面には表示されない形でページ内に埋め込むためのタグです。言語の設定や、著作者、ページ内容の要約など様々な情報を書き込める他、検索エンジン対策[SEO]にキーワードや検索方法の指示なども書くことができます。
 <meta>タグは、必ず、<head> ~ </head> 間に記述します。

  • この『メタタグ自動生成ツール』では、メタタグを簡単に書き出すことができます。
  • ただし、ここにあるメタタグすべてを書く必要はありません。
    むしろ、本文より前に情報を詰め込みすぎると、検索エンジン対策(SEO)に悪影響を与えることもあります。
    実際に必要とされるのは、   文字コード    タイトル    紹介・説明文    キーワード    などの基本的なものだけという意見もあります。
    その他のタグは「全く必要ない」とする専門家もいます。
  • 検索エンジンでの上位表示を目指すための対策(SEO=Search Engine Optimization=検索エンジン最適化)としては、 タイトル    紹介・説明文    は必ず設定し、 キーワード    もできる限り書くようにしましょう。
  • このページは、必要なタグを使いたいと思ったときに、その書き方のヒントが得られるよう、メタタグの一部をまとめたものです。
    ※一部、メタタグ以外の情報も含まれています。

このページの使い方

  • 必要な項目を記入もしくは選択して、ページ最下部の枠に表示されるコードをコピーし、ご自身のHTMLの中にペーストしてください。<meta>タグの場合は、 <head> と </head> の間にペーストしてください。
  • 『ドキュメントタイプ』はページ先頭行に、『HTMLでの言語の明示』は<html>タグそのものの中に書きます。
  • このプログラムで書き出されるメタタグは、一部を除いて「HTML5」に準拠しています。
  • 「meta」「link」「br」などの終了タグを持たない「空要素」は、かつては 「 /> 」 と閉じる形式(例:<br />)が必要でした(XHTMLなど)。
    しかし、HTML5ではスラッシュ(/)は不要となり、単に 「 > 」(例:<br>)で閉じるのが正しい書き方です。
  • たとえば、XHTMLでは <meta charset="utf-8" /> と書いていましたが、HTML5では <meta charset="utf-8"> と記述します。
《設定する項目・目次》
ドキュメントタイプの定義 (DTD)  
言語明示 
<head>タグを書く 
文字コード設定 
言語設定 
ビューポート設定 
タイトル 
紹介・説明文 
キーワード 
OGP 
Thumbnail 
主題 
要約・抜粋 
著作者・制作者 
オーナー 
デザイナー 
出版者 
メールアドレス 
制作日 
著作権表示 
電話番号 
ファクス番号 
国番号 
制作ソフト 
ブラウザ用アイコン 
ナビゲーション start 
ナビゲーション next 
地理的エリア 
タグ適用範囲 
提供対象 
カテゴリ・分類 
Document Class 
対象年齢層 
検索ロボットへの指示 
ロボット保存 NO 
キャッシュ NO 
画像検索 NO 
画像リンク NO 
有効期限 
ロボット再巡回 
秒数指定ページ移動 
ページ再読み込み 
JavaScriptを使う 
CSSを使う 
外部CSS 
外部JavaScript 
Google Chromeで翻訳バーを非表示にする 
Google ニュースに掲載されないようにする 
Google ニュースと Google 検索に掲載されないようにする 
特定の時点の記事を削除するように Google に指示する 
・スマートフォンなどのブラウザーで、電話番号やメールアドレスが自動的にリンクされないようにする設定。
※スマートフォンや iPad などのブラウザーでは、電話番号やそれに似た数字、メールアドレスが自動的にリンクされることがあります。この動作を防ぐ(無効にする)ための設定を行います。
※実際にこのサイト内でも、度量衡のページにある「357.9098」や、免許証のページ     の「500956789012」などに自動的にリンクが張られてしまう現象が確認されました。(これらのページでは「<meta name="format-detection" content="telephone=no">」の設定をしています)
ドキュメントタイプの定義 (DTD)  
  • ドキュメントタイプ(Document Type Definition、<!DOCTYPE>)は、HTMLファイルの先頭行に記述し、そのページで使用しているHTMLのバージョンを宣言します。※これはメタタグではありません。
  • 「HTML5」では、次のように書き出されます:
     <!DOCTYPE html>
  • 「XHTML 1.0 トランジッショナル(Transitional)」を選択した場合、次のように書き出されます。
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    各タイプの詳細については、専門書や Web 上で「ドキュメントタイプ」などのキーワードで検索してお調べください。
 HTMLでの言語の明示  
  • HTMLタグには、lang 属性を使って文書の言語を明示することが推奨されています。<html>タグ内に lang 属性を指定するようにしましょう。
  • 日本語を選択した場合、次のように書き出されます。
    <html lang="ja">
 Charset:文字コード   
  • 文字コードの適切な設定は、文字化けの防止に不可欠です。
  • 現在のウェブ制作では「UTF-8」が国際的にも主流であり、HTML5でも標準的な文字コードとして広く採用されています。
  • 特に日本語を含むページであっても、Shift_JIS や EUC-JP ではなく UTF-8 を使用するのが推奨されます
  • また、Google Maps API をはじめとする多くの外部スクリプトやサービスも UTF-8 を前提としているため、互換性の面でも UTF-8 の使用が望ましいです。
  • HTML5 では、以下のように簡潔に指定します:
     <meta charset="UTF-8">
  • この <meta charset> は、ページ内の <title> タグよりも前に記述する必要があります。これはブラウザが正しく文書の文字コードを認識し、ページ全体を正しく解釈するためです。
    ※Shift_JIS を使用するケースは、レガシーなシステムや制約がある一部の特殊な環境に限られます。
 Language : 言語  
  • Webページで使用する主言語を指定します。これは、ブラウザーや検索エンジンなどがそのページを正しく処理するために役立ちます。
    日本語を選択した場合、次のように書き出されます。
    <meta http-equiv="Content-Language" content="ja">
 Title : タイトル  
  • タイトルはブラウザの最上部に表示され、検索にヒットする重要な要素です。また、ブックマーク登録時の名前にもなります。検索エンジン対策として、ページ内容に合ったタイトルを付け、キーワードとして有効な言葉も含める工夫をしましょう。
  • タイトルに字数制限はありませんが、ブラウザでの表示や検索結果の見栄えを考えると、20文字程度(半角で約40文字)を目安にするのが望ましいようです。
  • 例えば、『みんなの知識 ちょっと便利帳 [メタタグ自動生成ツール]』と入力した場合、次のように書き出されます。
    <title>みんなの知識 ちょっと便利帳 [メタタグ自動生成ツール]</title>
 Description : 紹介・説明文  
  • Webページの内容を簡潔に要約した説明文を記述します。検索エンジンの検索結果に表示されることがあり、クリック率に影響を与える重要な要素のひとつです。
  • 記述する文字数の目安は、全角でおおよそ 100〜120文字程度ですが、検索エンジン側で自動的に調整されるため、重要なキーワードや要点は文頭に含めることが推奨されます
    ※ <meta name="description"> に記載しても、検索エンジンによっては別のテキスト(本文など)が表示されることもあります。
  • 例えば『メタタグ自動生成ツールです。』と入力した場合、次のように書き出されます。

    <meta name="description" content="メタタグ自動生成ツールです。">
 Keywords : キーワード  
  • キーワードは半角カンマ(",")で区切って入力します。
    キーワードは多くても10個程度までにとどめ、本文と関係のない語句や大量のキーワード、同じ語句の繰り返しは避けましょう。検索エンジンにより無効とされる場合があります。
    例として『ちょっと便利帳,メタタグ,自動生成』と入力した場合、次のように書き出されます。
    <meta name="keywords" content="ちょっと便利帳,メタタグ,自動生成">
  • OGPタグを設定する。
  • OGPタグは、FacebookなどのSNSでシェアされた際に、画像を表示したりカード形式で表示するためのタグです。
    クリック率に大きく影響するため、SNSからの流入を期待する場合は必ず設定しておきましょう。
 OGP ページタイトル  
  • 当該ページのタイトルを記述します。
    <meta property="og:title" content="みんなの知識 ちょっと便利帳 HOME">
 OGP ページタイプ  
  • トップページの場合は website または blog、下層ページの場合は article を指定します。
    <meta property="og:type" content="website">
 OGP ページURL  
  • 当該ページのURLを絶対パスで記述します。
    <meta property="og:url" content="https://www.benricho.org">
 OGP ページ概要  
  • 当該ページの概要として表示される説明文を記述します。
    <meta property="og:description" content="「ちょっと便利帳」は便利なサイトです。">
 OGP サイトタイトル  
  • 運営しているサイトの正式名称を記述します。
    <meta property="og:site_name" content="みんなの知識 ちょっと便利帳">
 OGP 画像URL  
  • SNSでシェアされた際に表示される画像を指定します。
  • 画像のURLは絶対パスで記述してください。
  • 画像を設定しない場合は、ページ内の画像から自動的に選ばれて表示される場合があります。
    <meta property="og:image" content="https://www.benricho.org/img/画像.jpg">
 Thumbnail 画像を設置する  
  • thumbnail(サムネイル)画像は、検索結果やSNS、広告ウィジェットなどで表示される画像を指定するためのものです。
  • サムネイル画像の格納先は、絶対パスで指定してください。
    <meta name="thumbnail" content="https://www.benricho.org/img/画像.png">
 JavaScript を使う  
HTML5ではこの指定は必要がありません。
  • HTML4.01以前では、スクリプトに使用する言語を明示するために <meta> タグで次のように指定していました:
    <meta http-equiv="Content-Script-Type" content="text/javascript">
  • しかし、HTML5では <script> タグ内の type="text/javascript" は省略可能であり、通常は <script>だけの記述ですみます。
 CSS を使う  
HTML5ではこの指定は必要がありません。
  • HTML4.01以前では、スタイルシートに使用する言語を明示するために <meta> タグで次のように指定していました:

    <meta http-equiv="Content-Style-Type" content="text/css">

  • しかし、HTML5では <style> タグ内の type="text/css" は省略可能であり、通常は <style> だけの記述ですみます。
 Subject : 主題  
  • このページが何についての内容かを記入します。
  • 上の「紹介・説明文」や下の「要約・抜粋」と重複するような場合は、「紹介・説明文」だけを記入するだけでも構いません。
  • たとえば『メタタグ自動生成ツールです。』と入力した場合、次のように書き出されます。
    <meta name="subject" content="メタタグ自動生成ツールです。">
  • subject メタタグは、ページの主題を明示するために使用されますが、対応していない検索エンジンもあります。SEOに強く関係する項目ではありませんが、内容整理の意味で利用するのは有効です。
 Abstract : 要約・抜粋  
  • 「要約・抜粋」は、「紹介・説明文」とほぼ同じ意味合いで使われることが多く、同じ内容を入れているサイトもあります。
  • ただし、検索エンジンによっては扱いが異なる場合もあるため、記述内容や使用有無は目的に応じて判断してください。
  • たとえば『メタタグ自動生成ツールです。』と入力した場合、次のように書き出されます。
    <meta name="abstract" content="メタタグ自動生成ツールです。">
 Author : 著作者・制作者  
  • Webページの著者や制作者、または運営している会社名などを記入します。
  • たとえば『ちょっと便利帳』と入力した場合、次のように書き出されます。
    <meta name="author" content="ちょっと便利帳">
 Owner : オーナー  
  • Webページの所有者、運営会社名などを記入します。Author と役割を分けて使うこともできます。
  • たとえば『ちょっと便利帳』と入力した場合、次のように書き出されます。
    <meta name="owner" content="ちょっと便利帳">
 Designer : デザイナー  
  • Webサイトのデザインを担当した人や制作会社の名前を記入します。
  • 場合によっては Webmaster の名前を記載することもあります。
  • たとえば『MyName』と入力した場合、次のように書き出されます。
    <meta name="designer" content="MyName">
 Publisher : 出版者  
  • Author や Owner とは別に、資料やコンテンツの出版元として会社名などを記載する場合に使用します。
  • とくに有料資料や発行元が明確な場合に有効です。
  • たとえば『ちょっと便利帳』と入力した場合、次のように書き出されます。
    <meta name="publisher" content="ちょっと便利帳">
 Mail Address : メールアドレス  
  • Webページの作成者や運営会社のEメールアドレスを記入します。記入は必須ではありません。
  • 迷惑メール対策として、「@」マークを「%40」または「&#64;」に置き換えることをおすすめします。
  • たとえば『web***@***.jp』を『web***&#64;***.jp』と入力した場合、次のように書き出されます。
    <link rev="made" href="mailto:web***&#64;***.jp">
 Creation Date : 作成日  
  • ページの制作日を記入します。「2004.11.10」や「November 10, 2004」などの形式で記入します。
  • たとえば『November 10, 2004』と入力した場合、次のように書き出されます。
    <meta name="creation date" content="November 10, 2004">
 Copyright : 著作権表示  
  • AuthorやOwnerと内容が重なる場合もありますが、著作権を強調したい場合や第三者が著作権を保有している場合に記載します。
  • たとえば『Copyright (C) 2014 みんなの知識委員会』と入力した場合、次のように書き出されます。
    <meta name="copyright" content="Copyright (C) 2014 みんなの知識委員会">
 Telephone : 電話番号  
  • 電話番号を記入します。たとえば『000-000-0000』と入力した場合、次のように書き出されます。
    <meta name="tel" scheme="000-000-0000">
Facsimile : ファクス番号  
  • ファクシミリ番号を記入します。たとえば『000-000-0000』と入力した場合、次のように書き出されます。
    <meta name="fax" scheme="000-000-0000">
 Country Code : 国番号  
  • 国番号を記入します。日本は「81」です。
  • たとえば『81』と入力した場合、次のように書き出されます。
    <meta name="country code" scheme="81">  [国際電話番号一覧(Wikipedia)]
 Generator : ページ作成ソフト名  
  • ページを作成したオーサリングソフトなどの名前を記載します。不要な場合は省略しても問題ありません。
  • 一部のソフトはこの情報を自動で書き込むため、削除を推奨する専門家もいます。
  • たとえば『**soft**』と入力した場合、次のように書き出されます。
    <meta name="generator" content="**soft**">
 Favicon : ブラウザ用アイコン  
  • ブラウザのタブやアドレスバーに表示される小さなアイコン(ファビコン)を設定することができます。アイコンファイルをルートディレクトリに「favicon.ico」という名前で保存した場合は、「favicon.ico」と入力してください。他のフォルダに保存した場合は、http:// から始まるURLを記入するのが一般的です。アイコンは別途作成する必要があり、フリーソフトも多数公開されています。『favicon.ico』と入力した場合、次のように出力されます。
    <link rel="shortcut icon" href="favicon.ico">
    なお、このサイトでは左のようなアイコンを使用しています(※一部のブラウザでは表示されません)。
 ナビゲーション用リンク[start]  
  • 検索エンジンに対して、サイト内で最初に訪れてほしいページを示します。通常は、トップページのURLを記入します。『http://www.***.co.jp/』と入力した場合、次のように出力されます。
    <link rel="start" href="http://www.***.co.jp/">
 ナビゲーション用リンク[next]  
  • ページが連続している場合に使用するタグです。「次」のページを検索エンジンに伝えることで、ユーザーの操作に先回りして読み込ませることができます。『http://www.***.co.jp/***.html』と入力した場合、次のように出力されます。
    <link rel="next" href="http://www.***.co.jp/***.html">
 Targeted Geographic Area : 地理的対象エリア  
  • このWebページが対象とする地域を指定します。対象が日本国内であれば「Japan」、アジアであれば「Asia」などを選択してください。『Japan』を選択した場合、次のように出力されます。
    <meta name="Targeted Geographic Area" content="Japan">
 Distribution : メタタグの適用対象範囲  
  • このメタタグが、外部(インターネット)用なのか、内部(イントラネット)用なのかを示します。通常はトップページなどには「Global」、限定的なページには「Local」を使います。『Global』を選択した場合、次のように出力されます。
    <meta name="distribution" content="Global">
 Coverage : サービス提供対象  
  • サイトで提供する商品やサービスの提供範囲を示します。例えば、日本のみなら「Japan」、世界中に提供する場合は「Worldwide」などを選択してください。
    <meta name="coverage" content="Japan">
 Classification : カテゴリ・分類  
  • Webページのカテゴリを指定します。検索エンジンの一部ではこのタグを参考にページを分類します。たとえば「インターネット」と指定すれば、検索エンジン側でそのカテゴリに分類される可能性があります。『インターネット』と入力した場合、次のように出力されます。
    <meta name="classification" content="インターネット">
 Document Class  
  • 文書が完成しているのか、制作中か、出版されているのかなどを記述します。 「Completed」「Draft」「Living Document」「Published」などがあります。
    例えば『Completed』を選択した場合、次のように書き出されます:

     <meta name="doc-class" content="Completed">

    Completed:完成済みの文書。内容は確定しており、これ以上大きな更新予定はない状態です。
    Draft:下書き段階の文書。内容が未確定で、今後修正や追記の可能性があります。
    Living Document:継続的に更新される文書。正式公開後も随時内容が更新される形式です。
    Published:公開された文書。一般に閲覧可能な状態であることを示しますが、必ずしも「完成済み」であるとは限りません。
 Rating : 対象年齢層  
  • 見てもらいたい年齢層を指定します。 すべての年齢層を対象とする場合は、「General」もしくは「All Ages」を選択します。 子ども向けの場合は、「Safe For Kids」または「Child」を設定できます。 例えば『一般』を選択した場合、次のように書き出されます。
    <meta name="rating" content="General">
 Robots : 検索ロボットへの指示  
  • 通常は特に設定の必要はありませんが、検索ロボットにページのインデックス登録とリンクの追跡を促したい場合は、「index,follow」を選びます。
  • 検索ロボットにページを検索させたくない場合は、「noindex,nofollow」を選択してください。 ただし、絶対に有効とは限りません。
  • 『index,follow』を選択した場合、次のように書き出されます。
    <meta name="robots" content="index,follow">
    [指示内容の説明]
    index,follow : すべてのページの検索を許可します。 [all] と同じ意味です。
    index,nofollow : 当該ページのみ検索を許可し、他のページは不許可。
    noindex,nofollow : 当該ページの検索を不許可にし、他のページは許可。
    noindex,nofollow : すべてのページの検索を不許可にします。 [none] と同じ意味です。
 No Archive : 保存させない  
  • 検索ロボットにページを保存(アーカイブ)させないようにします。 頻繁に更新するサイトでは、ロボットが古い情報を残さないようにするために使います。 選択した場合、次のように書き出されます。
    <meta name="robots" content="noarchive">
 Pragma : キャッシュさせない  
  • ブラウザにページをキャッシュさせないようにします。 アクセスする度に最新のページを表示させたい場合に使います。 選択した場合、次のように書き出されます。
    <meta http-equiv="pragma" content="no-cache">
 No Image Index : 画像を検索させない  
  • ページ内の画像を検索対象にしないようにします。 選択した場合、次のように書き出されます。
    <meta name="robots" content="noimageindex">
 No Image Click : 画像へリンクさせない  
  • ページ内の画像への直接リンクを禁止します。 選択した場合、次のように書き出されます。
  • 非公式のため、効果がないことも考えられます。
    <meta name="robots" content="noimageclick">
 Expires : 有効期限  
  • ブラウザのキャッシュを消去する日時を指定します。ただしブラウザによって対応が異なり、必ずしも有効とは限りません。あまり使われないタグです。例として、「Wed, 10 Nov 2004 22:10:30 JST」や「November 10, 2004」などと記入します。『November 10, 2004』と入力した場合、次のように書き出されます。
    <meta name="expires" content="November 10, 2004">
 Revisit-After : ロボット再巡回  
  • 検索ロボットが訪問後、再度何日後に巡回してほしいかを指定します。数字を入力してください。ただし、近年はロボットが頻繁に巡回しているため、設定の必要はほとんどありません。『5』と入力した場合、次のように書き出されます。
    <meta name="revisit-after" content="5 days">
 Refresh : 秒数指定でページ移動
  秒数  
  URL 
  • 指定した秒数の後に自動で別のページに移動させます。
  • 移動までの秒数と移動先URLを入力してください。
    [入力例] 秒数:5 URL:http://www.***.com/ と入力すると、次のように書き出されます。
    <meta http-equiv="refresh" content="5;URL=http://www.***.com/">
    この例は5秒後に移動する設定です。瞬時に移動させる場合は「0」、10秒後に移動させる場合は「10」などと入力します。
 Refresh : 秒数指定で再読み込み  
  • ページを自動的に指定秒数ごとに再読み込みします。スポーツの結果など、リアルタイムに情報を更新したい場合に便利です。秒数を入力してください。『30』と入力した場合、次のように書き出されます。
    <meta http-equiv="refresh" content="30">
 外部CSSを読み込む  
これは、HTML5 以前の記述方法です。
  • 使用するCSSを当該文書の中に書かずに、CSSファイルとして外部に保存した場合、そのファイルを読み込む(リンクさせる)ためのコードです。外部に置いたCSSファイルの拡張子は「***.css」となりますので、読み込むCSSファイル名を「.css」まで入力してください。例えば「css」というフォルダに保存した場合、『css/***.css』と入力すると、次のように書き出されます。
    <link type="text/css" rel="stylesheet" href="css/***.css" />

    ・HTML5では、「type="text/css"」を省略できます。

  • 外部CSSと外部JavaScriptがある場合、外部CSSを読み込むタグをJavaScriptを読み込むタグよりも先に記述すると、ページの表示速度を高速化できます。
    《CSSとJavaScriptの記述順の例》
    <link type="text/css" rel="stylesheet" href="css/test.css" />
    <script type="text/javascript" src="js/test.js"></script>
 外部CSSを読み込む [ HTML5 で]  
  • HTML5での、外部CSSを読み込むための記述方法です。
  • 上記の記述方法から、「type="text/css"」を省略しています。『css/***.css』と入力すると、次のように書き出されます。
    <link rel="stylesheet" href="css/***.css">

  • 外部CSSと外部JavaScriptがある場合、外部CSSを読み込むタグをJavaScriptより先に記述することで、ページの表示速度が向上します。
    《CSSとJavaScriptの記述順の例》
    <link rel="stylesheet" href="css/test.css">
    <script src="js/test.js"></script>
 外部JavaScriptを読み込む  
これは、HTML5 以前の記述方法です。
  • 使用するJavaScriptを当該文書の中に書かずに、JavaScriptファイルとして外部に保存した場合、そのファイルを読み込む(リンクさせる)ためのコードです。外部に置いたJavaScriptファイルの拡張子は「***.js」となりますので、読み込むJavaScriptファイル名を「.js」まで入力してください。例えば「js」というフォルダに保存した場合、『js/***.js』と入力すると、次のように書き出されます。
    <script type="text/javascript" src="js/***.js"></script>

    ・HTML5では、「type="text/javascript"」を省略できます。

  • 外部CSSもある場合、外部CSSを読み込むタグをJavaScriptより先に記述することで、ページの表示速度を高速化できます。
    《CSSとJavaScriptの記述順の例》
    <link type="text/css" rel="stylesheet" href="css/test.css" />
    <script type="text/javascript" src="js/test.js"></script>
 外部JavaScriptを読み込む [ HTML5 で]  
  • HTML5での、外部JavaScriptを読み込むための記述方法です。
  • 上記の記述方法から、「type="text/javascript"」を省略しています。『js/***.js』と入力すると、次のように書き出されます。

  • <script src="js/***.js"></script>

  • 外部CSSもある場合、外部CSSを読み込むタグをJavaScriptより先に記述することで、ページの表示速度を高速化できます。
    《CSSとJavaScriptの記述順の例》
    <link rel="stylesheet" href="css/test.css">
    <script src="js/test.js"></script>
 スマートフォンや iPad などで電話番号にリンクさせない  
  • ページ内に電話番号や電話番号に似た数字(例:357.9098)が記載されていると、スマートフォンや iPad などのブラウザーでは自動的にリンクが作成されることがあります。
  • 電話番号にリンクさせないように設定します。
    <meta name="format-detection" content="telephone=no">
 スマートフォンや iPad などでメールアドレスにリンクさせない  
  • ページ内にメールアドレスが記載されていると、スマートフォンや iPad などのブラウザーでは自動的にリンクが作成されることがあります。
  • メールアドレスにリンクさせないように設定します。
    <meta name="format-detection" content="email=no">
 スマートフォンや iPad などで電話番号・メールアドレス双方にリンクさせない  
  • ページ内に電話番号や電話番号に似た数字(例:357.9098)、メールアドレスが記載されていると、スマートフォンや iPad などのブラウザーでは自動的にリンクが作成されることがあります。
  • 電話番号・メールアドレス双方にリンクさせないように設定します。
    <meta name="format-detection" content="telephone=no,email=no">
 携帯端末でのウェブページの表示方法を制御するビューポートを設定する  
  • ビューポートは携帯端末でのウェブページの表示方法を制御します。
  • ビューポートがない場合、携帯端末は一般的なデスクトップ画面の幅でページをレンダリングします。ビューポートを設定すると、ページの幅やさまざまな端末での拡大縮小を制御できるようになります。
  • なお、このメタタグに「minimum-scale、maximum-scale、user-scalable」などの情報を入れて、ズームを設定したり、ビューポートのズーム機能を完全に無効にしたりできますが、これらはアクセシビリティに悪影響を与えるため、Googleでは推奨されていません。
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
 Google Chrome で翻訳バーを非表示にする  
  • ブラウザーに Google Chrome を使っている場合、設定している言語と異なる言語のページにアクセスすると翻訳ツールバーが表示されることがあります。
  • これを、メタタグで特定のページのみ非表示に設定できます。選択した場合、次のように書き出されます。
    <meta name="google" content="notranslate">

    「Google Chrome」で表示される「翻訳ツールバー」

※このツールバーはブラウザー上の設定でも非表示にできます。
 Google ニュースに掲載されないようにする  
  • サイト内の特定の記事が Google ニュースに掲載されないようにします。
  • このメタタグを書くことにより Googlebot-News によるアクセスをブロックします。選択した場合、次のように書き出されます。
    <meta name="Googlebot-News" content="noindex, nofollow">
 Google ニュースと Google 検索に掲載されないようにする  
  • サイト内の特定の記事が Google ニュースと Google 検索に掲載されないようにします。
  • このメタタグを書くことにより Googlebot によるアクセスをブロックします。選択した場合、次のように書き出されます。
    <meta name="googlebot" content="noindex, nofollow">
 特定の時点の記事を削除するように Google に指示する  
  • 特定の時点で Google のインデックスから記事を削除するように指示します。
  • 削除を指示する年・月・日・時間を指定してください。
  • 該当ページが検索結果に表示されなくなるのは、インデックスから削除されてから約1日後です。ただし、このタグが記事に追加されている必要があります(Googleによる説明)。
    [入力例]  25-Aug-2020 15:00:00 JST   と入力すると、次のように書き出されます。
     JST は日本標準時です。
    <meta name="googlebot" content="unavailable_after: 25-Aug-2020 15:00:00 JST">
    クリックして、
    月の略称をコピーできます。
    1月
    Jan
    2月
    Feb
    3月
    Mar
    4月
    Apr
    5月
    May
    6月
    Jun
    7月
    Jul
    8月
    Aug
    9月
    Sep
    10月
    Oct
    11月
    Nov
    12月
    Dec
 ヘッドタグ <head></head> を書く
  開始;
  終了:
  • メタタグではありませんが、ヘッドタグ(<head></head>)を書き出せます。
  • ドキュメントタイプの定義を設定し、ヘッドの「開始」と「終了」を選択すると、ボディタグ(<body>)の前に書くべきコードを必要な順序で全て書き出せます。


  
スポンサーリンク
スポンサーリンク

スポンサーリンク
Last updated : 2025/08/05
 Copied ! 
 Click to Copy