Clever Geek Handbook

Web c ''を壊す ハッシュバン

以䞋は、私の意芋では、Web 2.0の時代におけるかなり深刻な問題、぀たりURLの玔床に泚意を向ける蚘事の翻蚳です。



Lifehacker.comを䟋にずるず、SEOを远いかけ、「プログレッシブ゚ンハンスメント」の原則を吊定し、最先端のテクノロゞヌを盲目的に远跡するこずにどのような問題が生じる可胜性があるかが瀺されおいたす。



先週月曜日、Lifehacker.comはJavaScriptが壊れおいたため利甚できたせんでした。 Lifehacker.comは、他のGawkerサむトずずもに、コンテンツ、広告、その他䜕もない空癜のホヌムペヌゞを衚瀺したした。 Googleの怜玢結果からメむンペヌゞにリダむレクトされるサブペヌゞぞの移行。



JavaScriptに䟝存するURL



Gawkerは、以前のTwitterず同様に、ペヌゞのURLを含むJavaScriptに完党に䟝存しおサむトを再構築したした。 JavaScriptをロヌドできなかったため、コンテンツが䞍足し、URLが壊れおいたす。



新しいペヌゞアドレスは、 http://lifehacker.com/#!5753509/hello-world-this-is-the-new-lifehacker



 http://lifehacker.com/#!5753509/hello-world-this-is-the-new-lifehacker



/ http://lifehacker.com/#!5753509/hello-world-this-is-the-new-lifehacker



this- http://lifehacker.com/#!5753509/hello-world-this-is-the-new-lifehacker



the-new- http://lifehacker.com/#!5753509/hello-world-this-is-the-new-lifehacker



ようになりたす。 月曜日たで、アドレスは同じでしたが、..



フラグメントID



は、アドレスの次の郚分がそのIDたたは珟圚のペヌゞの名前付きアンカヌを持぀HTML芁玠ぞのリンクであるこずをブラりザに䌝える特別なURL文字です。 lifehacker.comの堎合、珟圚のペヌゞがメむンペヌゞです。



月曜日たで、サむトは100䞇ペヌゞで構成されおいたしたが、珟圚は1ペヌゞに100䞇のフラグメント識別子がありたす。



なんで 知りたせん Twitterは、Googleがそのようなツむヌトを玢匕付けできるのず同じテクノロゞヌに切り替えたずきにこの質問に答えたした。 これはそうですが、同じこずが以前の正しいアドレス構造でより少ないコストで達成できたした。



問題解決

アドレス構文c ハッシュバンは、GoogleがWeb開発者がロボットによるむンデックス䜜成のためにサむトにアクセスできるようにする方法を発衚したずきに、最初にWeb開発の分野に入りたした。



これ以前は、正しい決定に぀いおはよく知られおいなかったため、コンテンツを読み蟌むためのAjaxのような矎しいテクノロゞヌを備えたサむトでは、JavaScript呌び出しの背埌に隠されたコンテンツをボットが怜出できないため、関連キヌワヌドの䜎レベルのむンデックス付けたたは評䟡が芳察されたした



Googleはこの問題を解決するために倚くの時間を費やしたしたが、これに成功せず、もう䞀方の端から行くこずにしたした 。 この架空のコンテンツを芋぀けようずする代わりに、サむトの所有者自身に報告させおください。 このために、 仕様が開発されたした。



Googleは、開発者が「進歩的な改善」を備えたサむトを䜜成し、コンテンツの䞀郚ずしおJavaScriptに䟝存しないずいう事実に泚意を集䞭しおいるずいう事実に敬意を衚さなければなりたせん。



最初から始める堎合は、HTMLのみを䜿甚しおサむトの構造ずナビゲヌションを構築するこずをお勧めしたす。 次に、サむトのペヌゞ、リンク、およびコンテンツを適切に配眮したら、倖芳ずAjaxずのむンタヌフェむスを匷化できたす。 GooglebotはHTMLを芋お満足しおいたすが、最新のブラりザを䜿甚しおいるナヌザヌはAjaxボヌナスを楜しむこずができたす。




぀たり cアドレス構文 Web開発の基本原則に基づいおデバむスを配眮するサむト向けに特別に蚭蚈されおおり、そのようなWebサむトに呜を吹き蟌み、コンテンツがボットによっお怜出されるようにしたした。



そしお今、このラむフラむンはFacebook、Twitter、そしお今やLifehacker.comの゚ンゞニアによっお唯䞀の真のWeb開発パスずしお受け入れられおいるようです。



ネットURL

Google仕様では-アドレスは「prettyURL」ず呌ばれ、ボットによっおよりグロテスクなものに倉換されたす。



先週の日曜日、Lifehackerのアドレスは次のようになりたした http://lifehacker.com/5753509/hello-world-this-is-the-new-lifehacker



: http://lifehacker.com/5753509/hello-world-this-is-the-new-lifehacker







いいね 真ん䞭の7桁のコヌドは理解できない唯䞀のフラグメントですが、蚘事を䞀意に識別するためにCMSで必芁です。 したがっお、実際には「クリヌン」アドレスです。



今日、同じ蚘事はhttp://lifehacker.com/#!5753509/hello-world-this-is-the-new-lifehacker



入手できたすが、の远加により、アドレスは以前のものよりも「クリヌン」ではなくなりたした。 䜏所の構造を根本的に倉曎したす。 䜕か達成できたしたか いや しかし、䜏所のゆがみはこれで終わりではありたせん。



Googleの仕様では、アドレスはパラメヌタヌ付きのアドレスに再䜜成されたす。 で http://lifehacker.com/?_escaped_fragment_=5753509/hello-world-this-is-the-new-lifehacker



: http://lifehacker.com/?_escaped_fragment_=5753509/hello-world-this-is-the-new-lifehacker



/ http://lifehacker.com/?_escaped_fragment_=5753509/hello-world-this-is-the-new-lifehacker







したがっお、コンテンツを返すのはこのアドレスです。 このアドレスは正芏です。぀たり、 ボットがむンデックスするもの。



同様 http://example.com/default.asp?page=about_us



: http://example.com/default.asp?page=about_us







Lifehacker.comずGawkerは、単玔な䜏所で10幎の経隓を積んだだけで、兞型的なASPサむトに戻っおきたしたFrontpageはさらに倚くを獲埗できたすか。



問題は䜕ですか

䞻な問題は、Lifehacker.comのアドレスがコンテンツを指しおいないこずです。 各URLはホヌムペヌゞを指したす。 幞運でJavaScriptを䜿っおうたくやっおいれば、必芁なコンテンツはメむンペヌゞに䟝存したす。



通垞のアドレスよりも耇雑で、゚ラヌが発生しやすく、脆匱です。



コンテンツに関連付けられたアドレスを芁求するず、芁求のむニシ゚ヌタヌはコンテンツを受信したせん。 ぀たり 砎損は蚭蚈にありたす。 Lifehacker.comは、ボットが興味深いコンテンツのリンクをたどるこずを意図的に犁止しおいたす。 もちろん、Googleが発明したフヌプを飛び越えなければ。



では、なぜこのフヌプが必芁なのでしょうか



目的地

では、なぜ-アドレスが、コンテンツを盎接配信する別のアドレスに再䜜成する必芁がある合成アドレスである堎合、アドレスを䜿甚するのでしょうか

すべおの理由の䞭で、最も匷いのは「ずおもクヌルだから」 私は最匷ではなく最匷だず蚀った。



゚ンゞニアは、Ajaxアプリケヌションの状態を保存するこずに぀いお぀ぶやくでしょう。 そしお、正盎なずころ、これはこの方法でアドレスを壊すばかげた理由です。 href属性内のアドレスは、コンテンツぞの通垞の圢匏のリンクのたたにするこずができたす。 ずにかくJavaScriptを䜿甚しおいるので、クリックハンドラヌでリンクをクリックしお、を適切な堎所に远加するこずで、埌で台無しにするこずができたす。状態維持があり、ボットや䞀般的に非JavaScriptからサむトを䞍必芁に閉じるこずなく、 ov。



すべおのボットを拒吊するGooglebotを陀く

もちろん、HTTP / 1.1ずURL仕様RFC-2396などの䞡方を完党にサポヌトするすべおの非ブラりザ゚ヌゞェントスパむダヌ、アグリゲヌタヌ、むンデックススキャナヌは、Googlebotを陀き、Lifehacker.comを経由できたせん。



したがっお、次の結果を考慮する必芁がありたす。
  1. 䞭間サヌバヌにはコンテンツの正芏衚珟がないため、キャッシュは機胜しないため、キャッシュは機胜したせん。 これにより、Lifehackerがより長く開くこずになり、Gawkerはトラフィックの増加により倧きな損倱を被りたす。
  2. HTTP / 1.1およびRFC-2396互換のクロヌラヌには、空のホヌムペヌゞ以倖は衚瀺されたせん。 ぀たり このようなクロヌラヌ䞊に構築されたアプリケヌションずサヌビスは、察応する効果をもたらしたす。
  3. microformatsの朜圚的な䜿甚は倧幅に削枛されたす。 ブラりザずGoogleアグリゲヌタヌのみがマむクロフォヌマットデヌタを衚瀺できたす。
  4. ペヌゞIDを䜿甚するFacebook Likeりィゞェットは、ペヌゞがLike'nになるための远加のアクションを必芁ずしたすデフォルトでは、メむンペヌゞは盎接URLで指し瀺されおいる唯䞀のものであり、のあるすべおの「曲線」は再びメむンペヌゞぞのリンクずしお理解されたす

JavaScriptの完党な䟝存関係

URLでコンテンツを取埗できない堎合、サむトは壊れおいたす。 ゎヌカヌはリンクを壊すこずで意識的にこのステップを螏んだ。 圌らは、あらゆる皮類のJavaScript゚ラヌのせいで、サむトの可甚性を残したした。 本圓の理由ず利益のないこのような脆匱性は、すべおの欠点を䞊回っおいたせん。 Lifehackerが䜿甚した方法よりも優れた方法がありたす。 HTML5ずそのHistory APIでさえ、より良い゜リュヌションです。



建築の悪倢

Gawker / Lifehackerは「挞進的な改善」の原則に違反し、発売日にスタむツを萜ずしおすぐに支払いをしたした。 JavaScriptのミスはすべお倱敗に぀ながり、Gawkerの収入ず芖聎者の信頌に盎接圱響したす。



さらに読む


More articles:


All Articles