Streaming live at 10am (PST)

Online tools for responsive testing - webflow project didn't appear?


#1

Hey guyz,

i tried to make my web project fully responsive for all devices. The problem is that webflow shows something completely different than the real tablet devices... I tried to make responsive layout for tablets in portrait mode. With webflow tablet builder, everything looks pretty but when I load page with real tablet device (some kind of 8'' Samsung) layout is totally broken.

so i tried to use 3d party tools. I found online responsive soulutions like:

http://ami.responsivedesign.is/
http://responsivetest.net/
http://www.isresponsive.com/
http://responsivedesignchecker.com/

and many others.... But when I insert my published web into this tool, it doesn't appear. Dunno why. So my question is, does webflow block this tools or just don't support them?

Many thanks.

@cyberdave smile


#2

There was someone with the same issue yesterday. Wefound that it's because webflow sites use subdomains urls (something.webflow.com) and those renderers won't work. Howerver, there was a "proxy" setting that was helpful.

Check here: http://forum.webflow.com/t/see-website-on-different-devices/10638/7


#3

Hi @Michal, thanks for your post. First, Webflow's breakpoints are:

992px and over --Desktop
991px and lower -- tablet portrait
767px and lower -- mobile landscape
479px and lower -- mobile portrait

Try to design your site using responsive techniques, such as using percentage based widths for your layout. The renderers you mentioned to test your site, will not work if they are using iframes to load the site. A tool such as Browserstack.com however, uses actual virtual sessions for devices, using actual operating system and exact dimensions. We use Browserstack ourselves at Webflow for testing, and it is a good service to get real world testing on different devices.

Cheers, Dave smile


#4

Hi,

but thats not the only breakpoints. webflow supports many smartphone and we have the same problem. testing a mobile website on different smartphone is not very comfortable. Chrome has a device extention, but webflow sites doesn't work. it must be exported to test it on a simulator. hm.

Everyone must have a responsive site, but such testing tools should be a standard.


#5

Hi,

or this little tool helps a bit. smile

http://lab.maltewassermann.com/viewport-resizer/


#6