0

For mobile-first development, I'm looking for a browser plugin to open a domain in a responsive viewport by default.

My current workflow involves designing in Firefox on the desktop, then sometimes checking mobile layouts using 'View Responsive Layouts' from the Web Developer plugin. Depending on QA feedback, who test on devices, I might look at the site in an emulator or an actual device.

But, for this upcoming project, we are focusing on mobile-first development, so I want to alter my workflow so that I am developing for mobile, first.

I understand that a resized desktop browser isn't an actual mobile device, but I want to at least take this first step. If it isn't sufficient, I might switch to primarily using an emulator or device.

Is there a browser plugin that will open a particular domain in a mobile-sized viewport by default? I use Firefox primarily, but I'm open to any major browser if a plugin is available for something other than Firefox.

The responsive layout resizings that the Web Developer plugin offers are:

  • Mobile portrait (320x480)
  • Mobile landscape (480x320)
  • Small tablet portrait (600x800)
  • Small tablet landscape (800x600)
  • Tablet portrait (768x1024)
  • Tablet landscape (1024x768)
2
  • 1
    Not an answer, but maybe a hint: You're aware of the Shift-Crtl-M hotkey to switch to the "mobile layout" in Firefox on desktop? I find that fast enough, but YMMV of course. For the remains, it might be helpful to mention what OS you're using on your desktop, and what browsers you would prefer.
    – Izzy
    Commented May 5, 2016 at 21:02
  • @Izzy that seems quite useful to me; I would accept that as an answer! (But I will wait a little longer for more people to chime in :)
    – user151841
    Commented May 5, 2016 at 21:26

1 Answer 1

1

Originally supposed to be a comment, but on request of the OP expanded to an answer:

You won't need an additional plugin for that, and even can stick to your current browser named Firefox: Instead of playing golf with the mouse going via Tools › Web Developer › Responsive Design View, simply hit Shift-Ctrl-M to achieve the same. That's not too much overhead, and quickly achieved. YMMV, but to me this is fully satisfying.

  • fits all your requirements concerning the layout sizings (obviously)
  • comes absolutely at no cost
  • is fully compatible with your current browser
  • just requires hitting a single shortcut (Shift-Ctrl-M)
  • but unfortunately won't open a configured domain in "responsive design view" automatically (this is where it falls short), unless I've missed something.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.