Screenqueri.es

Web Service

ブラウザ上でレスポンシブWebデザインを確認することができるツール「Screenqueri.es」

ブラウザ上でレスポンシブWebデザインを確認することができる便利なツール「Screenqueri.es」を使ってみました。iPhoneやiPadはもちろん、SAMSUNG、HTC、BLACKBERRY、LGなど色々なデバイスの確認がとても簡単にできます。レスポンシブなデザインを作成する時に役立ちそうですね。

[ads_center]

使い方

画面上にある「Enter URL」の欄に確認したいサイトのURLを入力して「View」をクリックするだけでOKです。とても気軽に確認できます。

Screenqueri.esの使い方

実際に確認してみると、こんな感じです。

実際に確認

スマートフォンやタブレットのアイコンをクリックすると、たくさんのデバイスの中から選択することが可能です。任意のデバイスをクリックするだけで、そのデバイスに合う表示サイズに切り替わります。

↓ スマートフォン

各スマートフォンのデバイス

↓ タブレット

各タブレットのデバイス

「Rotate」をクリックすると、縦と横の向きを切り替えることができます。

縦と横の向きを切り替える

「Save」をクリックすると、自分の確認したページを保存することができます。再度、確認したい時なんかに良いですね。

このように、ブラウザ上で様々なデバイスでの表示を瞬時に確認できるのが最大の利点ですね。レスポンシブで作成する時には覚えておきたいツールです。

Macで一括リネームMacで画像などのファイル名を一括リネームするために「Automator」を使ってみる前のページ

レスポンシブなデザインを瞬時に確認する為のブックマークレット「Responsive Design Bookmarklet」次のページResponsive Design Bookmarklet

関連記事

  1. Noise Texture

    Web Service

    手軽にノイズテクスチャの画像を作成できるツール「Noise Texture」

    手軽にノイズテクスチャの画像を作成できる便利なツール「Noise Te…

  2. Web Service

    文字はいらない!Webサイトを画像だけで楽しむことができるブックマークレット「Wordless We…

    おもしろいブックマークレットがあったのでご紹介します。Webサイト上に…

  3. Web Service

    CSS Sprite用の画像やコードを簡単に作成してくれるCSS Sprite Generatorを…

    すごい今更なんですがCSS Spriteを初めて試してみました。自分で…

  4. Web Service

    ブログで使うCC(クリエティブコモンズ)対象の画像をFlickrやGoogleから簡単に探してくれる…

    ブログでその記事に関連するアイキャッチ画像を入れたりしたい時があるかと…

  5. Streaksで特定の曜日をスキップ

    Web Service

    継続日数をカウントできるiPhoneアプリ「Streaks」で特定の曜日をスキップさせるやり方

    普段、何か継続・習慣化させたい事がある場合にはiPhoneアプリの「S…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

  1. ユニクロ エアリズム マイクロメッシュVネックT(半袖)
  2. ライオン システマ 超コンパクト ふつう
  3. タリーズ ハムチーズ&サラダサンド
  4. クリニカのY字タイプのフロス
  5. 日和山公園の桜

アーカイブ

PAGE TOP