URLの#（シャープ）から後の部分の名称＝「ハッシュ」「フラグメント」「ページ内リンクアンカー」と，SEO対策上の重要性

Webページにおいて，URLの「＃」記号よりも後ろの部分のことを，URLのハッシュという。

URLのハッシュには，呼び方がいくつかある。

呼び方の使い分けの一覧：

ふつうにWebページ制作をする時の呼び方（Ajax/Pjaxとは無関係）：

URLフラグメント

URLのハッシュ値

ページ内アンカー，ページ内ジャンプ，ページ内リンク

location.hash

ネームアンカー

アンカーポイント

フラグメント識別子，素片識別子

（単に）アンカー，アンカー名

Google検索結果画面の１行サイトリンク

Ajax/Pjax用語：

ハッシュフラグメント

#!（hashbang）

SNS用語：

ハッシュタグSEO（これは似ているが，URLとは関係ない）

技術用語として正式に表現する場合は，「URLフラグメント」が多い。

DOMの文脈だったり，JavaScriptでコーディングする場合は「ハッシュ」と俗に呼ぶ。

HTMLの使用を語る時の，正式な技術用語：

a 要素 - HTML | MDN
https://developer.mozilla.org/ja/docs...

href これは、ハイパーリンクのソースを定義するアンカー要素で唯一必須の属性です。これは、リンク対象を示し、URL または URL フラグメントです。この URL フラグメントは、ハッシュ記号 (#) で始まり、現在のドキュメント内のリンク先位置 (ID) を指定します。

フラグメント識別子
http://wiki.suikawiki.org/n/%E3%83%95...

素片識別子fragment identifierは、 URL の一部分であり、素片識別子以外の部分により識別される資源の一部分、あるいは表現の一種を識別するために使われます

俗称: DOM では、素片識別子を表す属性名として「hash」 を使っています。これは、素片識別子の先頭を表す文字「#」の俗称に由来しています。

特に HTML 文書の素片識別子については、「アンカー」や「アンカー名」と呼ばれることもあります。日本語訳: 「素片識別子」 (fragment identifier) は、フラグメント識別子、断片識別子などとも訳されます。

JavaScript:URLのハッシュ(#)以降を削除する - Dr.ウーパのコンピュータ備忘録
http://upa-pc.blogspot.jp/2014/05/jav...

location.href では、URL にハッシュ(#)が含まれている場合には、ハッシュを含んだものを取得します。

URLの#(ハッシュ)変更時にイベントをつける！jQuery hashchange eventプラグイン | あらかぜ手帖
http://arakaze.ready.jp/archives/1029

$(window).hashchange( function(){ 7 // ここにハッシュが変更されたときに動かしたいイベントを書きます。

JavaScript：ＵＲＬのハッシュ値を取得する – location.hash | ベリーグッドノート
http://blog2.elephantech.net/it/javas...

location.hash でＵＲＬのハッシュ値を取得することができます。 URLが http://www.example.com/#id=test の場合は、ハッシュ値は #id=test

HTMLを重視する呼び方だと，アンカーポイントとか，ネームアンカー，

ページ内リンク，ページ内アンカーなどと呼ばれる。

HTML:別ページのアンカーポイントへのリンク｜メモ帳
http://ameblo.jp/gachagachapinpinpin/...

nameとidが両方あるのはidに移行途中だから。いずれnameは使えなくなるけど、古いブラウザはid属性をアンカーとして認識しないから、しばらくはidとname両方書いとくのがいい

[JS]ページ内アンカーをidだけでなくclassや要素にも指定できるスクリプト -Arbitrary anchors | コリス
http://coliss.com/articles/build-webs...

ページ内アンカーは通常、要素のidを指定して#（ハッシュ）リンクで遷移させますが、idの指定以外にclassやpやfooterなどにも遷移することができます。

ページ内ジャンプ HTML ＜a＞
http://www.shoshinsha.com/hp/ref/html...

縦に長い文章量の多いページでも、ページ内リンクを作るっておくと便利

HTMLタグ・CSS｜HTML辞典｜ページ内リンク＜a name="位置の名前"＞
http://hp-sozai.net/html_a_name.html

ページ内リンク

Ajax/Pjaxの文脈だと，「ハッシュ」「フラグメント」「ハッシュフラグメント」が通称。

TwitterやFacebookのURLには、なぜ#!が含まれるのか (SEOとAjaxのおいしい関係) - kazuhoのメモ置き場
http://d.hatena.ne.jp/kazuhooku/20101...

hash fragmentはサーバに送信されないから、JavaScript非対応のブラウザだと動作しない

AjaxよりもSEOに期待大！pjaxをマスターしよう！ | Web制作会社スタイル
http://www.hp-stylelink.com/news/2013...

Ajaxは一つのページ、一つのURLの中でページ移行をせずに、コンテンツの一部だけを書き換えますので、URLが変えられません。なので、画面ごとに個別のURLを割り振りたい時はハッシュ（URLの後ろの#〜）を付けて処理する方法がとられてました

しかしその方法ではURLとして正しくないので検索エンジンにインデックスされなかったり、アクセス解析ツールの数字が正しく反映されなかったりという問題があります。

pushStateとは / pushStateとはHTML5から導入されたHistory API（javascriptのhistoryオブジェクトのメソッド）です。実際にページ移行をせずにjavascriptでブラウザにURLの履歴を追加することができます。しかし擬似的にURLを変えるだけなので「戻る」ボタンを押しても画面は切り替わりません。基本的には「戻る」ボタンが押された時に発生するイベントを取得する関数popstateと組み合わせて使います。

pjaxのメリット

さて，この「URLのハッシュ」についてだが，WebサイトのSEOに影響するのだろうか？

最近では，ハッシュフラグメントもGoogleによってクロールされる流れになってきているので，影響はあるというのが正解だ。

“#”が付いたAjaxのURLをそのままGoogleがインデックスし始めた？ | 海外SEO情報ブログ
http://www.suzukikenichi.com/blog/goo...

ページ内の特定の場所に直接リンクするネームアンカーの“#”が付いた通常のURLをGoogleはインデックスし、検索結果に表示することがあることは確かなようです。

なぜWebサイトのURLに”#!”を付けるのか？クローラーはインデックス可能なのか？について。 | ohsexybabyのWebログ
http://ohsexybaby.com/web/843/

・”#”は、Ajaxアプリケーションとして、画面遷移ではなくページ内遷移をするため。・”!”は、”#”とセットにして、Googleクローラーにクロール可能なAjaxアプリと認識させるため。

Ajaxページでは“#”（ハッシュ）よりも“pushState”を使ったほうがGoogleのSEOに楽かも | 海外SEO情報ブログ
http://www.suzukikenichi.com/blog/pus...

一般的に、Ajaxを使ったページではURLに“#”が含まれます。検索エンジンは#以下をユニークなURL（の一部）として処理しません。そこでGoogleは、#を使ったAjaxページをクロール・インデックスできるように#を#!に置き換えたうえで裏側でゴニョゴニョやる、かなり複雑な仕様を提案しています。

XMLの第一人者Tim Bray氏「URLに#!入れるな」：濃縮還元オレンジニュース｜gihyo.jp … 技術評論社
http://gihyo.jp/dev/clip/01/orangenew...

Twitterをはじめ，最近のWebサービスにて「twitter.com/#!/timbray」のようにURLに「#!」というhash-bang（shebang）が含まれる

hash-bangを含むURLはAjaxを利用するために考えられたしくみです。#以降は単なるフラグメントとして処理されるため，サーバは#より前のURLを解釈しコンテンツを出力

ブラウザにてJavaScriptが#以降を解釈し，以降のパスに相当するコンテンツをAjaxにて取得しコンテンツを書き換えます。

このしくみができた背景は，Ajax後のコンテンツをSEO（Search Engine Optimization，検索エンジン最適化）の観点からPermalink（固定リンク）にしたいが，一部のブラウザがURLを変更できないため，JavaScriptでフラグメントが変更できるしくみを利用しよう，という事情があります。しかもGoogleが「#!」を「?_escaped_fragment_=」に変換してクロール可能にする仕様を公開したため，FacebookやLifehacker.comをはじめ各所で使われるようになりました

「サーバが認識するURL（#!以前の部分）が1つのドキュメントと対応するというWebの大原則に背くルール違反」であると，これまで培ってきた土壌が壊れてしまうことを憂慮

ハッシュフラグメントがGoogleクローラーによってインデックス対象となった場合，

Ajaxアプリケーションだと，いきなり該当するハッシュのページを表示できない場合がある。

そういう時は，HTMLスナップショットを取得しておいて，クローラに食べさせれば，SEO上は問題ない。

AjaxアプリケーションのSEOについて調べてみた | keisuke.tsukayoshi
http://keisuke.tsukayoshi.com/blog/910

ハッシュフラグメントやメタタグでクローラーはサーバーに_escaped_fragment_というハッシュのついたURLでリクエストするようになるので、この場合にだけ生成しておいたHTML snapshotを返すよう設定します

ajaxコンテンツページのハッシュフラグメント【OKWave】
http://okwave.jp/qa/q7647891.html

「#!」がついているとクローラーに読み取ってもらえるのでSEOに有利。しかし「#!」をつけておくだけでクロール対応できるわけではないのですね。サーバサイドでの処理が必要

【Codepatch #06】JSONで生成されたコンテンツでのSEO対策の方法とは！？ | MEMOPATCH
http://memo.goodpatch.co/2014/10/code...

「Javascriptでコンテンツを生成するページにはSEO的にデメリットが発生してしまう」ということが一つの事実としてあるわけです。

HTMLスナップショットサーバーの利用. ただ、それを解決する手段が無いわけではありません。それが今回ご紹介する「HTMLスナップショットをサーバーで提供する」という方法

ページ内アンカーは，Googleの検索結果の表示ページにおいて

「ワンライン・サイトリンク」に影響する場合がある。

Wikipediaがよい例だ。

検索結果にサイトリンクを出す方法とウェブマスターツールでの設定方法 - SEOのホワイトハットジャパン
http://whitehatseo.jp/%E3%82%B5%E3%82...

Googleでは一行表示のサイトリンクという表記になっていますが、ミニサイトリンクの方が一般的でわかりやすいと思いますので、当ブログではミニサイトリンクという表記でいきたいと思います。通常のサイトリンクに比べればあまり目立ちませんが、そのキーワードと結びつきが強いと検索エンジンが判断した際に出現するようです。

サイトリンク - ウェブマスターツールヘルプ
https://support.google.com/webmasters...

Google の検索結果で一部のサイトの下部に表示されるリンクはサイトリンクと呼ばれ、ユーザーがそのサイトに移動する際に役立ちます。Google では、サイトのリンク構造を解析して、情報を迅速に見つけるために役立つショートカットを検出します。

Googleのワンラインサイトリンクにページ内アンカー(フラグメント)のリンクも表示されるようになってる - F.Ko-Jiの「一秒後は未来」
http://blog.fkoji.com/2009/09191816.html

Googleには、検索結果に一行だけサイト内のリンクが表示される「ワンラインサイトリンク」というものがありますが、最近それがページ内アンカー(いわゆるフラグメントというやつ)にも対応していることに気づきました。よく見かけることができるのが Wikipedia のページ

ちなみにWebサイトのURLのハッシュとは別に，SNSにもハッシュタグSEOというのがある。

SNSの場合は，投稿内容に「#〜〜」が含まれている場合に，カテゴリとして機能することを指す。

Facebookではむしろマイナスの効果に？ハッシュタグの使い方は要注意、 - WEB戦略ラウンドナップ
http://www.roundup-strategy.jp/mt/arc...

時系列で流れていくしか無かったストリーム・タイムラインが、ハッシュタグを使うことによって横断的に繋がりができるというわけです。例えば以下の投稿でしたら「#google」「#seo」「#spyw」がハッシュタグです。ハッシュタグは自動的にリンクされるのでクリックするとそのハッシュタグが含まれている投稿を一覧で見ることができます

Twitter / Search – #ハッシュタグがSEO対策で上位表示 | ネットビジネス・アナリスト横田秀珠
http://yokotashurin.com/seo/twitter-h...

TwitterがSEO重視に方針転換、ハッシュタグ (#) ページを検索エンジンに開放し、検索トラフィックを10倍に伸ばす

Google検索結果(SERP)のリッチスニペット内に，画像を掲載する方法
http://computer-technology.hateblo.jp/entry/20140424/p1

ブログの更新間隔・書かない期間の長さは，SEOに多少影響。コンテンツの質のほうが大事
http://computer-technology.hateblo.jp/entry/20140503/p1

評判を落とすネガティブSEO・逆SEOは，マイナーなキーワードだと影響受けやすい
http://computer-technology.hateblo.jp/entry/20140603/p1

Google検索エンジンのアルゴリズム(hummingbird)を把握し，SEOのキーワード分析手法に役立てよう
http://computer-technology.hateblo.jp/entry/20140118/p2