[Wallpaper] iOS 7の壁紙サイズのまとめと、壁紙配布サイトまとめ
iOS 7になって壁紙にパララックス効果（視差効果）が導入された事により、壁紙用とされる画像サイズが変わりました。今後の備忘録も兼ねて各デバイスごとに適切とされる画像サイズを一覧にしておきましたので、壁紙自作する場合の参考になればと。あとこの新しいサイズに対応した壁紙の配布サイトもいくつか見つけたのでまとめておきました。壁紙収集癖のある人に是非これひとつ。
Tag Archives: iPad
[Generator] PlaceIt – 任意の画像をモバイルデバイスのディスプレイにハメ込んでくれるサイト
任意の画像をドラッグ＆ドロップするだけで、用意されているモバイルデバイスのディスプレイにハメコミ合成してくれるサイト。実はこれ以前にも紹介してるんですが、対応デバイスが増えたのとドメインが変わってたので改めて紹介。以前はiOSデバイスがメインだったけど、Androidデバイスが一気に増えてました。とは言ってもこのサイトで生成できる画像は主にイメージ画像的なアレなので、Apple製に比べてデザインに劣るAndroidデバイスを使った画像にどれだけの価値があるのかは微妙かもしれません。あと少ないですがラップトップの素材も用意されています。画像ならスクリーンショット以外でも対応しているので、好きな画像を放り込んで合成できます。ちょっとした素材作りに便利ですね。
[Responsive Layout] CSS Media Queries for iPads & iPhones – iOSデバイス向けのメディアクエリまとめ
iPhoneとiPad向けのメディアクエリ指定をまとめたページ。機種に分けてにまとめられていて、それぞれの世代ごとにブレークポイントの指定方法が細かく解説されてます。レスポンシブレイアウトを使ったスマートフォン対応をする際に参考になりますなこれ。サイトの内容とはあんまし関係ないけど、このページ画像１つも使ってないんですよね。なんかこうWebフォントとかボックスシャドウとかウマく使って小奇麗に作ってあるなぁとしみじみ思いました。
[CSS Framework] Magazine Grid – iPadでの誌面風表示に適したCSSフレームワーク
iPadでWebを誌面風に表示するのに適したCSSフレームワーク。一般的なグリッド数によるレイアウト方式で、見たところページ送りの機能なんかもあるっぽいです。サイズも軽く、サクっとiPadに対応したサイトを作る際に使えそうです。けどこれ系の単独デバイスものは複数デバイスに対応させる用途には逆に向かないのかもしれません。試してないので何とも言えませんが。
[Hardware] Viewport Sizes – 各種モバイル端末のハードウェアスペックを網羅したサイト
様々なモバイル端末のハードウェアスペックを検索できるサイト。ズラーっと並んでますが、画面上部の「Filter」エリアにタイプする事で抽出ができます。iPadなども掲載されているのでモバイルフォンだけでなくタブレットも対応内のようです。掲載されている情報はプラットフォーム、出荷時のOSのバージョン、縦と横のディスプレイドット数、発売日の5つ。端末のハードウェア情報としてはミニマムではあるけど、OSのバージョンとディスプレイ解像度だけでもこれだけ簡単に検索できれば便利っすね。MobileApp作る時などに重宝しそうです。
[iOS] Icon comparison: iOS 6 vs iOS 7 – フラットUIになるiOS7のアイコンと、旧アイコンとの比較
iOS 7ではフラットUIとなり、その流れでApple純正アイコンも一新されます。この記事ではiOS 6までの旧アイコンと、iOS 7での新アイコンとを比較してます。左が旧アイコンで右が新しいものという形で一覧されてます。視認性の良い悪いについてはともかく、こうして並べてみると結局のところコレって好みの話だよなぁ・・・とか思いました。けどSafariの新アイコンは微妙だなー。コンタクトとかリマインダーはクールだと思うんだけど。まぁきっとすぐに慣れるでしょう。ジョニー・アイヴの仕事が悪いわけないんだものっ！（犬）
[Web Design] Screensiz.es – スマートフォン、タブレット、PCの各機種ごとのディスプレイサイズ一覧サイト
スマートフォンやタブレット、PCなどの各種デバイスごとのディスプレイ解像度を一覧できるサイト。3つのカテゴリをそれぞれ抽出でき、メジャーなガジェットの解像度とインチ数などを確認できます。このサイト素晴らしいのが一番右にある「Pupularity」という数値。その端末がどれだけメジャーなのかが数値で分かります。モバイルサイトやアプリを作る際にとっても役に立ちそう。
[CSS] CSS Media Queries for iPads & iPhones – iOSデバイスのメディアクエリー指定をまとめたサイト
iPadやiPad mini、iPhoneなどのiOSデバイスに対するMedia Query指定をまとめたサイト。iPadやiPhoneは機種によって解像度が違うので、それぞれどのように指定すればイイのかを機種ごとに解説してます。縦位置と横位置のそれぞれの指定方法について紹介されてます。スマートフォンに対応したレスポンシブレイアウトのサイト制作する際に便利っすねこれ。