ウェブページの高速化のために読んでおきたいサイトのまとめ
ユーザビリティの改善や検索エンジン対策としてウェブページの読み込みスピードの高速化は非常に重要です。ということで、ページの読み込みスピード向上のために役立つサイトをまとめてみます。 ページ読込速度の重要性 次の事例にあるように、ユーザーは表示速度に敏感です。 Googleによるとページの読み込みが0.5秒遅くなると、検索数が20%減少する Amazonによるとページの読み込みが0.1秒遅くなると、売り上げが1%減少する そして、Googleのアルゴリズムにウェブページの読み込み速度が追加されて以降、サイトの高速化への注目度は高まっています。 Google、ウェブページの読み込み速度をアルゴリズムに取り入れたことを発表 | 海外SEO情報ブログ Googleがついに順位決定に表示速度を使い始めた（公式発表） | Web担当者Forum Google、検索順位にページ読込速度の考慮を開始 [詳
スマートフォンサイト作成の参考になるギャラリーサイトのまとめ
このブログではないですが、Google Analyticsを見るとスマートフォンからのアクセスが結構あったので、スマートフォン向けのサイトを作ってみようと思いました。 ただ、スマホ向けのサイトは作ったことがないので、まず実際に色んなサイトを見て参考にしようと思い、ギャラリーサイトを調べてみました。 国内ギャラリー まずは国内サイトです。iPhoneが中心になっています。この3つのほかにも色々ありましたが、内容的には似ているので、更新頻度や使いやすさなどを基準に選びました。 iPhoneデザインボックス 画像が大きく見やすいです。個別ページでは画像も多くPCサイトとの比較もあってとても使いやすいです。カテゴリもしっかりしています。 iPhoneデザインアーカイブ 掲載サイト数が多く、更新頻度もかなり高いです。 スマートフォンサイト集めました。 すっきりしたデザインで見やすいです。カテゴリも業
ページタブアプリ(iframe)の作成とFacebookページへの追加方法
すでにお持ちの方も多いと思いますし、設定自体簡単ですのでFacebookページ自体の登録方法は割愛させていただきます。 ページタブアプリの作成方法 まず、Facebook開発者にアクセスしましょう。 右上にある「新しいアプリケーションを作成」をクリック。 アプリの名称を入力します。 Herokuを使ってiframe内のコンテンツを作成する場合、下の「Web Hosting」にチェックします。 Herokuは、ウェブサービスのホスティングサービスですが、私は使ったことがないので、ここからは自分でサーバーを用意することを前提に説明を続けます。 セキュリティチェックをします。ほんと見にくいです。 ページタブをクリックして内容を入力します。 今まで私は、http:// で始まるURLのみ「Page Tab URL」の欄に登録していたのですが、セキュアな接続をしているユーザーが閲覧した場合に備え、h
今さらながらGoogleのPage Speed Onlineを紹介
かなり前のことかもしれませんが、Page Speed Onlineからベータの文字が取れていたので今さらながらご紹介。知らない人はぜひチェックしてみてください。 Page Speed Online ― Google Developers 以前と比べ自然な日本語になっているような気が。。気のせいかも。 URLを入力すると以下のようにサイト高速化のための提案をしてくれます。 このように重要度の高い順に並んできます。 このブログで確認すると、重要度が高いご指摘もありますが、ソーシャルブックマークのボタンが原因だったりしてどうしようもないものもあります。 点数も教えてくれます。 87点ということでそこそこなんですかね。ちなみに、Googleは99点（さすが！）、Yahoo! JAPANは85点（勝った！）でした。 各項目をクリックするとどのようにすればよいか詳しく教えてくれます。 Twitterや
保存版！CSS3セレクタの説明書
CSSセレクタについての基礎知識 このブログで何回も説明していますが、念のために説明します。 CSSセレクタはスタイルを適用する対象を指定するものです。普段何気なく使っているclassやidなどもセレクタの１つです。 セレクタ表の説明には属性や要素といった堅苦しい用語が出てきますので図で簡単に説明します。 私のように基礎から勉強していないと、要素や属性と聞いてもピンときませんが、知ってみるとなんてことはないですね。 あと親子関係や兄弟関係などもあまり聞きなれないかもしれません。下の階層にある要素との関係が親子関係で、同じ階層にある要素同士の関係が兄弟関係です。 あと、CSS3と聞いて「どうせIE8以下はダメだし使えない」と思う方もいるかもしれませんが、セレクタに関しては簡単に対応できます。 IE6～8でもCSS3セレクタが利用できるツールの決定版「Selectivizr」をご参考に。 それ
CSSセレクタ20個のおさらい
CSSセレクタって意外と分かっていなかったりするので勉強ついでにまとめてみました。比較的実用的かなと思うものを20個紹介していきます。いい復習になればと思います。 CSSセレクタはスタイルを適用する対象を指定するものです。普段何気なく使っているclassやidなどもセレクタの１つです。 属性や要素といった堅苦しい用語が出てきますので図で簡単に説明します。 私のように基礎から勉強していないと、要素や属性と聞いてもピンときませんが、知ってみるとなんてことはないですね。 また、IEが対応しきれていないCSS3のセレクタもありますが、IE6～8でもCSS3セレクタが利用できるツールの決定版「Selectivizr」 で紹介したようにCSS3セレクタはie対策も容易なのでぜひお試しください。 SelectivizrはCSSを外部ファイルで指定した方がいいのですが、今回のサンプルはCSSを外部ファイル
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
