Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Responsive Design

Can anyone recommend a good Online tool or Emulator for Responsive web design.

Lush Sleutsky
Lush Sleutsky
14,044 Points

What do you mean a tool for RWD? Responsive web design is all done in the text editor of choice when coding your web pages. You just use responsive methods (fluid values, media queries, etc), and test everything in the browser by changing the size of the screen. Are you looking for a software that does this for you, or what?

Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,252 Points

Or a web application, like Screenfly. Not that does the RWD for you but emulates it so you can look for specific breakpoints without looking at the millions of devices out there or constantly resizing your browser.

Lush Sleutsky
Lush Sleutsky
14,044 Points

Oh I see. Well that makes sense. I don't know, I think just resizing the browser is the easiest and most efficient way to test your site, but different strokes for different folks I guess...

Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,252 Points

Resizing your browser, will only take you so far. It's much better to use the devices whenever you can or a tool like Screenfly.

5 Answers

Thanks for all the ideas guys, will have to look them up!

Mikkel Madsen
Mikkel Madsen
13,885 Points

You should look at adobe reflow CC or Webflow :)

Jonathan Grieve
MOD
Jonathan Grieve
Treehouse Moderator 91,252 Points

Try Googling Quirktools Screenfly. It's completely free and easy to use. :)

HI Stephanie what are you looking to achieve?

I use a mix of the dev tools in Safari when you plug an iphone in - works nice although Safari dev tools :-(

Other thing is Firefox responsive design is also pretty useful.

G

Chris Shaw
Chris Shaw
26,676 Points

Hi Stephanie,

Google Chrome and Firefox have awesome emulation tools built in that allow you to test your site against various devices sizes, Chrome also allows for retina testing so you can see what your @2x images look like before testing on a real device.

http://blog.diacode.com/responsive-web-design-browser-tools-chrome-and-firefox http://www.inpixelitrust.fr/blog/en/2-tricks-to-test-responsive-webdesign-in-chrome-without-a-plugin/