【簡単!!】Android版chromeのタブの色を変える小技を紹介！
こんにちは。キング・ブログ・スライムです。
今回はブログ運営者向けに、「theme-colorタグ」を使って、アンドロイドスマホのchromeのタブの色を変える方法をざっと紹介したいと思います。
１０分程度で出来ますので、興味のある方は見てください。
一部では導入しているブログ運営者もいるようですね。
「クローム？タブ？」とイメージがつかない方がいると思います。百聞は一見に如かずということで私のスマホをスクショを挙げてみます。
私のサイトは「緑色」がテーマなので、上のタブの色が緑色になっています。因みにデフォルトは灰色です。
色は緑や紫、青などサイトによってさまざまです。サイトの色に合わせて自由に色は選べるので、ご自身の好きなカラーを選ぶことができます。
導入方法
下にコード（meta theme）を掲載しておきます。
<!-- Chrome, Firefox OS and Opera --> <meta name="theme-color" content="#4285f4">
引用元サイト：Icons & Browser Colors
引用元サイトは英語ですので、英語が苦手な方は読まない方がいいかもしれません。
「color browser elements」の見出しから始まる箇所です。
”#4285f4”の箇所はご自身の好きなカラーコードに書き換えてください。
取得したこのコードをヘッダーの<head>~</head>の間に埋め込みます。
ワードプレスの場合は、「テーマヘッダー」の<head>~</head>に挿入すれば大丈夫です。
なお、タブの色を変えることができるのは、android版のchromeだけです。
タブレットのchromeは対応していないものが多く、実質的にはアンドロイドスマホが対象となります。
今のことろiPhone向けのchromeやsafariにはこの機能は使えないようです。導入されれば嬉しいですね。
iPhoneのシェアが大きい日本では、アンドロイド向けにタブの色を変えても大きなインパクトはないといわれるかもしれません。
とは言うものの、実はアンドロイドの国内シェアは３割を超えているので（2016年1月時点）、意外と大きいのではないでしょうか？
導入しても、表示が遅くなるなどの重大な欠点はないですし、導入にも10分ほどでできる簡単なものなので、やって損はありません。
サイトを見ているときにタブの色が変わるので、自分で閲覧している時も楽しくなります(笑)。
ぜひ試してみて下さい！
因みに下は関連記事です。記事を分割したらユーザビリティだけでなく、検索順位が上がったという話です。
king-blog-slime
よろしければどうぞ！
関連記事もどうぞ
