タグ

JavaScriptとAjaxに関するagwのブックマーク (36)

  • AJAXサイトをクローラブルにする - 検索エンジンフレンドリーなAJAX実装方法

    Googleが、AJAXベースのウェブサイトをコンテンツを検索エンジンに登録する方法についての、最新ドキュメントを公開しました。昨年10月に検討段階の実装方法が公式サイトで紹介されましたが、それのアップデート版になります。 最初におさらいをします。AJAX(エイジャックス)は、ページ遷移なしにサーバとデータ通信を行うことで、動的なWebアプリケーションの開発が可能です。しかし、いまブラウザで表示している内容と対になるURLが存在しないために、クローラが個々のコンテンツをクロールできないこと、また、仮にステートフルURLを用意しても(クローラは)JavaScriptを実行できないためコンテンツを読み取ることができないため、検索エンジンに登録することは困難な状況でした。 しかし、Googleによると69%のウェブコンテンツがJavaScriptなどで動的に作成されているなど、近年のウェブテク

  • Ajax - tips - JSONPをブラウザにキャッシュさせない : 404 Blog Not Found

    2009年04月13日12:00 カテゴリTips Ajax - tips - JSONPをブラウザにキャッシュさせない というわけで、添削おじさん登場。 [を] 笑い顔顔文字APIを作りました (なお、なぜか IE と Safari だと一回しか動きません。添削希望!)理由は単純で、IEとSafariはJSONPをキャッシュしてしまうのです。 理由がわかれば、解決法も簡単です。たとえば以下のようにしてURIをUniqueにしちゃえばOK. function WarosuJSON(cb){ this.proxy = 'http://mimitako.net/api/warosuapi.cgi'; this.cb = cb; this.count = 0; this.parse = function(cb){ var script = document.createElement('scri

    Ajax - tips - JSONPをブラウザにキャッシュさせない : 404 Blog Not Found
  • AJAXとCSSで作られたシンプルで見やすいプログレスバー「Ajax Progress Bar」

    操作感はAJAXで、画像などはCSSで実装されたわかりやすいプログレスバーです。進捗状況などの表示が簡単にできます。また、クリックする度に10%増やしたり、あるいは減らしたりといったことも可能。いろいろなウェブアプリの開発などに応用できそうです。 詳細は以下から。 WebAppers Simple Ajax Progress Bar with CSS by WebAppers ライセンスはMITライセンスで提供されており、以下から実際に試してみることができます。 Demo http://www.webappers.com/progressBar/ 実際にダウンロードしてみると、prototype.jsを使っており、使用するイメージ画像は2種類。その組み合わせでバーの増減を表現するとは、なかなかいい発想。

    AJAXとCSSで作られたシンプルで見やすいプログレスバー「Ajax Progress Bar」
  • AJAX vs. Flash、fladdictブログより

    昨日のエントリーで、深津氏のブログに「Flash使いから見たAJAX」のことが書かれていて読んで勉強になった話を書いたのに、それらのエントリーへのリンクを張るのを忘れていたので、今日はそのリンク集。 以下のエントリーは、AJAXが騒がれ始めた2005年3月から2006年1月の間に書かれたものだが、この「閉じたFlash」vs.「オープンなAJAX」という構図は相変わらずである。特に、FlashはActionScript3.0で大幅に言語として整備されたにも関わらず、AJAXに押されぎみなのはなんとも微妙である。 それで思い出したのが、GoogleUIEngineの説明に行った時の会話。「もっとオープンにしてくれ」という彼らに、「Flashはどうなんだ」と答えると、「Macromediaの連中にもオープンにしろと言いつづけている」と言う。GoogleもYoutubeなど一部のサービスではF

  • IBM Ajax と XML: Ajax の最高傑作から学ぶ - Japan

    IBM Developer is your one-stop location for getting hands-on training and learning in-demand skills on relevant technologies such as generative AI, data science, AI, and open source.

    IBM Ajax と XML: Ajax の最高傑作から学ぶ - Japan
  • StoryOfXmlhttp - XMLHTTP の話。

    StoryOfXmlhttp - XMLHTTP の話。 目次 この文書について XMLHTTP の話。 追記 2007/1/31 著作権情報 XMLHTTP の話。 この文書について "Story of XMLHTTP" の日語訳です。 http://www.alexhopmann.com/story-of-xmlhttp/ 添削歓迎: タイポ、訳語不統一、そのほか ... もう Microsoft を辞めるんだ。そう思うと、自分のやったプロジェクトのことを すこし振り返りたい気分になる。 XMLHTTP の歴史なんてのは、聞いてもらっても面白いとおもう。 XMLHTTP は後に大ヒットとなった。 人々がそれに気付いたのは、GoogleGoogle Suggest 機能 で使われているのを目にしてからだろう。 ページのソースコードを調べ、仕組みを探ったわけだ。 実のところ G

  • Ajaxでデバッグしよう - @IT

    Webアプリ開発で、動作確認メッセージが出力できない。そんなときは、Ajaxでブラウザの動作ログをサーバに出力してみよう。 現在、至るところでWebを利用したシステム開発が行われています。デバッグに使用しているテクニックの1つに、古くからの技法として変数や動作したことを示すメッセージ表示などの情報を出力するものがあります。残念ながらWebアプリケーションの開発の現場では、その技さえ使えない場合があります。 最近のWebアプリケーションの開発は、サーバ側のJSPやサーブレットの開発では統合開発環境を利用できるようになり、大幅に開発効率が向上しています。また、開発中の動作確認だけでなく、リリース後はサーバ側で動作するプログラムへメッセージを埋め込んでログとしてファイルに残すこともできます。 これらのログ機能は、IBM社のWebSphere、MS社のInternet Information Se

  • 【レポート】Webデベロッパの新・御用達サイト - MiniAjax.comへようこそ! | エンタープライズ | マイコミジャーナル

    MiniAjax.comをご存知だろうか。2006年2月に開設されたサイトなのだが、Webデベロッパにとってかけがえのないサイトになるかもしれない。 最近のWebデベロッパ、とくにはじめて取り組んだ開発がWebアプリケーションシステムの開発であるような新進気鋭のデベロッパは、生まれながらにスニップの扱いに長けている。こうした若いデベロッパは、そもそも開発や学習に対する姿勢が旧来から開発をしてきたデベロッパとは異なっているようだ。まずWebで対象をしらべ、ネットワーク上に点在するスニップ(snip)、いわゆるソースコードの断片を探してして、編集して組み合わせて活用する、そんな技術に長けている。 現在Webアプリケーションに関する関心の中心のひとつがAjaxにあり、ライトでクールなインタフェースの実現が注目されていることは疑いの余地がない。この場合、重要になってくるのはAjaxスクリプト(Aj

  • CGI不可のサーバでもできるAjaxによるHTMLの動的な整形:CodeZine

    はじめに ここ最近、Web 2.0という言葉と共にクライアント側のプレゼンテーション技術としてAjaxが非常に注目されています。しかし、Ajaxという技術用語や概念の解説、または書籍が多く出版されているにもかかわらず、Ajaxを応用したコンテンツやアプリケーションは、キーワードとしてのAjaxの人気から考えれば、少ないと言えるでしょう。多くの人がGoogleなどの大手サイトでAjaxを体験しているにもかかわらず、Ajaxが使われているのは企業や大手ポータルサイトなど、限定されています。 では、Ajaxはそれほど敷居の高いものなのでしょうか。質の高い開発集団や、高額な開発環境、またはサーバーなどのインフラストラクチャが必要となるのでしょうか。確かに、Googleと同じレベルのものを作ろうと考えれば、相応の費用と技術が要求されます。しかし、Ajaxという技術要素だけを見れば、けっして大企業に独

  • Ajaxの高度な使用例、Yahoo! pipes Ajax うきうき Watch 第18回 ─ @IT

    Yahoo! pipes 話題のサービスです。検索エンジンやRSSフィードなど、さまざまなソースのデータを足し合わせ、フィルタリングし、望みの情報だけを抽出したフィードを作り出すことができます。シンプルな分かりやすさと操作性の良さが特徴です。 Yahoo! pipesは、サーバ側で実行されRSSフィードを出力するサービスで、Ajaxとは直接関係がありません。にもかかわらず、今回のトップで紹介した理由は、パイプのデザインツールが非常によくできているからです。 画面左側のパレットから、必要な機能を選んで配置します。場所は自由にドラッグして決めることができます。そして、パーツ間を線でつなぐと、自動的に滑らかな線で結び付けられます。パーツの場所を移動しても線は追従します。さらに、個々のパーツ内部は入力フィールドになっていて、編集できます。これはAjaxの高度な使用例として見る価値があるでしょう。

  • MiniAjax, Le meilleur de la banque en ligne – On code des billets ici!

    La présence de pesticides dans l’eau est un problème de santé publique majeur. Ces substances chimiques, utilisées en agriculture pour protéger les cultures, peuvent se retrouver dans les nappes phréatiques et les cours d’eau, contaminant ainsi l’eau que nous buvons. Les dangers des pesticides pour la santé Les pesticides sont suspectés d’avoir des effets néfastes sur la santé, même à faibles dose

  • AJAXでやってしまう間違い:Geekなぺーじ

    「Ajax Mistakes」という面白い記事がありました。 AJAXを使ってWebアプリを作る時に陥りがちな間違いを列挙していました。 以下、要約してみました。 かなり削っているので、詳細は原文をご覧下さい。 AJAXを使うためにAJAXを使う AJAXはカッコイイ技術です。 しかし、AJAXはツールでしかありません。 AJAXはオモチャではありません。 実験的にAJAXを使うために、不必要なところにAJAXを無理矢理使っている場合が多いです。 戻るボタンの動作を妨げる 戻るボタンはWebインターフェースで重要な役割を果たしていますが、JavaScriptとの相性は良くありません。 戻るボタンの機能を維持できない場合があることは、JavaScriptのみで構成されているページをお勧めしない理由の一つです。 ただ、使い勝手の良いサイトというものは、そもそも戻るボタンに依存しなくてもユーザが

  • JSONを使ってAJAXベースのアプリケーションを高速化する:CodeZine

    稿では、Amazon Web ServicesをPHPで操作する方法を説明します。AWSを利用する方法には大きく分けてRESTとSOAPがあります。稿ではまず、簡単なため多くの開発者に利用されているRESTを紹介し(SOAPは稿では扱いません)、より抽象度の高い方法であるPEAR Services_Amazonを使った利用方法を紹介します。

  • Google Web Toolkit - Google Code

    GWT is used by many products at Google, including Google AdWords and Google Wallet. It's open source, completely free, and used by thousands of enthusiastic developers around the world. GWT is the official open source project for GWT releases 2.5 and onwards. This site houses links to the documentation, source code repository, issues list and information related to GWT roadmap and release. It is i

  • あるSEのつぶやき: Ajaxライブラリまとめ

    Ajax/JavaScriptライブラリをまとめておきます。(順不同) | 基 | 統合 | 表示系 | GUI部品 | イメージ | PGM連携 | ブラウザ | Flash | その他 | | 部品集 | リンク | 編集履歴 | ・基ライブラリ ・・・Ajax開発のベースになるもの ↑TOP prototype.js 超メジャーなAjaxライブラリ prototype.js の開発者向けメモ prototype.jsリファレンス prototype.jsリファレンス(JavaScriptist) prototype.js逆引きサンプル集 Prototype 1.5.0 Cheat Sheet Prototype 1.5 PDFAPI/サンプル/解説 Prototype.js Documentation - まとめサイト Prototype 1.6.0へのアップグレード実例紹

  • こども(てれび)

    適当な感想を言うだけなのもなんなので例を書きます。これを作る。higeponにあやかりたいあやかりたい。 いまさら人に聞けないAjaxと簡単なサンプル - higepon blog ・画面上テキストラベルに見える部分をマウスクリックすると編集可能になる ・文字列を入力し、Enterキーを押すと、テキストがバックグラウンドで更新され、ラベル表示に戻る。 ・画面はリロードされない。 完成品はこれ。 http://childtv.org/prototype/sample.html 使っているのは Prototype 1.3.1 です。 http://prototype.conio.net/dist/prototype-1.3.1.js sample.html <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//W3C/

    こども(てれび)
  • prototype.js ってなに?の巻 - こども(てれび)

    追記 2005-08-23 Using prototype.js v1.5.0 リファレンスがあったみたい。これを読んだ方がはるかに有益です。あー書くんじゃなかった。 はてなの人気者 id:naoya が「prototype.js でデザインパターン」というのをやってるんだけど、prototype.js の説明をしてくれなくて困る。前から「Rails の prototype.js は便利だ」というのを目にすることがあったので、ちょうどいい機会だってことで調べた。 http://prototype.conio.net/ ドキュメントが全然ない。ないこたないと思うのでご存知の方は教えてください。しょうがないのでコードを読むことに。 http://dev.conio.net/repos/prototype/src/ ここのを順次読みます。 base.js http://dev.conio.net

    prototype.js ってなに?の巻 - こども(てれび)
  • Using prototype.js v1.3.1

    What is that? In case you haven't already used it, prototype.js is a JavaScript library initially written by Sam Stephenson. This amazingly well thought and well written piece of standards-compliant code takes a lot of the burden associated with creating rich, highly interactive web pages that characterize the Web 2.0 off your back. When I first started trying to use this library, a few years ago,

  • Yahoo! UI Libraryを使ったテトリス

    Yahoo!が使っている各種JavaScriptが「Yahoo! UI Library」という名前で公開されているが、そのYahoo! UI Libraryを使ったテトリスがある。 操作スタイルはともかく、今までの各種JavaScriptで作成されてきたテトリスとは一線を画する再現性と出来だ。 YUI Tetris! http://www.dustindiaz.com/basement/tetris.html 下にある「START」ボタンを押して開始。「S」で左、「F」で右、「D」で下移動。回転は「←」「→」キー、あるいは「<」「>」キーで行う。ちゃんと上まで詰まったら画面全体がブロックで覆われたりと芸が細かい。 お仕事中の息抜きにどうぞ。

    Yahoo! UI Libraryを使ったテトリス
  • Adobe、Ajax対応ページ作成用の「Spry」公開

    AdobeはWebページにAjaxを組み込むためのWebデザイナー向けフレームワークを公開した。HTMLCSSJavaScriptの基的な知識があれば簡単に導入できるという。 米Adobe Systemsは5月11日、WebページにAjaxを組み込むためのWebデザイナー向けフレームワーク「Spry framework for Ajax」のリリース1を公開した。同社サイトから無償でダウンロード提供している。 Spryフレームワークでは、HTMLCSSおよび最低限のJavaScriptを使い、HTML文書にXMLデータを組み込むことが可能。HTMLCSSJavaScriptの基的な知識があれば簡単に導入できるという。 ダウンロードにはJavaScriptライブラリと同フレームワークについての説明、利用例を示すデモアプリケーションが含まれる。 Adobeでは、今回リリースしたのは

    Adobe、Ajax対応ページ作成用の「Spry」公開