1034929 - Changes to the Zoom feature is needed especially for HiDPI displays.

Status: UNCONFIRMED

(Core :: Layout, defect)

Description

[Gary [:streetwolf52]]

As a user of an OS dpi of 120 (125%) many graphic components of web sites are blurry due to the use of presumably 96 dpi graphics.  Currently, the zoom feature is lacking in it's ability to mitigate this blurriness.  Here is what is needed IMO:

Text zoom and full page zoom should be able to be set to a percentage simultaneously for any page.  This will enable one to keep full zoom at 80% which will not scale up graphics and then set text zoom to a higher percentage to make text larger due to the larger dpi of the monitor.  80% is for a dpi of 120 which would actually make it 100.  This is because of the way the pref   "layout.css.devPixelsPerPx" works which uses a zoom of 100% no matter what the OS dpi is set at. Dpi's like 150 would require 50% to achieve 100% zoom.

A default text zoom and full page zoom should also be an option.  Setting this properly should be fine for most sites.

There is an add-on that I use that does all of this and does it very well. It is NoSquint.  Unfortunately the developer of NS seems to have no desire and/or time to update his add-on. To see NS at work use a dpi of 120 or more and then use the various NS options to remove blurry graphics while increasing the size of text to make it more readable.

Some sites need a combination of text zoom and full page zoom in order for the page to appear correct or nearly so.

It would be nice to be able to use full page zoom on all sites as it keeps text and graphics where they belong.  But as I said doing this causes lots of graphic blurriness which I find, and probably others find, objectionable.

Perhaps one day all web sites will become dpi aware so to speak and serve up higher resolution graphics for high dpi displays.  This isn't likely to happen any time soon IMO.

Changing Fx's zoom feature to mimic the way NoSquint handles it is a great alternative.  I've heard it mention that you now zoom like the other browsers but IMO they are also doing it wrong.

Windows itself is not affected in these ways because their icons, for example, have multiple dpi's which is served up depending on the OS dpi.  This results in crystal clear icons.

Comment 1

[Felix Miata]

(In reply to Gary [:streetwolf] from comment #0)
> It would be nice to be able to use full page zoom on all sites as it keeps
> text and graphics where they belong.  But as I said doing this causes lots
> of graphic blurriness which I find, and probably others find, objectionable.

FWIW, I find "blurry" images scaled up to maintain intended layout perspective less objectionable than images too small to see whatever detail they provide at their intrinsic sizes situated within an obviously unintended layout.

Comment 2

[Greg Edwards]

Bug 332275 seems to cover most of this request. The w3c officially abandoned text-only zoom since it broke too many websites.

One correction is that you need 66.6667% zoom to use device pixels on 144DPI, not 50%. (see Bug 982819)

Having spent the past 2 years on a 200% configuration, I've noticed that various sites are in various stages of adding high DPI support. Anything Apple is high DPI for fairly obvious reasons, but a lot of other mainstream sites are making the plunge too, at least for commonly viewed images like those in headers. Facebook, Twitter, Gmail, and GitHub have high DPI support.

Comment 3

[Gary [:streetwolf52]]

Besides graphics being blurry when running at the OS DPI setting which in my case is 120DPI, text can also become quite large if the particular page happens to use a large font size to begin with.

IMO Using the layout.css.devPixelsPerPx pref to control both the chrome and content is a big mistake. Why increase chrome items like buttons and icons too?  IMO there should be a separate pref for this.

Windows handles HiDPI very well and most Windows apps take advantage of DPI awareness and will provide higher resolution graphics if they detect a HiDPI environment.  You can almost consider every web page as a Windows app that hasn't a clue about DPI awareness and just serves up 96DPI graphics in many cases.

I realize the correct solution is for every web page to know what DPI you are running and serve up the correct graphic resolutions.  Apple might do it but the rest of the web will take forever, if ever, to catch up.  

Blurry graphics, extra large text does not make for a good web experience.  NoSquint is the best method I have found to control all of this.  I wish Mozilla would basically incorporate NoSquint as there zoom methodology in place of what is there already.

HiDPI is here.  Who uses 96DPI anymore?  A no brainer IMO.

Comment 4

[Greg Edwards]

No. Full UI scaling should be on by default. Without it, on a 220DPI monitor, text and UI chrome would *literally* be smaller than ants. The UI needs to be treated as a vector which the user can then adjust to their satisfaction. Inexperienced users shouldn't be forced to find a setting they may not understand to make things look acceptable, so it should autodetect the best settings.

Windows puts a system-wide vector scale setting in Display Properties. It's called DPI. 99% of applications don't let you override this setting. (Firefox is one of the few that does, via a hidden setting.) It's flat out wrong to disobey Windows's own scaling options. Developers doing this has led to a decade worth of compatibility hell and countless layers of OS shims to compensate.

Full vector scale is the only approach that will continue working into the future. Imagine firing up Firefox on a 1200DPI monitor and having the entire website fit behind your thumb and the UI being a tiny strip.

Web developers will catch up when they themselves are using high DPI screens, at the latest. Even now, do a Google search for "retina website" and you'll see there's lots of interest in this.