指標についてはこちらの記事がわかりやすいのでぜひご参考ください。 これらの指標それぞれについて先ほどの順位点数を出します(0〜100)。その5つの順位点数に重みを加味して平均値を出したものが、PageSpeed Insightsで表示される点数です。 つまりどういうことか PageSpeed Inshgtsの点数はいかにファーストビューが速く完成して操作できるようになるか、それが全てということです。 例えば、同じ内容のWebページでも、 A ファーストビューが1秒で表示されるが、スクロールしたときのコンテンツはその後4秒かけて少しずつ表示される場合 B 読み込みから5秒は画面が真っ白だが、その後ページの上から下まで一気に表示される場合 PageSpeed InsightsはAの場合を高く評価し、Bの点数は低く評価します。これは実際のページ離脱の感覚として理に適っていると思います。 点数が上
ユーザーの目線でWebサイトを作ることは基本中の基本ですが、グローバルサイトを担当することになったら日本の常識を捨てて現地の状況を理解する必要があります。 アプリやWebサイトをより良く、より速く、よりアクセシブルにする手助けが私の仕事です。CalibreでWebを構築したり、メンテしたりする際にぶつかる課題について、知見が集まりました。 この1年で本当に驚いたことは、一般のユーザーがどうインターネットにアクセスしているかです。Web業界に従事しているのに、ほとんど理解していませんでした。自分たちがユーザーにコンテンツを配信する方法がいかに時代遅だったのかもわかりました。 ここ数年の進歩で、コンテンツをWebからダウンロードする速度は劇的に速くなりました。しかし、「HTMLをロードし、ほかのリソースを探してそれもロードする」という基本は変化していません。 世界中の約46.1%がインターネッ
超速! Webページ速度改善ガイドの出版に寄せて 事前に各所で告知していた通り、この度 超速! Webページ速度改善ガイド ── 使いやすさは「速さ」から始まる という共著の書籍が、技術評論社より出版されます。名前の通り Web サイトを高速化する知識を得るための本です。 本書の概要 技術評論社の Web サイトの通りですが、目次は次のようになってます。 まず1章で Web パフォーマンスとはなんなのかを、ビジネスへの影響やユーザー環境の多岐化、高度化する Web 技術などの観点で解説します。2章以降では、Web パフォーマンスをネットワーク、レンダリング、スクリプトといった技術要素に分解し、それぞれの基礎知識を抑えつつケーススタディを学んでいきます。また、8章では画像全般(画像フォーマット、最適化方法、レスポンシブなロードなど)について、9章ではネットワーク周辺の新たな技術(Servic
最近東京にこなれてきたどうも僕です。何がこなれてきたって?電子マネーさ!東京ならSuica、Edy、Waon、なんでもタッチで買えちゃうんだぜ!コンビニで清算するとき、「支払いはEdyで」と一言、そして、読み取り機にソフトタッチ。支払いのシャリーンという音とともに僕の白い歯がキラーンとかがやくのさっ! そんな東京にこなれてきた僕が、今日はjQueryを使う上で気をつけておきたいポイントを何点か紹介しようと思うよ! jQueryって便利だけど、もとはJavaScriptで、インタプリタ言語で、コンパイル時に最適化なんてされないから、書き方一つで意外とパフォーマンスに差が出てくるんだよね!開発時は高スペックのPCで見てるから気づかないかもしれないけど、あなたのサイト、低スペックマシンとかモバイル端末でみたら、もっさもさかもよ! っというわけで、jQueryを使う上で気をつけたいポイントを挙げて
はじめに Webサイトの高速化について調べてみるとCSSの@import url();は使わない方が良いという指摘をよく見かけます。 問題となるのはパラレルロード(複数のリソースを同時にロードする)ができなくなる場合があることと、CSSの読み込み順序が変わってしまうことがあるようです。 実際にどれだけ読み込み速度に問題があるのか、3つの読み込み方で試してみたいと思います。 比較する3つの読み込み方 今回はこの3つで読み込みを比較してみます。 CSSの@import url();で読み込む HTMLのlink要素で別々に読み込む Sassで@importして1つにまとめてlink要素で読み込む 対象ブラウザ 今回の検証ブラウザはChromeとInternet Explorerです。 どちらも備え付けの開発者ツールで検証します。 今回計測したサンプル サンプルはこちらに公開しているので問題があ
Google PageSpeed Insights でパフォーマンスチューニング Googleの Page Speed Insightsが新しくなったので試してみたけどかなり使いやすくなっています。Google Chrome Extensionsとしても公開されているのでChromeウェブストアからインストールできます。 インストールするとChromeのDeveloper Toolsの一番右にPage Speedというメニューが追加されています。パフォーマンスチューニングをしたいページを選んで左上の「分析」を押すだけです。 ちょっと待つと分析結果が表示されます。 結果は「高い優先度」と「中間の優先度」、「低い優先度」、「試験的なルール」に分かれているで何処から手を付けたらいいか一発でわかります。 例えば、「高い優先度」の「画像を最適化する」を見ると画像を圧縮しろと怒られます。どれぐらいファ
SEO「検索の1%がページ読込速度も加味してランキングを決定」Google Matt Cutts氏 全検索の1%ほどが、ページ速度がランキングに影響している。 公開日時:2011年10月20日 13:41 米Googleは2010年4月よりページのロード時間(読込速度)をランキング決定時のシグナル(手がかり)として利用しているが、同社のMatt Cutts氏が全検索の1%がページ読込速度を要因として検索結果ランキングに提供を与えているとコメントした。 「Googleはどのようにページ読込速度を決定しているのか?」という質問に対して同氏は、Googleツールバーをインストールし、オプトイン許可を明示しているユーザーからデータを収集して、リアルなページ速度を収集しているという。実際、全検索の1%が目立つ程度にランキングに影響している。 How does Google determine pag
twihelp.me 2019 Copyright. All Rights Reserved. The Sponsored Listings displayed above are served automatically by a third party. Neither the service provider nor the domain owner maintain any relationship with the advertisers. In case of trademark issues please contact the domain owner directly (contact information can be found in whois). Privacy Policy
日本コンピュウェア株式会社(本社:東京都港区)は、本日、同社が独自に選定した6業種におけるリーダー企業のWebサイトパフォーマンスを比較し*(註1)、業種ごとの上位ランキングを含む2011年4月度ベンチマーク結果(※当プレスリリース末尾参照)を発表しました。前回のベンチマークに続き、2011年4月1日から4月30日までの1ヶ月間の測定結果をまとめたものです。 日本コンピュウェア、2011年4月度 Webサイトパフォーマンスベンチマークを発表 ~全業種でレスポンスタイムおよび均一性が改善~ 日本コンピュウェア株式会社(本社:東京都港区)は、本日、同社が独自に選定した6業種におけるリーダー企業のWebサイトパフォーマンスを比較し*(註1)、業種ごとの上位ランキングを含む2011年4月度ベンチマーク結果(※添付ファイル末尾参照)を発表しました。前回のベンチマークに続き、2011年4月1日から4月
[追記1] 最後で説明しているproxy cacheの設定を修正しました。 [追記2] nginx proxy cacheでキャッシュしない場合の処理を変更しました。 [追記3] スマートフォンや携帯で閲覧した時にキャッシュしない設定を追加しました。 はじめに 大げさな題名ですが、今回はWordPress単体を速くするのではなく、データベースやWebサーバなどの調整、またnginxのproxy cache機能を使って速くする話になります。 サイトの構成によっては、proxy cacheは使えないかもしれませんが、使わなくても5倍程度速くすることはできましたので、参考にしていただければと思います。 今回行うチューニング一覧 DBを最適化するプラグインを導入する APCを導入してPHPを速くする MySQLを速くする 重いWordPressプラグインを外す nginx+FastCGIにする W
理由1 3秒以上表示にかかるサイトは遅いと判断 最近の研究[*1]によると表示が3秒以上かかるサイトは80%以上の人が遅いと感じます。 また、遅いと感じた人の半数は待つことをあきらめ、その79%は競合のECサイトを訪れているという報告もあります。広告費をかけてサイトに誘導しても、商品を見る前に離脱されてしまっては、それまでの努力が報われません。 [*1 参考URL]:http://www.akamai.com/html/about/press/releases/2009/press_091409.html 理由2 サイトの表示速度はSEOに影響 Googleは2010年4月9日にサイトの表示速度をランキングに含めるという発表をし、サイトの表示速度がSEOに影響するようになりました[*2]。 今やサイトの表示速度は利用者にとってストレスになるだけでなく、サイトを評価する検索エンジンにとっ
今日、ページのレンダリングが遅くなってしまうのは、サーバーの遅延や凝りすぎたページウィジェットが原因であることが多く、大きな画像のためではない。ユーザーが遅いサイトを嫌うことは相変わらずで、彼らは遠慮なくそれを言ってくる。 Website Response Times by Jakob Nielsen 2010年6月21日 ユーザーはインタラクションデザインのスピードというものに実にうるさいものである。13年前、「求められるスピード」というコラムを書いて、ユーザーが読み込みの遅いウェブページをいかに嫌うかを私は指摘した。その当時は大きな画像が応答時間が遅れる主な理由であり、ガイドラインでは画像のサイズは小さく留めるようにアドバイスしていた。 今日ではほとんどの人がブロードバンド接続を使っている。したがって、ダウンロード時間というのはユーザビリティにはもはや関係ないと思うかもしれない。それは
レスポンスヘッダにExpiresやCache-Controlを追加することで、ブラウザのキャッシュを有効活用し、ダウンロードの時間をなくす事でウェブの高速化を実現できます。またサーバ側にとってもリクエスト数を減らす事ができ、負荷の削減にもなります ApacheにはExpiresやCache-Controlを付加するmod_expiresというモジュールがありますが、Plackにはまだなかったので作ってみました。VarnishのようにWebサーバ機能を持たないリバースプロキシを使う場合には、便利なんじゃないかなぁと思います CPANにリリース済みです http://search.cpan.org/dist/Plack-Middleware-Expires/ 使い方 builder { enable 'Expires', content_type => [ 'text/css', 'appli
Webパフォーマンス計測製品を販売する日本コンピュウェアは7月12日、国内大手サイトを対象としたパフォーマンスベンチマーク調査の結果を発表した。 調査は、6月1日から30日までの1か月間、小売(カタログ通販/テレビ通販)、小売(EC)、銀行、証券、旅行(国内パッケージ旅行)、旅行(チケット販売)の6業種、計54サイトを対象に実施された。具体的には、国内大手ISPバックボーンノードに設置したテストマシンから60分ごと、24時間連続でトップページにアクセスした際のレスポンスタイム(すべてのコンテンツの読み込みが完了するまでの時間)を計測し、平均値を算出した。 今回の調査でレスポンスタイムがもっとも高速だったのは、スカイマーク(航空会社)のサイトで0.3秒、次点は三菱東京UFJ銀行の0.39秒だった。業種別の平均では、銀行が1.367秒でもっとも速く、小売(EC)の1.442秒、旅行(チケット販
本のページをめくるように、どんなWebページも素早く表示できるようにする。グーグルは以前からWebの高速化に取り組んできました。 6月22日から、米サンタクララで行われていたWebサイトのパフォーマンスと運用に関するオライリーのイベント「Velocity 2010」では、グーグルのUrs Hölzle氏がWebの高速化技術について「Speed Matters」(スピードの重要性)というセッションで紹介ています。 Webを高速化するためにどのような技術があり、あるいはどのような技術が検討されているのか、このセッションの内容を紹介しましょう。 スピードは重要だ 私が話そうとしているのは、「Speed matters」(スピードの重要性)についてだ。Webは空飛ぶジャガイモより速くなれるだろうか? どのくらい速くなれるだろうか? (参考:オペラがやってくれた! グーグルの空飛ぶジャガイモに対抗)
『MarkeZine』が主催するマーケティング・イベント『MarkeZine Day』『MarkeZine Academy』『MarkeZine プレミアムセミナー』の 最新情報をはじめ、様々なイベント情報をまとめてご紹介します。 MarkeZine Day
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く