Web Service

レスポンシブ制作に役立つiPhone・iPad・Macの表示確認ツール「Respondr」

レスポンシブWebデザインを制作する上で役立つ表示確認ツール「Respondr」をご紹介します。主にiPhone・iPad・Macでの表示を確認することができます。使い方もURLを入れるだけなのでとても簡単です。

[ads_center]

Respondrの使い方

Respondr

Respondr | Responsive Design Test Suite

使い方はURLを入れてGoボタンをクリックするだけです。こんな感じで簡単にチェックすることができます。iPhoneの場合はiPhone4と5の2種類で確認することができます。

iPhoneでの表示確認

iPadでの表示もこの通り。実機に表示されるようなデザインになっているのでとてもリアルに近い感じで確認できるところがいいですね。

iPadでの表示確認

最後にMacでの確認。

Macでの表示確認

確認できるサイズ設定は多くはないですが、とりあえずiPhoneやiPadでの表示をサクッと確認しておきたい時なんかに役立つかと思います。この手のツールは多いに越した事はないので、自分なりに棲み分けして使っていきたいですね。

Image Lightboxレスポンシブ&タッチフレンドリーなギャラリーのjQueryプラグイン「Image Lightbox」前のページ

CSS3を使ってアニメーションするツールチップを実装するコード次のページCSS3を使ったツールチップ

関連記事

  1. Web Service

    好きな色、パターン、グラデーション、背景画像などを探せる「ColRD」

    好きな色、パターン、グラデーション、背景画像なんかを探すことができる「…

  2. Web Service

    ストライプの背景パターンをサクっと作ることができる「Striped Backgrounds」

    とてもシンプルで使いやすいかったのでメモがてらエントリー。背景なんかに…

  3. Minifier

    Web Service

    JS・CSSのコードを圧縮したりデコードしたりできる「Minifier」がとても便利

    MinifierというJSやCSSのコードを圧縮してくれるサービスがと…

  4. Web Service

    iPhoneアプリ「Resize Photo」を使って撮った画像を好きなサイズにリサイズする

    iPhoneで撮った画像をリサイズしたい時ってありますよね。Resiz…

  5. CSS3 Box Shadow Generator
  6. 目覚まし時計

    Web Service

    朝起きるのに便利!Macで指定した時間にアラームを鳴らしてくれるアプリ「目覚まし時計」

    Macで目覚まし時計をセットしたくてアプリを探していたらよさそうなのが…

最近の記事

  1. SRS-XB43
  2. Nu:kin
  3. フィールグッドシャワー

アーカイブ

PAGE TOP