【これはスゴい】グーグル流ログインフォームの最適化テクニック集【SEO情報まとめ】
すべてのWeb担当者が読んで学んで絶対に損がない情報がでてきた。グーグルが公開した、サインイン(ログイン)用フォームのベストプラクティスを詳細に解説する記事だ。
SEOに直接関係する話題ではないが、UX改善のベストプラクティスとして(新しいHTML技術の情報も含めて)非常に有用だ。少しでも多くの人に教えたい。
ほかにも、今回はおもしろいネタが多い。GoogleのSERPでのタイトル書き換えを回避する超効果的な対策や、ソーシャルメディア活用ノウハウ、ラスタ画像からSVG生成などなど、あなたのサイト運営やSEOに役立つ情報を、今週もまとめてお届けする。
- グーグルSERPでのタイトル書き換えは6割も!? 負け組titleタグ6つの特徴と超効果的な対策とは?
- ページの中身を変えず日付だけ新しくすればSEO効果ありますよね?
- 「iframe埋め込み時だけインデックス可」indexifembeddedタグがrobotsタグに仲間入り
- サイト管理者向けのセーフサーチ解説をグーグルが公開
- あなたの良記事をソーシャルメディアでシェアさせるコツ×9
- Googleマップの不正な口コミを防ぐ3段階のバリア
- 歓喜するサイト管理者続出? URL Inspection APIをグーグルがリリース
- グーグル製画像最適化ツールのSquooshをサーバーサイドで実行する方法
- SVGcodeで変換できるSVG画像の長所と短所とは?
- ファーストビューにCTA要素を設置するとSEOにマイナスなのか?
- Google、ジャーニー機能をChromeに追加。関連する一連のウェブ閲覧をグループ化して履歴表示
今週のピックアップ
【これはスゴい】グーグル流ログインフォームの最適化テクニック集
どんなフォームでも使えるテクニック満載 (web.dev) 国内情報
すべてのWeb担当者が読んで学んで絶対に損がない情報がでてきた。SEOとは直接は関係ないが、UX改善のベストプラクティスとしてぜひ知っておきたい情報だ。
それは、グーグルが公開した、サインイン(ログイン)用フォームのベストプラクティスを詳細に解説する記事だ。英語版は2020年6月に公開されていたが、日本語訳が最近出た。
日本語訳が出ました。ぜひ参考にしてください。 // サインインフォームのベストプラクティス: https://t.co/n2X7Owa0sT
— Eiji Kitamura / えーじ (@agektmr) February 7, 2022
グーグル推奨のベストプラクティスは、次のようなセクションで構成される:
- 用途がはっきりした HTML を使用する
- 要素の属性を最大限に活用する
- パスワードは非公開にするが、必要に応じてユーザーが見られるようにする
- モバイルユーザーに適切なキーボードを提供する
- 指と親指のデザイン
- 必要に応じて JavaScript を使用する
- 一般的なガイドライン
ログインフォームを利用しているサイトのウェブ担当者は必読だ。ユーザー体験の向上に確実に役立つ。いや、ログインフォームがないサイトの担当者もぜひ詳細にチェックしてほしい。ここで紹介されているベストプラクティスは、ログインフォームに限らずにどんなフォームでも参考になるものが多く含まれている。
さらっと紹介してしまったが、非常に価値の高い情報だ。良いUXを提供するための必須知識として、ぜひとも参考にしたい。また、デザイナーやフロントエンドに携わる周囲の人にもぜひ教えてあげてほしい。
- フォームを利用しているすべてのWeb担当者 必見!
- 技術がわかる人に伝えましょう
グーグル検索SEO情報
グーグルSERPでのタイトル書き換えは6割も!? 負け組titleタグ6つの特徴と超効果的な対策とは?
書き換えが発生しやすいタイトルの特徴は? (Zyppy) 海外情報
- 検索結果にグーグルが書き換えた
title
タグが表示されていたのは61.6% - 書き換えが起きやすい
title
タグには6つの特徴がある - ユーザーの目に見える
h1
タグをtitle
タグと同じにすれば、書き換えを劇的に減らせる
SEO業界の有名人であるCyrus Shepard(サイラス・シェパード)氏が、
- グーグルの検索結果に表示されるタイトル(「タイトルリンク」と呼ぶ)
- サイトの
title
タグ
の内容を調査した結果を、経営する会社Zyppy(ジッピー)のサイトで公開した。
シェパード氏によると、調査対象の61.6%において、HTMLの title
要素(タグ)と異なるタイトルリンクが検索結果に表示されていたとのことだ。言い換えれば、タイトルリンクに title
タグを使っていたのは40%に満たないということになる。
グーグルは、タイトルリンク生成のアルゴリズムを2021年8月に大幅アップデートした。しかし「書き換えすぎではないか」というフィードバックがあったからか、9月に一部改良している。グーグルによれば、title
タグをタイトルリンクにそのまま用いる率は87%とのことだった(つまり書き換えは13%)。
HTMLのtitleタグと異なるタイトルリンクが検索結果に使われている率は、グーグルの説明とシェパード氏の調査結果でかなり開きがある:
- グーグル: 13%
- シェパード氏: 61.6%
グーグルが検索結果に表示する全ページ数からすれば、シェパード氏が調査したページはごくごく一部に過ぎない(調査対象は2,370サイトの80,959ページ)。そのため、シェパード氏の報告をもって「グーグルが嘘を言っている」となるわけではない。
とは言うものの、実際の検索結果において、意図していたものと異なるタイトルリンクで自分のサイトが表示されて困っている人は、「書き換え率はどうでもいいから何とかしてくれ」という気持ちだろう。
シェパード氏は、書き換えが発生する title タグの特徴として、次のような点を挙げている:
- 長すぎる、または短すぎる
- 同じキーワードを2回以上使っている
- 「-」(ハイフン)や「|」(パイプ)などの区切り記号を使っている
- () や [] などの括弧類を使っている
- 多くのページで同じ定型文を使っている
- ブランド名(サイト名や社名)が、まったくないか、必要以上に使っている
これらを避けることで、title タグの書き換えをある程度は防げるかもしれない。
そのうえでシェパード氏は、タイトルリンクの書き換えにつながりやすい3つの点について分析している:
titleタグは何文字ぐらいが書き換えられにくいか
書き換え率が高くならないのは51文字~60文字程度だった。titleタグの文字数は、多すぎても少なすぎても書き換えにつながる。
強調するために使うなら角括弧と丸括弧のどちらが書き換えられにくいか
強調する場合は、角括弧
[]
よりも丸括弧()
のほうが書き換えが起きにくい。角括弧を使っている場合、77.6%で書き換えが発生していて、32.9%で角括弧とその中身を削除してタイトルリンクを生成していた。
丸括弧でも同様の書き換えが発生するが、書き換え率は61.9%で、削除率は19.7%だった。
区切り文字は何を使うと書き換えられにくいか
titleタグ内でページのタイトルとカテゴリやサイト名の区切りに使う場合は、パイプ(|)よりもハイフン系(- – —)のほうが書き換えが起きにくい。
ハイフン系では書き換え率が19.7%だったが、パイプでは41.0%にも上ったということだ。
この3点に注意すること加えて効果的なもう1つの対策として、シェパード氏は h1 要素(タグ)の記述 にも触れている。
それは、見出し要素の h1
タグを title
タグとそろえることだ。
更新後のタイトルリンク生成アルゴリズムは、ページ上で見出しとみなせる要素をタイトルリンクに以前よりも積極的に使うようになっている。ユーザーの目に見えるタイトルと検索結果で見えるタイトルを一致させるほうがユーザーに親切だと考えるからだ(通常、title
タグはページには表示されない)。
そこで、見出し要素の h1
タグを title
タグとそろえるのだ。そうすれば、h1
タグがタイトルリンクに使われても title
タグと同じ内容なので問題ない。
シェパード氏によれば、h1
タグを title
タグを同じにすることで、グーグルによる書き換えを劇的に減らすことができるそうだ。
- SEOがんばってる人用(ふつうの人は気にしなくていい)
ページの中身を変えず日付だけ新しくすればSEO効果ありますよね?
無意味 (John Mueller on Twitter) 海外情報
記事公開日の日付の設定について、グーグルのジョン・ミューラー氏に次のように質問した人がいた:
順位を上げて検索トラフィックを増やすために、既存のブログ記事の公開日を更新するのは良いやり方でしょうか? それとも悪い影響が出ることがありますか?
ミューラー氏は次のように返した:
新しい記事を書いたりすでにあるものを大幅に更新したりするのであれば、そのときは日付を変えたほうがいい。
そうでないのに日付だけを変えるのは、不要なことだし意味がない。
When you write something new, or siginificantly change something existing, then change the date. Changing the date without doing anything else is just noise & useless.
— 🐐 John 🐐 (@JohnMu) February 5, 2022
ミューラー氏の指摘はもっともだ。中身がほとんど変わっていないのに日付だけを新しくしても、ランキングが上がるはずがない。検索結果のスニペットにコンテンツ公開日が表示されることがあるが、これは、必ずしもページに書かれている日付で決まるわけではない。
そもそも、日付だけを新しくするのは、検索エンジンだけでなくユーザーを騙しているも同然だ。無意味どころか、度が過ぎればスパムにさえなってしまうだろう。
- SEOがんばってる人用(ふつうの人は気にしなくていい)
「iframe埋め込み時だけインデックス可」indexifembeddedタグがrobotsタグに仲間入り
使い道がわからなくても問題なし? (グーグル 検索セントラル ブログ) 国内情報
新しい robots タグとして indexifembedded
タグをグーグルが導入した。
indexifembedded
は「index if embedded」(埋め込みされていたらインデックス)というものなのだが、このタグの働きは少々ややこしい。しかも、利用するサイトはかなり限られてくるだろう。
基本的にnoindex指定と同時に使うもので、ページや動画や音声などのコンテンツを、検索エンジンが次のように扱うことを指示するものだ:
- そのコンテンツ自体のURLへのアクセスの場合: インデックス禁止
※同時に指定しているnoindex指示のみ有効 - 他のページにiframeなどで埋め込まれている場合: そのページの一部としてインデックス
※indexifembedded指定がnoindex指示を上書き
iframe
タグや object
タグなどで別のページを埋め込んでいる場合、埋め込み元ページに noindex
が設定されていると、埋め込み先ページでも埋め込んだ内容はインデックスされない。しかし、埋め込み元ページに(noindex
とともに)indexifembedded
タグを設定すると、埋め込み先ページ内のコンテンツとしてインデックス対象になる。
robots meta
タグで設定するときは次のように記述する:
<meta name="googlebot" content="noindex" >
<meta name="googlebot" content="indexifembedded" >
noindex
と indexifembedded
をまとめて書いてもいい:
<meta name="googlebot" content="noindex,indexifembedded" >
これが便利なシーンを思いつかない人が大半だろう。たとえば、動画やポッドキャストなどを配信しているサイトで、「自分のサイトではそうしたコンテンツをインデックスさせたくないので noindex
を設定しているが、別のサイトで埋め込まれた場合はインデックスしてもらいたい」という要望があるのだそうだ。そうした要望を叶えるために indexifembedded
タグをグーグルは導入した。
同じような要望を抱えていたとしたら、indexifembedded
タグは待ち望んでいた機能になる(が、大多数のサイトでは利用機会はないだろう)。
このrobots metaタグをサポートしている検索エンジンはグーグルだけのようだ。
- ホントにSEOを極めたい人だけ
サイト管理者向けのセーフサーチ解説をグーグルが公開
アダルトコンテンツをグーグルに的確に伝える方法の説明あり (グーグル検索セントラル) 国内情報
露骨な表現を含むコンテンツを検索結果から除外する「セーフサーチ」をサイト管理者向けに説明するドキュメントを、グーグルが検索セントラルサイトに公開した。一般ユーザー向けにセーフサーチを説明するヘルプページは以前からあるが、こちらはサイト管理者向けだ。
複数のドキュメントに散在していたセーフサーチに関する情報をこのドキュメントに集約し、新たな情報も追加した形だ。
ヌードなどの露骨なコンテンツを公開しているサイトの管理者は、セーフサーチ向けにサイトを最適化する方法をしっかり読んでおくことを推奨する。露骨なコンテンツを含んでいるページをグーグルにサイト側から伝えることで、そうではないページが誤認されるのを防げる。
「自分のサイトには関係ない」と思う人が多いだろう。しかし、アダルト向けのコンテンツではないと思っていてもセーフサーチの対象になることがある。グーグルは次のように説明している:
ヌードを掲載している場合は、どのような理由があるにせよ(たとえ医療処置を説明する目的であっても)、掲載の意図によってそのコンテンツの露骨さが解消されるわけではないことをご理解ください
セーフサーチ フィルタに予期せず引っかかってしまった場合もこのドキュメントを参照するといい。
- アダルトコンテンツを配信しているすべてのWeb担当者 必見!
ソーシャルもやってます!