Aggregator

2012年6月30日（土） 、ベルサール九段で開催したCSS Nite LP, Disk 23「表示速度最適化」のフォローアップとして、斉藤 祐也さんの『モバイルWebパフォーマンス最適化』のスライドなどを公開します。

• スライド（PDF、103ページ、9.2MB）
• 音声

メッセージ

今回のセッションでは限られた時間の中で広い範囲の話をしましたので、特にHTML5の話で紹介した仕様の実装方法について触れませんでしたので、フォローします。

Web Storage APIについて

• HTML5のlocalStorageでiPhone用Webアプリを高速化 / @ITより
  
• localStorageを利用した基本的なデータの保持の方法についてのデモ
  

Add a taskのインプットに文字を入力してaddをクリックすると文字が追加されます。
ウィンドウを閉じて、再度ページを開いてみてください。先ほど入力した文字が保持されています。
Google Chromeを利用している場合はデベロッパーツールを開いてリソースタブからLocal Storageにデータが格納されているのが確認できます。
またここから削除も可能です。

localStorageを利用したパフォーマンス向上のデモ

このページでは地球各地の情報をWikipediaやOpen Street Mapなどから収集し表示しています。 ページ上部のアルファベットのナビゲーションからJをクリックしてJapanを開いてみてください。それから、別のページを開いて、もう1度Japanを開いてみると先ほどJapanのページを開いたよりもかなり読み込み速度が早くなっていると思います。localStorageを利用してリクエストを再度送信しない設定になっています。

pjaxについて

第19回HTML5とか勉強会にてこまつ けんさくさんが
pjax ?HTML5時代のAjaxサイトプラクティス?というタイトルにて発表したスライドです。

jQuery-pjaxのデモサイト

githubのCEOであるdefunktことChris Wanstrath氏によるpjaxのjQueryプラグイン。
デモサイトはちょっと分かりづらい所にpjaxを有効にするチェックボックスがあるので、1度無効のままリンクをクリックし、キャッシュを空にして、pjaxを有効にしてもう1度試してみてください。

最後にパフォーマンスはもちろん、フロントエンド側のウェブ制作にまつわる最新情報をTwitter @ cssradarにて紹介しています。

セッション前に鷹野さんからも紹介いただきましたが、CSS Radarというブログも運営しております。

2012年6月30日（土） 、ベルサール九段で開催したCSS Nite LP, Disk 23「表示速度最適化」のフォローアップとして、石本 光司さんの『Measuring Web Performance - 自己満足で終わらないためのパフォーマンス計測 -』のスライドなどを公開します。

• スライド（PDF、81ページ、5.2MB）
• 音声

セッションの最後にも言いましたが、パフォーマンス対策はのめりこむと際限がないので計測ツールで費用対効果を確認しつつ早めに切り上げて、その分をよりよいデザイン・機能実装できるように当てたほうが価値のあることだと思います。今回はご清聴ありがとうございました。

セッションの最後にも言いましたが、パフォーマンス対策はのめりこむと際限がないので計測ツールで費用対効果を確認しつつ早めに切り上げて、その分をよりよいデザイン・機能実装できるように当てたほうが価値のあることだと思います。今回はご清聴ありがとうございました。

GAでのソーシャル計測とパフォーマンス計測の詳しい解説は以下の記事を参考に。
-Navigation Timingを使ってパフォーマンス計測（Google アナリティクス） | MOL

HTTPリクエストの比較動画とHTML
-Minimize HTTP Requests! Requests 30 vs 1 (CSS Sprite) - YouTube

https://dl.dropbox.com/u/356242/http/sprite.html
https://dl.dropbox.com/u/356242/http/before.html

この比較動画はWebPagetestのVisual Comparisonを使用すれば作成できます。
-WebPagetest - Visual Comparison

WordPressのブログで2段階認証を実装する方法を解説する。設定方法は簡単で、Googleアカウントの2段階認証を有効にしたうえでスマートフォンのGoogle認証アプリとWordPressのGoogle Authenticatorプラグインを利用するだけ。不正ログインを防ぐためにぜひ実装したい。

- Google AuthenticatorプラグインでWordPressブログを2段階認証に設定する方法 -

Posted on: 海外SEO情報ブログ - SuzukiKenichi.COM

イベント概要

賛助会員様向けイベント 「HCDとサービス」 を開催いたします。HCDによる製品やサービスの開発事例を、4社のキーパーソンの方に発表していただきます。また、分野を超えた皆様方の交流を促進すべく、意見交換の場としてラウンドテーブルの時間をご用意しました。
皆様の積極的なご参加をお待ちしております。

■ 名称：HCD-Net賛助会員様向けイベント 「HCDとサービス」

■ 日時 ：2011年12月21日（金）
13:30　受付開始
14:00～18:30　講演＋ラウンドテーブル
19:00～21:00　懇親会

■ 会場：文京シビックセンター26階　スカイホール
東京都文京区春日1－16－21
アクセス
東京メトロ丸ノ内線・南北線　後楽園駅　直結
都営地下鉄三田線・大江戸線　春日駅　直結
JR中央・総武線水道橋駅　徒歩約10分

■ 主催：NPO法人　人間中心設計推進機構

■ 内容：

■講師プロフィール：
末吉 隆彦 氏
（クウジット株式会社 代表取締役社長）
1992年ソニー入社。ソフトウェアプロジェクトリーダーとして、VAIO　C1などのノートパソコン商品化に尽力。2005年よりソニーコンピュータサイエンス研究所へ。2007年、「PlaceEngine」のサービス立ち上げと企画運営を開始し、同年7月、クウジット株式会社を設立、代表 取締役社長就任。

本田 樹 氏
（NHN Japan株式会社 UXデザイン室 UXチーム）
2005年 NHN Japan入社。ユーザビリティテストやインタビュー、利用状況の分析等を通してNAVERのサービスを改善する取り組みを担当する。2011年よりLINEのプロジェクトに企画メンバーとして参加。LINEのリサーチや改善を担当している。

水田 英樹 氏
（楽天証券株式会社　編成部兼マーケティング部）
2004年12月楽天証券入社。トレーディングツールの企画・開発を担当。FX取引専用のPCアプリ「MARKETSPEED-FX」にてグッドデザイン賞2012を受賞。また、2009年よりウェブサイトのフルリニューアルを担当。リモートユーザーテストによるUXスコアの測定など継続的な改善を実施している。

馬場 沙織 氏
（株式会社ミクシィ　ユーザーサービス本部メディア統括部　デザインユニット）
大学ではビジュアルコミュニケーションデザインを専攻。Web制作会社で情報設計・ビジュアルデザインを、Webアプリ開発会社で動画共有サービスなどのUI設計を行う。2007年10月ミクシィに入社。人間中心設計の重要性を感じ、産業技術大学院大学の人間中心デザインの履修証明プログラムを受講。1年前に社内にUXDチームを立ち上げ、導入推進と実践サポートを行っている。

■参加費：　賛助会員5,000円、正会員6,000円　一般　8,000円　（懇親会費込み）

■定員：40名

■参加申込方法
タイトルを「HCDとサービス 参加希望」として
以下の内容をhcdnet_registration@hcdnet.org までご連絡ください。
-------------------------------------------------------
氏名：
所属：
電話番号：
メールアドレス：
懇親会（お選びください）：　出席・欠席
会員種別：　賛助会員・正会員・一般
-------------------------------------------------------
請求書をご希望の場合は本文にその旨と、請求書のあて先と郵送先をご指定ください。
受付メールを事務局より返信いたします。
参加費の支払い方法の案内は受付メールに記載されています。
受付メールが2、3日（土日祝日を除く）で届かない場合は事務局にご連絡ください。

12月21日、HCD-Net主催による賛助会員向けイベント「HCDとサービス」を東京都の文京スカイホールにて開催しました。 本イベントはHCD-Netの賛助会員様に向けて、毎回異なるゲスト・テーマで企画しているものです。 今回は「HCDとサービス」というテーマのもと、勢いがあるネット系やコンテンツ系の企業のUX担当の方をお呼びしました。 ゲストとしては、ミクシィの馬場沙織氏、楽天証券の水田英樹氏、NHN Japanの本田樹氏、クウジットの末吉隆彦氏にご講演いただきました。

馬場氏にはmixiの開発現場でどのようにHCDの導入推進をしてきたか、具体的な調査事例のご紹介をしていただきました。

参加された皆様、お疲れ様でした。 来年のHCD-Netの活動へのご協力もよろしくお願いいたします。

HCD-Net 広報社会化委員 石野正剛