Firefox 4 goes for Incontent UI, Bye-Bye to Dialog Boxes

So, the changes in the next generation browser, Firefox 4, have already started taking place. Currently, the top priority of the developers is to show all the secondary UI as inline content i.e. no more dialog boxes. Mozilla designer Stephen Horlander posted some mockups on his blog.

There are already a lot of things that goes inline - about:config, Phishing warnings, network error pages etc. But future plans include the integration of preferences, addon manager, home tab, about:firefox. One of the good things that I like about the preferences tab design was that you could actually nagivate (using back/forward) through the preferences.


If we take a look at other browsers, Firefox seems to be lagging behind. Chrome and Opera, they have been using inline UI for a long time. This trend actually began while keeping the interface less messy for small display devices - tablets and mobiles. Nobody wants to see dialog boxes in their small screen mobile, it just doesn't work. Actually I never even liked dialog boxes, they hinder your direct interaction with the webpage.

And best of all, this will unite the firefox look and feel across all the devices i.e you will find the same user experience on both your Desktop and smartphone.

The mockups are just experimental and the designs are only for windows and mac systems. No mockups for Linux are explained by Stephen in a comment.

Designing for Linux tends to take a little longer because it doesn’t have the same kind of official baseline aesthetic as Mac or Windows. Designing something that will fit into a variety of Linux environments takes a little more thought.

2 Comments

Anon Linuxer (not verified)
July 12th, 2010 09:26 am
It's "lagging behind", not "lacking. Oy!
July 14th, 2010 12:15 am

Oops! Fixed now, thanks :)

Post new comment

  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <img> <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <blockquote> <h1> <h2> <h3> <h4> <h5> <h6> <p> <br>
  • You may post code using <code>...</code> (generic) or <?php ... ?> (highlighted PHP) tags.
  • Image links with 'rel="lightbox"' in the <a> tag will appear in a Lightbox when clicked on.

More information about formatting options

Type the characters you see in this picture. (verify using audio)
Type the characters you see in the picture above; if you can't read them, submit the form and a new image will be generated. Not case sensitive.