グーグル社員がため息をつくリンクの構成方法

Web担当者に役立つ最新情報

グーグル社員がため息をつくリンクの構成方法
aタグとhref属性を使わないやり方 （Martin Splitt on Twitter） 海外情報

ページ内のテキストから別ページへリンクするときにどんなHTML要素を利用するかをツイッターでアンケートしたユーザーがいた。

• ボタン
• アンカー
• Div
• その他

いちばん多かったのはアンカー、つまりaタグのことだ。もっともな結果であろう。だが、リンクするときにその他のHTML要素を利用するウェブデザイナーが少数とはいえ存在する。

この結果を知ったグーグルのマーティン・スプリット氏が（おそらくため息交じりに）苦言を呈した。

リンクには、アンカー（aタグ）でURLを含んだhref属性を使う必要がある。これは、SEOとアクセシビリティのためだ。

それ以外の手段をリンクに使うという回答が、アンケートで少数とはいえ存在している。これが、僕らが今でも「リンクはa要素で」と話さなきゃいけない理由だ。

スプリット氏がなぜぼやいたのかわかるだろうか？ そこには次の2つのポイントがある：

• Googlebotは検索に有効なリンクとして処理するのは、aタグのhref属性に指定したURLだけ。ボタンやdivタグなどそのほかの手段を使ったリンクをGooglebotは認識しない（特にユーザーのクリックなどの動作が必要なJavaScript処理）。

• アクセシビリティの観点からもaタグを用いないリンクは問題を生ずることがある（音声読み上げブラウザなどが正しくリンクを認識できない場合がある）。

にもかかわらず、aタグとhref属性を使わないやり方でリンクする人が存在するのだ。

グーグルの検索チームが先日公開したWebmaster Conferenceライトニングトークでも、リンクの構成に関してスプリット氏は次のように説明していた。

• JavaScriptでリンクを生成する場合でも a タグと href 属性を必ず使う
• ページのコンテンツが変化する場合はURLに#（フラグメント）を使用しない

SEOを意識しない開発者はaタグを使わずにリンクを構成することがありがちなのだろう。あなたのサイトでは気を付けてほしい。

グーグルがgTLDとして扱う19種のccTLDはこれだ！
.ggドメインはガーンジー島？それともgTLD？ （John on Twitter） 海外情報

英仏海峡にあるイギリスの王室属領・ガーンジー島にはドメイン名として .gg が割り当てられている。.gg は国別コードトップレベルドメイン（ccTLD）だ。

.gg ドメイン名をグーグルが、本来のとおりccTLDとして扱うのかそれともジェネリック トップレベル ドメイン（gTLD）として扱うのかをツイッターでジョン・ミューラー氏が質問された。

というのも、一部のccTLDをグーグルはgTLDとして扱うからだ。

ミューラー氏は、参照先としてヘルプページを示した。グーグルがgTLDとして扱うccTLDがリストアップしてある。

現状では次の19種類のccTLDがgTLD扱いになる：

• .ad
• .as
• .bz
• .cc
• .cd
• .co
• .dj
• .fm
• .io
• .la
• .me
• .ms
• .nu
• .sc
• .sr
• .su
• .tv
• .tk
• .ws

.gg ドメイン名はここに含まれていない。したがって、（現状では）グーグルは .gg ドメイン名を使ったサイトをガーンジー島と結び付きが強いと認識する。Search Consoleのインターナショナル ターゲティング レポートで国を指定することはできないはずだ。

また、ミューラー氏は新しいトップレベルドメイン名の扱いについても言及している。たとえば、.travel や .web といったドメイン名だ。新しいトップレベルドメイン名をグーグルはgTLDとして扱う。.tokyo や .london のように一見すると都市に割り当てられているように見えるドメイン名にもこれは当てはまる。

なお、こうした新しいgTLDが検索で有利になることはない。たとえ旅行代理店サイトが .travel ドメイン名を使ったとしてもだ。

テキストの強調にはフォントのカラーと強弱が役立つ
UX向上はSEOにも大切 （Addy Osmani on Twitter） 海外情報

グーグルのアディ・オスマニ氏による、ウェブページのデザイン（見せ方・メリハリの付け方）に関するTIPSのツイートを紹介する。SEOとはまったく関係ない話題だが、UXの観点で知っておいてほしいトピックだ。

特定のテキストを強調したい場合は、必ずしもフォントサイズ（font-size）を変えるのが良い方法とは限らない。代わりに、文字の色（color）と太さ（font-weight）を試してみるといい。

こちらは、ツイッターのプロフィールカードを例にした比較サンプルの拡大画像だ。

前提としては、次の意図がある：

• 強調したい：
  • 名前（Steve Schoger）
  • カード下の「フォロワー」「フォロー中」「いいね」の数字
• 弱く見せたい：
  • スクリーンネーム名（@steveschoger）
  • 所在地（Kitchener, Ontario）
  • カード下の「フォロワー」「フォロー中」「いいね」の見出し

左側のデザインでは、強調したい部分の文字サイズをぐぐっと大きくして、弱く見せたい部分の文字サイズを小さくしている。

右側のデザインでは、文字サイズは少しずつ変えているがさほど劇的には変えていない。その代わりに、強調したい部分を太字にして（font-weight: bold;）、弱く見せたい部分の文字色を薄くしている（color: hsl(214, 7%, 47%);）。

メリハリ（コントラスト）という観点では、右側のほうが見やすいだろうという解説だ。

視覚的に見やすいデザインはユーザー体験の向上につながる。SEOに直接影響しなかったとしても、すぐれたユーザー体験を提供することは現代のSEOでは重要なことだ。参考にしよう。

ECサイトで使ってみたい、検索トレンドを調査するツールが日本に対応
日本語名は「リテール版トレンドクエリ」 （Think with Google） 国内情報

グーグルが提供を開始した、ECサイト向けのグーグルトレンドのようなツール「Rising Retail Categories（ライジング リテール カテゴリ）」を1か月ほど前にこのコラムで紹介した。ユーザーが検索している商品の傾向を調べることに役立つ。

紹介したときは日本のデータは提供されていなかったのだが、日本の検索データにも対応した。日本語のツール名は「リテール版トレンドクエリ」だ。

今は「携帯型小型扇風機」と「パーティーストリーマー・カーテン」の検索数が現在は急上昇しているようだ（蛇足だが「パーティーストリーマー・カーテン」なるものを筆者は初めて耳にした。七夕の飾り付けに使うらしい。インスタ映えする写真を撮るため？）。

自社ECサイトで取り扱えるアイテムの検索数が伸びていたら特集でも組んでみてはどうだろうか。

AMPのウェブストーリーを使ってタイ国が観光誘致
コメント （PR TIMES） 国内情報

トラベルブックがタイ国政府観光庁とタイアップしウェブ広告を配信している。特筆すべきは、AMPを活用した技術であるWeb Stories（ウェブ ストーリー）をフォーマットとして採用している点だ。

ウェブ ストーリーは、以前のAMPストーリーだ（名称を変更した）。写真や動画といったビジュアル要素をふんだんに用いて、視覚に訴えるかたちで、物語を読むように一連のコンテンツを展開していくのが特徴である。

ウェブ ストーリーはAMP HTML をベースに作られており、ブラウザがあれば表示できる。専用アプリは必要ない。スマホでもPCでもタブレットでも閲覧可能だ。広告に利用すれば幅広いユーザーにリーチできそうだ。

ウェブ ストーリーで配信する広告は国内初とのことである。美しい画像で構成されており、タイ旅行に行きたくなる。

海外SEO情報ブログの
掲載記事からピックアップ

グーグル社員が配信するポッドキャストと、SafariのWebPサポートについての記事をピックアップ。

• 『Search Off the Record』――3人のGoogle社員が始めたSEOポッドキャスト

  最近話題になっているSEOトピックを3人のグーグル社員がトークする。

  ★★★★☆

  • すべてのWeb担当者 必見！
• ついにSafariが画像フォーマットとしてWebPをサポート

  本当にサポートしたら将来的にはWebPが画像フォーマットの標準に？

  ★★★★☆

  • SEOがんばってる人用（ふつうの人は気にしなくていい）