コードの圧縮や外部ファイル化とページの読み込み速度について
なぜ、ごちゃごちゃしてるのか？ぱっと気づくのがこの2点です。 改行やスペースがほとんど使われていない CSSやJavascriptが外部化ファイル化されていない Googleとしてはソースがきれいなことよりも、読み込み速度を速くすることでユーザーのストレスを軽減したり、ファイルサイズ小さくすることでサーバーへの負荷を減らしたりすることの方が重要だと思います。 もちろんアップする前にこのような状態にしているだけで、それまではきれいに書かれているはずですが。 ということで、「コードの軽量化」と「外部ファイル化」の2点について考えてみます。 コードの軽量化について HTML、CSS、JavaScriptなどのコードは、改行やスペースを使わずサイズを小さくした方が読み込みは速くなります。 これは当然ですね。 コードの見やすさよりも読み込み速度やサーバーの負担軽減を優先するなら、できるだけファイルを
How to Create a Website Using Only iPad
2013年11月28日 Webサイト制作, 便利ツール 病院の待合室で何時間も待たされ、「暇だしWebサイトでも作ろっかなー」なんて思った事はありませんか？きっとあまりないと思いますが、今年にはいっていろいろあった私はそんな機会がたくさんあったので、いくつかのiPadアプリを使って作ってみました。作ったHTMLテンプレートは無料配布しています！そうです、アレ、iPadで作ったものだったのです。ふふ。 ↑私が10年以上利用している会計ソフト！ あると便利なスタイラスペン スタイラスペンはiPadなどのタブレットで使えるペンです。iPadを使ってお絵かきしたい人は持っているとなにかと便利。カナダのボクシングデーで$5位になっていたのでノリで買ったのがこのコ。ちょっとメーカーは覚えていないのですが、よくある無難なタイプの物ですね。書き心地は悪くないのですが、ペン先が太いので、細かい字や絵は書きづ
iframe 要素の seamless 属性を試してみた
WebKit Nightly Buildsが iframe 要素に追加された seamless 属性に対応したとのことなので、早速どんな感じになるのか確認してみました。 Last week in WebKit: Inspector's sources panel and private names ： Surfin' Safari Add seamless layout code (and pass most of the remaining seamless tests) ： Changeset 118291 WebKit 現在公開されている WebKit Nightly Builds の最新版、及び Google Chrome も、開発者向けビルド （Dev channel） の最新版 「21.0.1155.2」 で動作しているのが確認できました。インストール済みの方は下記にデモページ
Twitter.comの読み込みが高速化 5分の1に短縮 - ITmedia ニュース
Twitterが、パーマリンクでのハッシュバング排除やレンダリング設計の改定で、Twitter.comのパフォーマンスを向上させた。 米Twitterは5月29日（現地時間）、Twitter.comをアップデートし、読み込みにかかる時間を従来の5分の1に短縮したと発表した。今週中に新生Twitter.comに切り替わる見込み。 まず、ページ上のパーマリンク（永続的なリンク）に含まれているハッシュバング（#!）を排除した。ハッシュバングはAjaxを利用するための仕組みだが、JavaScriptがパスを解釈する分、読み込みに時間がかかる。これを排除することで、パーマリンクの読み込みを速くしたという。 また、外部のWebサイト上でツイートのリンクをクリックしてからTwitter.comでそのツイートを表示するまでの時間を短縮するために、まずサーバでページのコンテンツをレンダリングしてからJava
[CSS]拡大表示する際、CSS3でぼよよ～んとしたアニメーションを加えるチュートリアル
サムネイルを拡大表示する際など、単にズームするだけでなくCSS3を使ってバウンドのアニメーションを加えるスタイルシートのチュートリアルを紹介します。 デモページ 実装 HTML 中央に配置する領域をdiv要素で確保し、スライドするパネルはdiv要素で、各アイテムはリスト要素で実装します。 <div id="item-receiver"></div> <div id="thumbnail-wrapper"> <img src="images/plus.png" id="plus" width="60"> <ul class="item-list"> <li><img class="item" src="images/item/craftertees.jpg" width="70"></li> <li><img class="item" src="images/item/gene.jpg" w
アプリの終わりの始まり
2012年2月27日から3月1日にかけてバルセロナで開催されたMobile World Congress 2012では、特に注目の集まったGoogleやFacebookのキーノート以外にも示唆に富んだ興味深いセッションが多数あった。その中の1つがコンサルティング会社frogのScott Jenson氏によるプレゼンテーションであった。同氏が各地で行っているというプレゼンテーションは“Mobile Apps Must Die”というラディカルなタイトルだが、筆者は大いに共感でき、多大なインスピレーションを受けた。本稿では、同氏の論旨に依拠しつつ、アプリ環境の今後を展望する。 「アプリの海」 現在、AppleのApp Storeでは50万以上、Google Play（旧Android Market）では40万以上のアプリが提供されており、この数は日々増加を続けている。これらに加え、Window
Re: Responsiveの本当の意味を考えてみる必要がある。と思う今日この頃です。
2012年5月29日 著 Responsiveの本当の意味を考えてみる必要がある。と思う今日この頃です。という記事を読んでの感想など。 この現状で、なんでもかんでもスマートフォンやタブレットのデバイスサイズに合わせるWebサイトが果たしてResponsive Web Design（レスポンシブWebデザイン）なのでしょうか？ デバイスの最適化と言う観点から、現状の流れは非常に疑問に思えます。 すべてのWebサイトで闇雲にレスポンシブWebデザインを採用すべきだ、とは誰も主張していないと思うのです。少なくとも、自分の狭い観測範囲ではそう。ゆえに、なんでもかんでも......というくだりには違和感を覚えます。また、筆者の方はレスポンシブWebデザインをデバイスへの最適化として捉えているようですが、その点も違和感があります。以前、レスポンシブWebデザインと「最適化」のなかで書いたように、自分は
jQueryアニメーションにイージング（easing）処理をつけるプラグイン【イージング動作サンプル一覧】｜BLACKFLAG
jQueryで要素にアニメーション動作をつけた際、単調な動きだけでなく、加速・減速など動きに強弱のついたエフェクト、イージング（easing）処理をつけることが出来ます。 jQueryのノーマル状態では、イージング処理は「linear」と「swing」の２つが用意されていますが、プラグインを使うことによってアニメーションに多種多様なイージング処理をつけることができるようになります。 そんなイージング処理を、様々なパターンで簡単につけることが出来るプラグインを２つ、イージング動作サンプルと併せて紹介してみます。 jQuery Easing Plugin［jquery.easing.js］ jQuery Easing Plugin［jquery.easing.js］ jQuery Easing – jQuery 日本語リファレンス もはやjQueryのイージング処理では定番のプラグイン。 プラ
ソーシャル広告世界最先端 mixi Xmas、NikeiDを成功させたバスキュールが見る未来の広告とは【湯川】 | TechWave（テックウェーブ）
現在の場所：ホーム / News / ソーシャル広告世界最先端 mixi Xmas、NikeiDを成功させたバスキュールが見る未来の広告とは【湯川】 [読了時間：5分] 2010年代、広告・マーケティングが激変するー。 FacebookのPaul Adams氏はそう予測する。2010年代の10年間は、上から下への情報の一方通行ではなく、横同士の双方向の情報の流れの中での、広告、マーケティング施策がいろいろと編み出される10年間になるのだという。ソーシャル広告が花開く時代になるというわけだ。（関連記事：インフルエンサーより「仲のいい少人数グループ重視」の時代へ 書評「Grouped」【湯川】） ソーシャル広告という言葉は比較的新しい言葉。なのでいろいろな定義で使われることがあるが、シリコンバレーでは次のような定義が定着しつつあるように思う。それは「親しい友人たちの輪の中に広告メッセージを投下
URIから「modules」という文字列を削る - XOOPS Cube Legacy カスタマイズ 文系出張所
Last-modified: Wed, 03 Sep 2014 23:25:04 JST (3555d) /modules/ について XOOPSというとこの文字列を思い出す人も多いのではないだろうか。別にXOOPS界隈から生まれた造語というわけではなく、XOOPSの「X」という文字すら入っていないのに、これを見るだけでXOOPSを連想するというのは不思議である。 昔はこれが入っているとXOOPSを使っているのがわかるから消したいという人が多かったが、最近はサイト閲覧者にとって不必要な情報を持つURIのディレクトリ名は変更するか削るべきという流れに従って削除したい人が多いのではないかと思う。 まずmainfile.phpをハックする これはプリロードでは解決しないのでファイルに手を加えることになる。 まず、mainfile.phpに以下のコードを挿入する。 $GLOBALS['_rewri
拡張子のないURIへのアクセスを可能にする - XOOPS Cube Legacy カスタマイズ 文系出張所
Last-modified: Wed, 03 Sep 2014 23:25:12 JST (3555d) 拡張子のないURIについて 最近はファイルに「.php」や「.cgi」といった拡張子を付けずにアクセスさせることがトレンドである。たとえば以下のようなアドレスを見たことのある人は結構多いのではないだろうか。 ttp://example.com/login こういう風にする理由はいくつかあるらしいが、たとえば使っている言語が仮にphpだとして、 ttp://example.com/login.php としてしまうと、遠い将来、phpではなくzzzという別の言語を採用したときに、 ttp://example.com/login.zzz となってアドレスが変わってしまうので、そういったことをを防ぐためというのがある。また、使用している言語(PHP、Perl、Rubyなど)を諸々の理由から隠し
XOOPS Cube Legacy の URI - 氷川 XOOPS Module 開発室
XOOPS Cube であと気になっているのが URL が格好悪い点。 格好悪いだけでなく、サイトをPHP以外のCMSに換えたりした場合にもパーマリンクが切れるなど、よろしくありません。 Webを支える技術 -HTTP、URI、HTML、そしてREST (WEB+DB PRESS plus) 作者: 山本陽平出版社/メーカー: 技術評論社発売日: 2010/04/08メディア: 単行本（ソフトカバー）購入: 143人 クリック: 4,320回この商品を含むブログ (183件) を見る ただこれは、システムでどうこうというよりもモジュール作者の間でのお約束になると思います。Feature Request にも上がっていますが、結局、Legacy でどうこうするのは難しいので Wiki で mod_rewrite の書き方をモジュールごとに提示していくというところに落ち着きました。 ちなみに
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
インストピアニスト 仲野友恵 活動報告
Appleの最近のプロダクトで使用されているかっこいいテクスチャをさくっと作るチュートリアル
新着記事