AjaxアプリケーションのSEOについて調べてみた | keisuke tsukayoshi
Backbone.jsやEmber.js、AngularJSなどの流行りのMVCフレームワークを用いたAjaxアプリケーションのSEOについて少ししらべてみました。SEOというかクローラー対策っぽいですが。ブログ的には始めての開発系の記事。 AjaxアプリケーションのSEO的な問題 そもそもどうしてAjaxアプリケーションがSEO的にやばいかというと、一旦空のHTMLを読み込んだあとJavaScriptを使ってクライアントサイドでコンテンツをレンダリングする仕組み上、Googleのクローラーのような特殊な環境だと内容を正常に読めないというのが現状らしい。というわけでこれを如何にして読み込ませるかが本件のゴールになります。 STEP1:Ajaxアプリであることをクローラーに伝える #!(ハッシュフラグメント)をURLにつける URLに#!(ハッシュフラグメント)が含まれているとクローラーはそ
CORS(Cross-Origin Resource Sharing)について整理してみた | DevelopersIO
ブラウザからAmazon S3に直接ファイルをアップロードしたい 先日、Amazon S3にファイルをアップロードするWebアプリを作ろうとして色々調べていたところ、S3にCORSという仕様のクロスドメインアクセスの設定をすることによって、ブラウザから直接S3にアップロードをする方法にたどり着きました。ただ、この方法を使うにあたってはCORSというクロスドメインアクセスの仕様をきちんと理解しておいた方が良さそうでしたので、まずはCORSについて自分なりに整理してみました。 なお、弊社の横田がCORSとS3についての記事を以前書いていますので、S3のCORSサポートに関する概要を知りたい方はそちらをご覧下さい。 CORS(Cross-Origin Resource Sharing)によるクロスドメイン通信の傾向と対策 CORS ブラウザでAjax通信を行う際には、同一生成元ポリシー(Same
Googleジョン・ミューラー、新しいサイトには「#!」のAjaxよりも「HTML5のHistory API/pushState」を推奨
[対象: 上級] GoogleのJohn Mueller（ジョン・ミューラー）氏は、Ajaxを利用する場合は、「example.com/#!/xyz」のように「#!」を使ってURLを構成するよりも、HTML5で採用されたHistory APIやpushStateの機能を使うことを勧めました。 「HTML5のpushState/replaceState」の使用を推奨 John Mueller氏は、SEO系のフォーラムに投稿された「#!」の使い方に関する2つの別々の質問に、次のようにアドバイスしました。 非難されるかもしれないのを承知で言うと、HTML5で新しいサイトを運用しているなら、HTML5のHistory APIを利用し通常のURLを使ってコンテンツを提供した方がいい。 ナビゲーションにはJSを使いブラウザのURLを変える、しかし最初の読み込みで静的なコンテンツを返す。 より新しい代替
墨田区に蔓延る出張マッサージは、エステに共感を覚えずに居られない
Last Updated on 2024年6月26日 by admin 墨田区出張マッサージ店には20代後半くらいから月に2回ほど利用していましたが、40代になってくると仕事の疲れが抜けにくくなってきたこともあり、仕事が帰りとか休日にマッサージ店まで足を運ぼうと思っても体が重くてマッサージ店まで行く気力が無くなっていました。その時に、自宅までマッサージ師を呼べばわざわざ自らがマッサージ店まで足を運ぶ必要がないと考えて、それからは墨田区出張マッサージを月に1回程度利用することになりました。ただし、金銭的に余裕がない場合には2ヵ月に1回程度と少なくしています。墨田区出張マッサージは出張料などが含まれていますのでどうしても割高になってしまいます。それでも墨田区出張マッサージは、仕事の疲れで休日は家で休んでいたい時に便利です。外出する支度をしなくて済みますので、普段家にいるラフな格好でいられます。
jQueryのDeferredを用いたモダンなAjax処理の書き方
目次 jQuery 1.4以前の書き方jQuery 1.5以上の書き方jQuery 1.8以上の書き方【発展編1】Deferredを用いた書き方 deferredとは何か？【発展編2】$.when() を用いた書き方参考本エントリは軽めのjQuery Advent Calendar 2012の14日目の記事として書きます。軽めといいながら少し重めになってしまった感がありますが、初めてのAdvent Calendar参加ということでご勘弁を。 ※ Twitter API仕様変更によりTwitter APIを使ったコード例は現在動作しなくなっていることにご注意。 jQuery 1.4以前の書き方まずは、少し古めのコード、昔のjQueryの本とかでよく見る書き方。 $.ajax({ url: "ajax.html", success: function(data) { alert('succes
jQuery の ajax で JavaScript のオブジェクトをポストした時に送信されるデータは？ - jQuery 入門
ホーム » AJAX » jQuery の ajax で JavaScript のオブジェクトをポストした時に送信されるデータは？ jQuery の ajax ライブラリを利用すると、AJAX を利用した動的なウェブページを簡単に作成できます。 AJAX を使うメソッドは $.ajax メソッドです。 これについては、AJAX で説明しました。 Ajax では様々なデータを背後で送受信可能です。 ここでは JavaScript のオブジェクトをサーバーにポストしたときに、実際にどのような形式でデータがポストされているのか確認します。 ajax によるデータのポスト HTTP には主なメソッドとして GET とか POST 等があります。POST というのは、データが HTTP リクエストのボディー部に設定されるタイプのものを指します。 GET リクエストの場合は、URL の後ろに ?a=1
jQueryと配列
この記事は12年以上前の記事です。情報が古い場合がありますのでお気を付け下さい。はまったのでメモ書き。 ＜やりたいこと＞ jQueryを使ってAJAXでPHPに配列を渡したい ＜10/26：追記しました＞ ＜前提＞ ・CentOS5.3 ・PHP5.2.11 ・jquery-1.3.2.min.js ＜サンプルソース＞ $.ajax({ type: “GET”, url: “test.php”, data: { id:[1,2,3,4,5,6,7] }, success: function(){ alert(‘成功しました’); }, error: function(){ alert(‘エラーです’); } }); ＜問題点＞ ・jQueryは上記のソースで「id=1&id=2&id=3&id=4&id=5&id=6&id=7」というリクエストを行う →同じキーで複数の値を送信する ・PH
jQuery.ajax(options) - jQuery 日本語リファレンス
HTTP通信でページを読み込みます。 この関数はjQueryにおけるAJAX通信の基本部分で、実際には$.getや$.postといった関数を使った方が、容易に実装できます。 但し、これらの抽象化された関数は実装の容易さと引き換えに、エラー時のコールバックなどの複雑な機能を失っています。そのような処理を実装したい場合は、やはり基幹であるこの関数を用いる必要があります。 $.ajax関数は、戻り値として XMLHttpRequestオブジェクトを返します。殆どの場合、このオブジェクトを直接操作することは無いと思われますが、例えば投げてしまったリクエストを中断する場合など、必要であれば利用して下さい。 この関数は引数をひとつだけとりますが、実際にはハッシュで、キーと値の組み合わせにより多くのオプションを受け取ります。 以下にその一覧を載せますので、参考にして下さい。 async / boolea
Ajax的に画像などのファイルをアップロードする方法 ::ハブろぐ
a-blog cmsの開発中、Ajax的にファイルをアップロードする必要があったので、その際の調べ物についてかきます。普通にpostしようにも、JavaScriptでローカルのファイルは扱えないよ、って話で、先輩から「iframeがヒントだ！」的なざっくりとしたアドバイスを頂いたので、それを頼りに調べる。 画面遷移なしでファイルアップロードする方法 - 30からのBlog おお、なるほどなるほど。以下、HTML, JavaScript, PHPのサンプルをメモ。 こんなHTMLをJavaScriptで操作すればいい JavaScript自身が要素の生成を作成してもよいですが、最終的にはこういうHTMLが作成されることになります。 <a href="#" id="uploadTrigger">アップロードするぜー</a> <form id="uploadForm" action="画像POS
jQueryでフォームをAjax送信する際の基本パターンのチュートリアル。二重送信の防御とか。 | Ginpen.com
仕事の進みがちょいとアレなので、現実逃避もとい気分転換に。 フォームの入力内容を、jQuery.ajax()を使ってサーバーへ送信したいって時のパターンです。 基本的な流れ フォームのsubmitを拾う 通常の送信はキャンセル 送信ボタンを無効化 送信先URLやフォームの入力値を取得 送信 受信後、送信ボタンを戻す 入力値をどう得るか、というのがポイントかと思います。 送信ボタンを無効化するってのはやらなくても良いんだけど、誤操作防止のためにも是非やって頂きたいと思います。あと送信ボタンの制御以外にも応用がききます。 デモ なんかお問い合わせフォーム的なものを用意しました。 まー実際にお問い合わせフォームをAjaxで送信する場面なんてないような気もするんですが、基本パターンという事で。
jQueryのDeferredとPromiseで応答性の良いアプリをー基本編 | ゆっくりと…
jQuery 1.6 が既にリリース されていますが、1.5 で追加された Deferred を勉強する意味で、Script Junkie から Creating Responsive Applications Using jQuery Deferred and Promises を翻訳してみましたので、共有したいと思います。著者の Julian Aubourg は、jQuery のコアチーム・メンバーとして、Ajax モジュールの書き換えと Deferred 導入を指揮した方だそうです。 記事の途中、各メソッドの説明部分は、jQuery ドキュメントの翻訳に差し替えていますので、リファレンスとして使ってもらうのも良いかと思います。 Deferred や Promise は、概念や用語が少々分かりにくいところがあるかと思いますので、読んでくださった方の、少しでも理解の助けになれば幸いです
Asynch JS - The power of $.Deferred | Articles | web.dev
Asynch JS - The power of $.Deferred Stay organized with collections Save and categorize content based on your preferences. One of the most important aspects about building smooth and responsive HTML5 applications is the synchronization between all the different parts of the application such as data fetching, processing, animations, and user interface elements. The main difference with a desktop or
Backbone.jsを薦める3つの理由
ガリレオスコープ開発チームによる �最新Web動向、技術メモ ( Ruby, Rails, node.js ) です Backbone.js(http://documentcloud.github.com/backbone/)を2,3ヶ月触ってみて、導入して良かったことをまとめます。 Backbone.js単体での威力はそこまでではないかもしれませんが、Server側も含めた設計思想を絡めて考えると大きな効果が期待できます（サーバー側も含めた構造改革が全体的に必要になるとは思いますが・・・）。 ViewとControllerの結合強度低下 = Viewのアプリ化viewとcontrollerが1対1対応だった頃Rails単体で作成している場合、Viewにロジックが入れられない以上、 そのViewで必要な変数などは、全てControllerに書く必要がありました。 この状態では、Contro
jQuery UI
jQuery UI is a curated set of user interface interactions, effects, widgets, and themes built on top of the jQuery JavaScript Library. Whether you're building highly interactive web applications or you just need to add a date picker to a form control, jQuery UI is the perfect choice. What's New in jQuery UI 1.14? Compatibility with recent jQuery versions (up to 3.7): Usage of deprecated jQuery API
jQuery
Lightweight Footprint Only 30kB minified and gzipped. Can also be included as an AMD module CSS3 Compliant Supports CSS3 selectors to find elements as well as in style property manipulation What is jQuery? jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use
ローディング作成☆
Loading GIF or, so called loader gif is an animation that indicates a loading process on a web-site or an application. Being an critically important part of web-site and application design and usability, mostly the animations are used to show that something is loading on the background (e.g. AJAX applications). The animation objects are usually used in GIF format which is very popular due to it's
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
