[備忘録]スマホ表示を確認する色々な方法を試してみた! WebCollectorが一番便利そう!

 - 

 -  >

 -  レビュー

スマホ表示を確認するためのツールを色々試して見ているのですが、いくつかの方法が見つかって、一番便利なの見つけたので、色々紹介していきます。

NewImage

 

 

スマホからキャプチャの撮影とソースも見れるWebCollector -ウェブサイトのフルサイズスクリーンショットキャプチャー-

まず、一つ目はスマホサイト全体のキャプチャを一度で撮って効率化!WebCollectorを使ってみた | 株式会社LIGという記事を見て、WebCollector -ウェブサイトのフルサイズスクリーンショットキャプチャー-を使ってみたのですが、けっこうこれ便利ですね。

こんな感じで簡単にサイト全体のキャプチャを撮ることができますし、Dropboxとかevernoteとかに直接保存することもできるのがとても便利です。

実際の画像がこんな感じです。ちょっとこの画像では見にくいですが・・・

 

スクリーンショット 2014 10 19 17 42 41

 

使い方も非常に簡単

アプリをインストール後に、SafariでURLの先頭に「wc:」を付けるだけでアプリで自動でサイトを開くことができてます。

また、元のURLにhttp://がない場合は「wc:http://」とつけてください。

そして、Safari経由でなくても、このアプリ自体にブラウザとしての機能がついているので、直接検索したりすることもできます。(特定のサイトを見る場合はその方が基本的にその方が速いと思います。)

 

実際にアプリでキャプチャを撮影したいサイトを開いたらカメラボタンを押すと、キャプチャを撮影することができます。長い記事の場合はできない場合もありますが。

また、右のボタンを押すとソースを見ることもできます。

スクリーンショット 2014 10 19 17 47 22

 

以前[備忘録]iPhoneでソースコードを確認する方法と、WordPressで記事中にコードを埋め込む方法!という記事を書きましたが、キャプチャの撮影と一緒にできるのでこっちの方が個人的には便利そうです。

 

 

PCブラウザから確認する方法!

PCブラウザから確認する方法も探してみたのですが、PCブラウザからの表示を確認するのは、レスポンシブルデザインのサイトじゃないとあまり意味がないです。

 

Responsive Design Testing

この方法がめちゃくちゃ簡単だと思いますが、サイトにいってURLを入れるだけでこんな感じで、様々な横幅での表示を行ってくれます。

スクリーンショット 2014 10 19 18 00 06

 

他にもChromeだったら、簡単にできる方法がありましたが、個人的にはあまり便利じゃなかったです。

参照:1分で使える!Google Chromeならスマホのブラウザチェック機能はデベロッパーツールに標準装備

 

ただ、どちらの方法を使っても、スマホ版を表示してくれるのではなく、横幅を簡単に狭めて表示をしてくれるだけなので、レスポンシブルデザインのサイトじゃないとちゃんとチェックすることはできないです。

 

 

MacだったらiPhoneを同期して、チェックすることも

最後にMacの人だったらアップデートしたOSで、iPhoneの画面キャプチャを撮影することができるようです。

【開発者必見】OS X YosemiteはiPhone/iPadの画面キャプチャ動画を撮ることができる!

 

アプリの開発者的に非常に便利なようですが、動画で保存をしなくてもPCで撮影・確認しながらにすることができるのは便利そうです。

ただ、この方法はケーブルを忘れたまま外出してしまったため、ちゃんと確認はできないので、この方法を試してみたい方は、【開発者必見】OS X YosemiteはiPhone/iPadの画面キャプチャ動画を撮ることができる!で確認をして下さい。

 

 

このように色々と試してみましたが、個人的には一番最初に紹介した、WebCollector -ウェブサイトのフルサイズスクリーンショットキャプチャー-がキャプチャの撮影とソースの表示をすることができるので、便利そうです。

 

WebCollector -ウェブサイトのフルサイズスクリーンショットキャプチャー-

Facebookでシェアする

Twitterでシェアする

はてなブックマークに追加

 更新をチェックする! follow us in feedly

カスタム検索

Popular Post

Copyright© 新卒フリーランサーのブログ!2014 All Rights Reserved.