2014年10月第1週号 1位は、ユーザー中心のWebデザインのための8つのチェックリスト、気になるネタは、「曲がるiPhone 6 Plus」を検証。サムスンGALAXY Note 3やLG G3、HTC Oneと荷重テスト動画

ネットで見かけたWebテク（Webテクニック・Webテクノロジー）記事から、Webデザイナーの目で厳選したネタを週刊で紹介するこのコーナー。今回は、2014年9月22日～9月28日の間に見つけた記事のベスト5です。

ユーザー中心のWebデザインのチェックリストです。

2については、安定したサーバーを使い、読み込み速度を上げて、モバイルでも閲覧しやすくし、シンプルにすることが必要だと解説されていました。

8の、サイトの動作テストは立ち上げ時だけでなく定期的に行わなくてはならないというのは、気をつけたいと思いました。

Googleが提唱するマテリアルデザインを元にした、Bootstrap3用のテーマです。

ボタン類を押した時の反応として、押した場所から広がるエフェクトがしっかり実現されています。

フォームの要素にもそれぞれエフェクトが付いていて、操作感がよさそうですね。

歴代iPhoneの画面サイズと解像度とをまとめています。

Pointsが論理上のピクセルで、Physical Pixelsがデバイスピクセルということですね。

Rendered Pixelsはレンダリング時のピクセル数なのですが、iPhone 6 PlusではPhysical Pixels（デバイスピクセル）と違っています。

iPhone 6 Plusでは、内部的には論理ピクセルの3倍のサイズ
（1242×2208）でレンダリングして、表示する際にデバイスピクセルの1080×1920にリサイズしているというわけです。

なお、この情報を提供しているPaintCodeは、ベクターベースでUIを作成してコードで書き出せるツールを提供しています。

WebデザイナーやデベロッパーのためのPR動画のアイデアと実例を紹介した記事です。

実例が豊富に掲載されていますが、モーショングラフィックスやアニメーションを使ったものが多いようでした。

Webデザイナーのための優れたツールを5つ紹介しています。

ポートフォリオサイトを作れるサービスや、Webサイトで使われているフォントを調べるサービス、フリーの写真素材を探せるサービスなどが紹介されていました。

そのほか、最近の記事の中から、気になるニュース記事を3つ紹介します。

先週の気になるWebサービス

Qhueryはブラウザのウィンドウサイズを変更して色を作るだけのサービスです。

横方向が色相、縦方向が彩度となっており、ウィンドウサイズを変えることで色を変更できる仕組みになっています。誰でも操作方法がすぐ分かり、しばらく遊んでいたくなる見事なアイデアだと思いました。

「Media Queries of Colour」と名乗っているだけのことはあり、JavaScriptなどを使わずにCSSのメディアクエリを使って色を変更しています。

ソースからqueries.cssというCSSを見てみると、min-widthとmin-heightを使って細かく背景色を設定しているのが分かります。これは力技で手書きで記述したわけではなく、SCSSを使って式で書いていました。Github上で、元のSCSSのファイルを見ることができます。

iPhone 6 Plusをズボンの前ポケットに入れていただけで曲がった人がいるとか、素手で曲げた人の動画が話題とかで、「⁠ベンドゲート」と呼ばれる「曲がるiPhone 6 Plus」騒動が起きているようです。

米国の消費者情報誌コンシューマー・リポートが強度を測定したところ、他社のスマートフォンと同等で一般的な使用には問題ないという結論になったとのこと。

iPhone 6 Plusを曲げるのには40kgほどの力が必要で、鉛筆4本を束ねて折れる力程度だそうです。鉛筆によっても強度が違うような気がしますし、日本の鉛筆の方が質が良くて頑丈なイメージもありますが、どうなんでしょう。

何にせよ、iPhoneだからこそこれだけ話題になるんですね。1万円札と同じくらいの大きさだとか、鉛筆4本と同じくらいの強度だとか、意外な比較対象が出てくるところも面白いですね。