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

    簡単にグラデーション、角丸、ボックスシャドウなんかを作成できるジェネレーター「CSS3 Genera…

    グラデーションや角丸、ボックスシャドウなどのCSS3コードを生成してく…

  2. Web Service

    黄金比を自動計算してくれる便利なツール

    サイトをデザインする時に黄金比を取り入れることによって見栄えが良くなり…

  3. Web Service

    Chromeのダウンロード履歴を自動で消去してくれる拡張機能「Always Clear Downlo…

    ちょっと良さげだったので入れてみました。Google Chromeのダ…

  4. TodaysList

    Web Service

    シンプルで美しいToDoリスト「TodaysList」

    とてもシンプルで美しいToDoリストを発見したのでご紹介します。「To…

  5. CSS Button Generator

    Web Service

    シンプルでお洒落なCSSボタンを作成できる「CSS Button Generator」

    とても良さそうだったので使ってみました。シンプルでお洒落なCSSボタン…

最近の記事

  1. ダミアン・ハースト 桜
  2. パッキングエリア
  3. あらびきソーセージパイ
  4. REACH フロス
PAGE TOP