[Pro] Testing a Freeway Responsive Site Locally For Phones & iPads

Hi Guys

Can anyone point in the right direction to a tool that will check my site rendering locally - I need to check how my site performs on the iPhones and iPads


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

The (free) iOS Simulator in (Apple’s) Xcode will work with local and remote urls. But if you want to check a broader range of devices you will need a different approach.

Todd
https://xiiro.com


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hi Paul… In the past my company literally spent thousands of dollars each year with both physical devices and virtual machines so we could perform comprehensive in-house soak testing.

The below link is a service I have recently found. It appears to work quite well and if the results are as accurate as they appear from my recent usage, this service is worth every penny.

Hope you find this helpful,
Dave


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

try this
http://mobiletest.me, is free


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

try this http://mobiletest.me, is free

Huh. I checked the source code on this one and all it’s doing in wrapping an iframe inside a picture of the mobile device. While this can be useful, it really does nothing more than you can do by making your browser window narrower as it’s using your browser’s rendering engine instead of the renderer of the actual device.

For testing iOS devices, I use the iOS simulator that comes bundled with Xcode. This tool works well and employs the actual Safari for iOS engine.

For testing Windows (IE), I use the free virtual machines from http://modern.ie and run them in VirtualBox. In fact, I wrote a wikiHow article on this: http://www.wikihow.com/Test-a-Website-in-Internet-Explorer-on-a-Mac-for-Free

For testing Android devices, you’re going to need to go out and buy a few. You can pick up older used ones pretty cheaply.

Or, you can use BrowserStack.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks for all the responses and suggestions.

In my search I have also found that Google themselves offer a free browser extension named “Responsive Web Design Tester” that appears to cover cross platform devices that can be manually updated and adjusted - just wanted to share this with you all


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Paul,

Unfortunately, that tool uses Chrome’s rendering engine instead of each devices rendering engine:

RWD tester also uses the correct User-Agent, but it does not render web pages in the same way as the mobile device.

Basically, it does the same thing as shrinking your browser does.

Let me briefly give an example of why these “responsive testing” tools don’t suffice. We’ll look at iframes. Simple, eh? Set the iframe to have a width of 100%, and in Safari, Chrome, Firefox, Opera, and even IE, the iframe will flex and shrink as the viewport changes size. You even use some of these “responsive testing” tools to cover your bases. You think everything is fine and dandy, until you look at your awesome responsive website with your iPhone. Suddenly, the iframe is huge, overflowing it’s container and wreaking havoc on the layout! What’s going on here? Well, for some reason the chaps in Cupertino decided that in Mobile Safari they wouldn’t let an iframe be smaller than the website it contains. If the website inside the iframe is 960px wide, the iframe will be 960px wide, much wider than the width of your iPhone screen.

You would never know of this problem unless you checked it with your iPhone (or the iOS simulator). It worked great in all of your desktop browsers, and in the in-browser responsive testing tools! So, you search Freewaytalk, find a fix, and go happily on your way; the world is at peace once again.

There currently are only two ways to really test your website:

  1. Run the OS. This means either through a VM, or an actual device.
  2. Use BrowserStack.

Any other method/tool I’ve ever seen simply uses your browser’s rendering engine and does no properly emulate what a mobile device user will see.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Xcode enables me, tweaking and fiddling in code which is cool, so my “first choice”. Luckily enough, I’ve got a windoze machine right next to me.

Unfortunately I don’t possess a range of devices (an old iPhone 3Gs), but the idea of device labs (depending where you reside it can be called “locally :-)”) is pretty nice as well:

But one thing for sure:

The more solid a construction, the better the results. And nothing above a real device.

Cheers

Thomas


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

This is also very good: free and always under your fingertips!

Sjef


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

When It comes to testing… Use the best and most reliable tools. In the end you will save time, which is money and you will deliver a better product.

Unless someone has found discrepancy’s with the testing tools at BrowserStack, and please advise if you have, I strongly recommend them.

Testing, retesting and then even more testing and even still the web as a medium may throw you a curve ball. It is just the way of things, so there is no substitute for reliable tools and services, that help you in this endeavor.

Kind Regards, Dave


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

This site allows you to test the site from mobile devices, tablets, computers… bunch of devices…its awesome

http://quirktools.com/screenfly/


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options