必要最低限のMETAタグとファビコンの設置

必要最低限のMETAタグ

<title>●●●</title>
<meta name=”keywords” content=”●●●”>
<meta name=”description” content=”●●●”>
<link rel=”icon” href=”./favicon.ico” type=”image/x-icon”>※64×64
<link rel=”apple-touch-icon” href=”image/apple-touch-icon.png” sizes=”180×180″>※180×180

ファビコンの作成には 「 favicon generator 」 が便利です。

ここまでの細分化は必要?

<meta name=”msapplication-TileColor” content=”#2d88ef”>
<meta name=”msapplication-TileImage” content=”/mstile-144×144.png”>
<link rel=”shortcut icon” type=”image/vnd.microsoft.icon” href=”/favicon.ico”>
<link rel=”icon” type=”image/vnd.microsoft.icon” href=”/favicon.ico”>
<link rel=”apple-touch-icon” sizes=”57×57″ href=”/apple-touch-icon-57×57.png”>
<link rel=”apple-touch-icon” sizes=”60×60″ href=”/apple-touch-icon-60×60.png”>
<link rel=”apple-touch-icon” sizes=”72×72″ href=”/apple-touch-icon-72×72.png”>
<link rel=”apple-touch-icon” sizes=”76×76″ href=”/apple-touch-icon-76×76.png”>
<link rel=”apple-touch-icon” sizes=”114×114″ href=”/apple-touch-icon-114×114.png”>
<link rel=”apple-touch-icon” sizes=”120×120″ href=”/apple-touch-icon-120×120.png”>
<link rel=”apple-touch-icon” sizes=”144×144″ href=”/apple-touch-icon-144×144.png”>
<link rel=”apple-touch-icon” sizes=”152×152″ href=”/apple-touch-icon-152×152.png”>
<link rel=”apple-touch-icon” sizes=”180×180″ href=”/apple-touch-icon-180×180.png”>
<link rel=”icon” type=”image/png” sizes=”36×36″ href=”/android-chrome-36×36.png”>
<link rel=”icon” type=”image/png” sizes=”48×48″ href=”/android-chrome-48×48.png”>
<link rel=”icon” type=”image/png” sizes=”72×72″ href=”/android-chrome-72×72.png”>
<link rel=”icon” type=”image/png” sizes=”96×96″ href=”/android-chrome-96×96.png”>
<link rel=”icon” type=”image/png” sizes=”128×128″ href=”/android-chrome-128×128.png”>
<link rel=”icon” type=”image/png” sizes=”144×144″ href=”/android-chrome-144×144.png”>
<link rel=”icon” type=”image/png” sizes=”152×152″ href=”/android-chrome-152×152.png”>
<link rel=”icon” type=”image/png” sizes=”192×192″ href=”/android-chrome-192×192.png”>
<link rel=”icon” type=”image/png” sizes=”256×256″ href=”/android-chrome-256×256.png”>
<link rel=”icon” type=”image/png” sizes=”384×384″ href=”/android-chrome-384×384.png”>
<link rel=”icon” type=”image/png” sizes=”512×512″ href=”/android-chrome-512×512.png”>
<link rel=”icon” type=”image/png” sizes=”36×36″ href=”/icon-36×36.png”>
<link rel=”icon” type=”image/png” sizes=”48×48″ href=”/icon-48×48.png”>
<link rel=”icon” type=”image/png” sizes=”72×72″ href=”/icon-72×72.png”>
<link rel=”icon” type=”image/png” sizes=”96×96″ href=”/icon-96×96.png”>
<link rel=”icon” type=”image/png” sizes=”128×128″ href=”/icon-128×128.png”>
<link rel=”icon” type=”image/png” sizes=”144×144″ href=”/icon-144×144.png”>
<link rel=”icon” type=”image/png” sizes=”152×152″ href=”/icon-152×152.png”>
<link rel=”icon” type=”image/png” sizes=”160×160″ href=”/icon-160×160.png”>
<link rel=”icon” type=”image/png” sizes=”192×192″ href=”/icon-192×192.png”>
<link rel=”icon” type=”image/png” sizes=”196×196″ href=”/icon-196×196.png”>
<link rel=”icon” type=”image/png” sizes=”256×256″ href=”/icon-256×256.png”>
<link rel=”icon” type=”image/png” sizes=”384×384″ href=”/icon-384×384.png”>
<link rel=”icon” type=”image/png” sizes=”512×512″ href=”/icon-512×512.png”>
<link rel=”icon” type=”image/png” sizes=”16×16″ href=”/icon-16×16.png”>
<link rel=”icon” type=”image/png” sizes=”24×24″ href=”/icon-24×24.png”>
<link rel=”icon” type=”image/png” sizes=”32×32″ href=”/icon-32×32.png”>
<link rel=”manifest” href=”/manifest.json”>

コメント

タイトルとURLをコピーしました