Font Rendering in Vivaldi Is an Issue



  • [b]Description[/b]: The way Vivaldi renders fonts is an issue. Fonts appear muddy or overly anti-aliased, uneven and not crisp. The type face suffers greatly as a result, so does the readability. This issue can be observed wherever text appears in the browser including webpages and the browser's user interface. [b]Cause[/b]: This appears to be caused by the experimental DirectWrite font rendering system which is enabled by default. [b]Solution[/b]: Enable the Disable DirectWrite function in the browser's flag settings under [code]vivaldi://flags[/code] [b]Example[/b]: The following is a screenshot comparing the font rendering in Chrome (disabled DirectWrite, current stable version) to Vivaldi's below (default settings). Click image for true 1:1 scale. [attachment=786]font-rendering-vivaldi.png[/attachment] Attachments: [img]https://forum.vivaldi.net/uploads/attachments/34660/font-rendering-vivaldi.png[/img]



  • I have found the solution. Enabling the Disable DirectWrite function under```
    vivaldi://flags



  • DirectWrite is enabled by default, so you probably mean disabling…? The flag you're probably talking about is called "Disable Directwrite", so enabling it actually disables DW. It might be a bit confusing.



  • @Case:

    DirectWrite is enabled by default, so you probably mean disabling…? The flag you're probably talking about is called "Disable Directwrite", so enabling it actually disables DW. It might be a bit confusing.

    DirectWrite was not enabled for me by default in Vivaldi.


  • Moderator

    @LeonardMcCoy:

    @Case:

    DirectWrite is enabled by default, so you probably mean disabling…? The flag you're probably talking about is called "Disable Directwrite", so enabling it actually disables DW. It might be a bit confusing.

    DirectWrite was not enabled for me by default in Vivaldi.

    Weird. It was here.



  • The Disable DirectWrite flag was itself disabled here as well, initially, which causes DirectWrite to be enabled in the browser by default. This leaves a user to instead choose 'enable' for that flag if they so wish, thereby enabling the Disable DirectWrite functionality which, in turn, should act to disable DirectWrite functionality in the browser.



  • I'm sorry for the confusion. I cleaned up the OP. Disabling DirectWrite fixes the font rendering issue.



  • There ought to be some kind of Browser Law against having flags designed and named with "disable" in their titles and "enable" as an option legend for them. :) This convention of 'enabling the disable function' has caused untold confusion going well back into Olde Opera days (and perhaps beyond), in a number of browsers. I'm still puzzled why there can't simply be a universal convention along the lines of (in this instance): 'DirectWrite - enable/disable' toggle selector/button, with the default position simply being initially set to whichever it's supposed to be for a given function, and even including a note (if applicable) warning that it's an experimental setting, so not to carelessly mess with it.



  • What exactly is the difference between the left and right image?

    I see absolutely no difference, they look exactly the same to me.


  • Moderator

    @terere:

    What exactly is the difference between the left and right image?

    I see absolutely no difference, they look exactly the same to me.

    The one on the right is crisper and blacker, and the headline font is more compact.



  • I'm really looking very, very close and there is no difference. They are both crisp to me and honestly they look like a clone, I cannot seem to see which one is more black or better.

    I may have really vision problems but I put my nose to the monitor, very close and still can't see the difference. Maybe its your video card/driver which is rendering them differently because I'm not joking, they look exactly the same in my computer. The only difference I see is one has the word Vivaldi in it and the other one Chrome.



  • @terere:

    I'm really looking very, very close and there is no difference.

    Then you have either a bad monitor or bad eyes.

    In the second case you can be happy. All women look beautiful.



  • They're quite different.
    Attachments:



  • @terere:

    I'm really looking very, very close and there is no difference. They are both crisp to me and honestly they look like a clone, I cannot seem to see which one is more black or better. ….

    I think that illustrates something for all to keep in mind: not all users visually discern things quite the same way. Hence, not all users even notice font issues like this that drive other users crazy. I've encountered forum threads in other places regarding Windows default fonts and rendering techniques that are upsetting to some users, whereas others find it hard to grasp visually what all the complaints are about. The core problem stems from trying to clearly display curved lines in characters using essentially rectangular pixel grids. By the time you make the character big enough to provide enough dots to clearly define a curve, the character may be too big to be useful. So the answer is to use gray-tone aliasing to fool the eye by filling in parts of the sharp, jagged representation of a curve with partially-colored pixels. The problem is that two different users' eyes will perceive the result differently - one will see it as pleasing, the other see it as blurred. Hence, there seems not to be any one "best" font/aliasing technique that everyone can agree on.

    To me, the answer would seem to lie in offering the user a choice between fonts, so that he can employ whatever seems visually best for him. As to the prioritization of adding such a choice, compared with other things needing to be done in the browser, that again depends greatly on the user involved… but I'm sure the developers have their own prioritized schedule, so we'll have to wait and see when/if this gets dealt with.


  • Moderator

    Yeah. I'm completely non-picky about fonts. I can pretty much read anything, and as long as the typeface is open and elegant (as in: simple), I read comfortably and quickly. Color, density, crispness, nature of curves and edges, are all non-factors for me. That said, I can see the difference between the ways fonts are rendered, even though it makes no difference to me. In fact, people who are driven crazy by font rendering tend to drive me kind of crazy - like folks who compulsively count things, or can't stand that the flower pot is an inch from where it "belongs." These are the same class of people who sound the alarm when an element in the browser "looks terrible" because it is a pixel off-center, or because there is a single-pixel-width line between this toolbar and the next. I sympathize with such folks even though sometimes I wish they'd leave everyone alone. ;)



  • Your last line is too short.



  • Have you continued to find that the Disable DirectWrite flag permanently resolves this issue? For me, it doesn't matter if the flag is enabled; restarting Vivaldi with the flag in any state returns the fonts to normal, but they always "break" again after visiting certain sites, one of which is YouTube.



  • @terere:

    I see absolutely no difference, they look exactly the same to me.

    Agreed. At 100% there is no discernible difference. If one has to zoom in to 1600% to spot the difference, then it is meaningless.

    [attachment=1464]FontRendering.png[/attachment]

    All good women are beautiful if you judge them by their character not by their appearance.
    Attachments:



  • @terere:

    I'm really looking very, very close and there is no difference. They are both crisp to me and honestly they look like a clone, I cannot seem to see which one is more black or better.

    Just use this

    https://chrome.google.com/webstore/detail/font-rendering-enhancer/hmbmmdjlcdediglgfcdkhinjdelkiock

    Isn't perfect and may have compatibility issues in few websites, but it works, definitely.



  • Note that basically the same thing that extension does can be done via user CSS:

    HTML,p,div,span {
    	-webkit-text-stroke: 0.0px !important;
    	text-shadow: 0.15px 0.15px 0.15px rgba(0,0,0, 0.20), -0.15px -0.15px 0.15px rgba(0,0,0, 0.20) !important;
    }
    

    (This is what I use, obviously it depends on your taste regarding font rendering.)


Log in to reply
 

Looks like your connection to Vivaldi Forum was lost, please wait while we try to reconnect.