2009-11-24 High Performance Web Design ~デザインから考えるハイパフォーマンスWebサイト~ ラベル: performance CSS Nite in ISHIKAWAで話をしてから1ヶ月経ったので、薄れゆく記憶の復習も兼ねて思いの丈を綴ってみたｗ High Performance Web Design 1. What's High Performance?ここでいうパフォーマンスというのはWebサイトの表示高速化についてです。つまり、ページをいかに早く表示させるかという課題です。でも、そうゆうのってサーバー側の問題でしょ？システムエンジニアの管轄じゃないの？と思われがちですが「ハイパフォーマンスWebサイト」の著者であるSteve Soudersの調査によると、80:20。一般的にユーザーの待ち時間の実に80%がブラウザ側、フロントエンドで費やされて
瀬戸内海の漁師の続き。 GAEが出た時、 「スケールするつってもそんな大量のアクセスこないしなぁ。月100万PVぐらいまでならさくらの7800円（専用サーバー）で行けるんじゃないのかな？」 なんて思ってた。そんな風に考えてて触ってすらなかった。花京院風に言えばコチコチのクソ石頭の持ち主だった。ところが一年半近く遅れて最近触ってみたところ、なんかスゲー簡単だし、ほとんどのWebサイトは無料で行けるぐらい無料ゾーンが広い。 どうやらGoogle様の意図は俺の思ってたのとは違うらしい。 高性能な分散環境にばかり注目していたが、GAEはある意味、"無料サーバー"なのだ。GAEには"0円"から"格安専用サーバー1台程度"までを全てリプレイスできちゃうような無料レンタルサーバーサービスという側面がある。"WordPressが動く広告も無い無料レンタルサーバー"があったらみんな使うだろう？MySQLとS
GoogleがWebページ表示をスピードアップするプロトコル「SPDY」を発表した。テストではページ読み込み速度が最高で64％短縮できたとしている。 米Googleは11月12日、Web高速化を実現するためのアプリケーションレイヤープロトコル「SPDY」（スピーディーと発音する）を発表した。Googleが目指しているWeb高速化の一環で、HTTPをサポートし、Webページ表示の遅延時間を最小限に抑えるという。 SPDYに関するホワイトペーパーによると、同社はSPDYとともに、同プロトコル対応版のGoogle ChromeブラウザとオープンソースのWebサーバも開発した。これらのアプリケーションをHTTPとSPDYで稼働テストしたところ、ページ読み込み時間が最高で64％短縮できたという。 SPDYはセッションレイヤーをSSLの上に追加するので、単一のTCP接続で複数の相互データストリームを並
業務アプリケーションがWebアプリケーションとして開発されるのは現在の大きなトレンドです。それに伴ってHTMLとCSSによって業務アプリケーションの複雑なユーザーインターフェイスを構築する必要性が生じます。 しかし機能が豊富な業務アプリケーションのユーザーインターフェイスをHTMLとCSSで構築するのはそれほど簡単ではなく、しかもそれをアプリケーション全体で統一し、優れたユーザビリティを実現するのはさらに手間のかかる作業です。 そうした業務用のWebアプリケーションのユーザーインターフェイスを構築するためのサンプルが豊富に含まれたガイドライン「IBM Lotus User Interface Developer Documentation」が、IBMから公開されました。 今回公開されたIBMのガイドラインは、同社のLotus製品群のユーザビリティを統一するための社内プロジェクト「One U
探し物をしていて古いリンクをたどったら 総務省｜ご案内ページ －掲載期間が終了しています－ というページにリダイレクトされてしまった。総務省サイトの掲載期間は原則3年で，パンフレットなどは最新版以外は消しているという。国の貴重な資料は永久保存でいいと思うのだが，なぜ消すのだろう？ Webの開祖Tim Berners-Leeは1998年に Cool URIs don't change（神崎さんの訳：クールなURIは変わらない）を書いて，URI（URL）が永続すべきことを説いている。もう10年以上も前のページだが，サイト管理者はぜひ読んでほしい。ここに書いてあるように，何十年も永続させるためにはいろいろな工夫が必要だ。例えば拡張子はその時点での技術を反映する。hoge.html は hoge.cgi や hoge.php や hoge.rb になるかもしれない。そのため，W3Cサイトへの正式な
ReverseHttp面白いですね。 ReverseHttp Tunnel HTTP over HTTP, in a structured, controllable, securable way. Let programs claim part of URL space, and serve HTTP, all by using an ordinary HTTP client library. http://www.reversehttp.net/ ただ勘違いされやすいのが「何がReverseなの」という部分。通常ブラウザからリクエストが送信され、それに対する応答がサーバから返されます。ReverseHttpはサーバで何かアクションが起きた場合に、ブラウザ側がその通知を受信する...なんて事が出来るプロトコルです。仕組みはcometというlong pollに似た仕組みで、サイトのdemo
Webで飯を食べてる人へ。 僕らはIEのおかげで飯が食えてる部分は、数10%はあると思う。 マイクロソフトが「インターネット」というラベルで、WebブラウザであるIEを設定したことで、インターネットはWWWのことを指し示し、ユーザーはブラウザを意識せずWWWに接続できるようになって、Webページの呼び名はホームページと確定した。 その結果、Webブラウザとかいう専門用語を知る必要なく「Yahoo！見れる？」と聞けば、IEをクリックしてくれる人が沢山いる。 これは悪か？ そんなことはない、彼らはパソコンで「インターネットに接続する」障壁を越えた人達だ。 彼らがいるから、インターネットのWebサイトを作る需要が存在する。 「Firefoxってアレがアレでね」 「Webブラウザとメーラーがあってね」 一々、こういう説明を何度も何度も何度も何度もしなくちゃいけないことに辟易しているかもしれない。
オープンソースという言葉がソフトウエア以外の分野に広まることで、良いことと悪いことがひとつづつある。 非組織的で自発的なコラボレーションの有効性が一般に広く認識され市民権を得る オープンソースでないソフトウエアがオープンソースと呼ばれてしまう危険性が高まる 私は、1.を重視して、他分野に転用してこの言葉を広い意味で使ってきた。だから「お前が言うな」と言われそうだが、オープンソースという言葉を使う時には、2.についても考慮すべきだと思う。 オープンソースとは、本来は、開発の方式ではなくてソフトウエアのライセンスを分類する為の言葉だ。オープンソースの定義 という広く認められた文書があって、これに合致するライセンスによって配布されているソフトウエアがオープンソースである。 つまり、ソフトウエアは、それがオープンソースであるかそうでないか、何の紛れもなく客観的に判定できるのだ。だから「オープンソー
”日本のWebは「残念」 梅田望夫さんに聞く”という面白い記事がアップされていました。 日本のWebは「残念」 梅田望夫さんに聞く（前編） (1/3) 日本のWebは「残念」 梅田望夫さんに聞く（前編） (2/3) 日本のWebは「残念」 梅田望夫さんに聞く（前編） (3/3) 英語圏と日本のWebの違いを、はてな取締役梅田望夫さんの視点からインタビューに答えています。でも、「そこまでアメリカのマネをしなくてもいいのでは？」と思ってしまいます。過去日本の歴史においても、欧米のマネばかりをして自国の文化を大切にしないということを繰り返してきたわけですが、現代のWebの世界で同じことを繰り返さなくても良いのではと思います。 梅田さんの考えがわかるように、発言を英語圏と日本別に箇条書きで書き出してみました。 英語圏のWebについて ・英語圏ネット空間は地に着いている ・英語圏の空間というのは、学
インフルエンザの情報公開について不適切であったことについて、感染者の家族がネットでのバッシングを懸念して事実の公表をしなかったという話があるそうな。 J-CASTニュース : 川崎市の感染公表遅れ 「ネットのせい」は本当か こうした経緯について、毎日では、「感染者を差別するネットの書き込みが公表にまで悪影響を及ぼしている」とネット上の誹謗･中傷に原因があるかのような見方をしている。 そもそも余計なことをワイドショーで映したり、言わなきゃ良い。 何を伝えて、何を伝えないのか、大事なことは何なのか？を判断して、余計なことを言わず、かつ視聴者の興味を満たしたり不安だけをやわらげる情報だけを提供すれば、それ以上の影響拡大は防げる。 言ってることが理想論すぎるかもしれないが、今の番組作りはやや煽りに徹しすぎており、関係者が失言でもすればこれ幸いと放映してしまうマスメディアが、もうちょっとソーシャルメ
その後の進捗についてまとめておきます。 10日前に英訳版「Yoshiharu Habu and Modern Shogi (written by Mochio Umeda)」が公開されました。 それについて英語で、「Emerging Open Source Translation Projects in Japan」、「Open-souce style translation project "Shogi" book」、「Shogi Project update..」といった紹介がなされました。 公開後も継続的に英語のブラッシュアップが続けられています(主に、オリジナルなプロジェクト・メンバー中心ですが)。 ウェブ上の一部では「ネイティブが入らず、日本人だけ集まったってできるわけがない」「英語のクオリティに問題がある」といったご心配をいただいているようなので、アメリカ人の友人に英語版テキス
NTTドコモは、4月より携帯電話のメールアドレスについて、ルールの変更を行った。 4月1日以降、メールアドレスを新規取得または変更する場合、新ルールが適用される。新ルールでは「○○..○○@docomo.ne.jp」（連続するピリオド）、「○○.@docomo.ne.jp」（@マーク直前のピリオド）といった命名方法が使用不可となる。すでに取得済みのアドレスについては、新ルールは適用されない。 英数字、「_」（アンダーバー）、「.」（ピリオド）、「-」（ハイフン）のみが使用可能、「スペース（空白）」は使用できないといった文字種に関しては、いままで通りで変更はない。 インターネットで利用されるメールアドレスの命名規則等については、IETF（Internet Engineering Task Force）による技術仕様「RFC」（5321、5322）が、ルールとして推奨されている。しかしNTTド
いいね！ 1 ツイート B! はてブ 86 Pocket 8 入力フォーム間の移動はマウスで行いますか？tabで移動しますか？ 例えばtabでログインフォームを移動していて、IDとパスワードを入力して、送信ボタンを押そうとする時に、送信ボタンの上にリンクがあって、間違ってリンクを押してしまい、とてもストレスを感じたことはありませんか？ 年始に興味がわくような話題ではないかもしれませんが、ちょっとしたTIPSに。。 ライブドアさんを例に出して申し訳ないのですが、ライブドアさんのログイン画面には「ID・パスワードを忘れた方」というリンクがあります。 パスワードを入力した後にtabを押すと、このリンクにカーソルが当たります。フォーム間の移動をtabで行い、最終フォームに来ると「tab + Enter」が癖になっている人に取って、このリンクを間違って押してしまうことが結構あります。リンク後に戻って
はてなフォトライフにアニメーションGIFをアップできるようになりました 本日、はてなフォトライフにアニメーションGIFをアップロードできるようになりました。 これまで、システム内部の画像変換処理に問題があり、アニメーションGIFには非対応とさせていただいておりましたが、本日システム上の問題を解決し、対応いたしました。なお、引き続きシステムの制限上、透過GIFの場合はサムネイル画像が崩れることがございますがご了承いただければと思います。 写真だけでなくブログやホームページの素材置き場としてもご活用いただければと思います。ご要望いただいたユーザーの皆さまありがとうございました。 どうぞご利用ください。 本日の検討アイデア 本日、以下の1000株達成アイデアを検討いたしました。ご要望、ご指摘いただいたユーザー様、ありがとうございました。 はてなアイデア 検討 検討します はてなアイデア 検討 検
■閲覧者に“整理券” 時間差で負担軽減 ＮＴＴグループは、ウェブサイトが混雑してアクセスしづらい時に、サイト表示までの時間や順番などを示す仮想の“整理券”をパソコン上に表示する技術を開発した。この技術をＮＴＴアドバンステクノロジ（東京都新宿区）が９月に発売するネットワーク制御機器「Ｗｅｂアクセスシェイパ２・０」に搭載する。短時間にアクセスが集中しやすい災害情報を提供する自治体などに採用を働きかけ、初年度９億円の売り上げを目指す。 新技術はサイトへのアクセスが集中した際、処理能力に余力があるサーバーにアクセスを分散する。そのうえで全サーバーの処理能力を上回る数のユーザーがサイトを閲覧しようとした場合は、アクセスを制限。サーバーがどれくらいのスピードで閲覧要求を処理しているかを計測し、待機中のユーザーに対して「あなたのリクエストは、２０番目に受け付けられました」「予想待ち時間は４０秒です」など
「いったいみんなどうしているんだろう」。会社PCのデスクトップを眺めていて，ため息が出る時がある。 会社にある私のPC（と私）は「ブラウザ氾濫症候群」に罹患しているらしい。ちょっと油断すると，10も20もブラウザが開いた状態になっている。単に沢山開いているだけならいいのだが，問題は目的の画面が埋もれてしまうことだ。 そもそも何でそんなに開いているのかと思うが，驚くようなものは開いていない。Webメールの受信画面と送信画面，グループウエア，記事を登録するためのシステム（Webベース）とその確認画面などでまず5画面前後。さらに，調べ物のために開いた社外サイト4～5画面（そしてITproも）を加えると，10画面にはなってしまう。みなさんはどうですか？ こうなると，見たい画面はなかなか見つからない。「タスクバーをクリックすれば一覧が出てくるでしょ」と言われそうだが，どういうわけか肝心な画面がそこに
Squidを検索する度に最初に表示される画像検索の結果に吹き出しそうになる開発部・システム運用グループの長野です。前回のロングテールな画像配信のその2ということで、実際の画像配信システムについて書かせて頂きます。 ■プロフィール画像の配信について 前回紹介しましたが、mixiにおいてプロフィール写真を設定を設定しているユーザ数は全体の約70%、1,000万人の方が設定をされています。現在配信をしているプロフィール画像のサイズは180x180、76x76、40x40と３サイズあり、合計3,000万以上のファイル数になっています。また、もっともよく使われる76x76のサイズ1,000万件において、1日にアクセスされる画像の数は800万ファイル以上、うち97%が30回以下と非常に広範囲に渡ってアクセスされています。そのため大量の画像を配信できる仕組みが必要になります。 ■配信システムの全体像 プ
Webの世界は何でこんなに広いけど狭いんだろうと思うことがあります。 Webに存在するコンテンツは、無限に広がっているはずなのに、定番で巡回するサイトはいつも同じ Webに存在するブログは無数にあるはずなのに、いつのまにかRSSフィードに登録したものしか見なくなっている 検索できる単語には星の数ほどの組み合わせがあるのに、検索してる単語はいつも同じ 数え切れないぐらいのWebサイトがあるはずなのに、検索結果で見た事があるサイトをよく発見する Webの世界で生きている人は凄くいっぱいいるはずなのに、イベント等で会う人は偏ってる 恐ろしい数のユーザがいるはずなのに(例えばはてブとか)、目立っているのはいつも同じ人達 莫大な閲覧者(ユーザ)がいるはずなのに、皆同じ口調 人の数だけ話題があるはずなのに、ほとんどの人が同じ方向を向いている時がある 無限に広がるWebの世界への入り口として私が使ってい
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く