Join Log in
Score:2
whtyger avatar Ubuntu

Fix WebKit font rendering in 20.04

ph flag
whtyger

I use cutycapt to make screenshots of web pages. When I switched from Kubuntu 16.04 to Kubuntu 20.04 I noticed that font rendering quality degraded significantly. I made several screenshots of the same page and enlarged the same fragment on both screenshots for comparison. Command which was used:

cutycapt --out=screenshot.png --url=http://www.debianadmin.com/how-to-disable-ipv6-in-debian.html

Here's the one made in Kubuntu 16.04 (cutycapt version 0.0~svn6-3.1, depends on libqtwebkit4 version 2.3.2-0ubuntu11):

Kubuntu 16.04

My system is set to full hinting. Letter stems on this screenshot are sharp and their hinting is obviously set to "full".
Now the screenshot made in Kubuntu 20.04 (cutycapt version 0.0~svn10-0.1build1, depends on libqt5webkit5 version 5.212.0~alpha4-1ubuntu2):

Kubuntu 20.04

All letters are surrounded by gray fringe. Take a look at the word "comment" — all stems in letter "m" have different thickness. It looks like "slight" hinting to me or even no hinting at all.
I'm quite confident that both systems are properly configured to use full hinting (in System Settings > Fonts and in /etc/fonts/conf.d/) and all other fonts obey these settings.

I tried adding .config/fontconfig/fonts.conf with contents:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE fontconfig SYSTEM "fonts.dtd">
<fontconfig>
    <match target="font">
        <edit name="antialias" mode="assign"><bool>true</bool></edit>
        <edit name="hinting" mode="assign"><bool>true</bool></edit>
        <edit name="hintstyle" mode="assign"><const>hintfull</const></edit>
        <edit name="rgba" mode="assign"><const>rgb</const></edit>
        <edit name="autohint" mode="assign"><bool>false</bool></edit>
        <edit name="lcdfilter" mode="assign"><const>lcddefault</const></edit>
    </match>
</fontconfig>

But these settings were ignored.
As far as I know cutycapt uses QtWebKit library. I don't know whether these rendering settings are controlled by Qt or WebKit engine directly. I also tried PhantomJS and wkhtmltoimage to capture screenshots in 20.04 but they produce the same blurred text. Any advices regarding tuning hinting or alternative software are welcome.

P.S. If someone knows how I can also enable subpixel antialiasing on these screenshots it would be nice.

109
0 + 0
vn flag
Pablo Bianchi
Could you provide the version of cutycapt.you are using and exactly the steps to reproduce the issue? There is any metric you are using to compare? Maybe the resolution using Imagemagick's `identify`?
1
Reply
whtyger avatar
ph flag
whtyger
@PabloBianchi Updated my post. URL can be any (I used http protocol for my example because older cutycapt have troubles opening https). `identify` shows a bit different vertical resolution for the screenshots due to more sparse rendering of text lines in the 2nd example. You can save my examples and compare them switching images by Alt+Tab -- the difference is pretty obvious.
0
Reply
user.dz avatar
ng flag
user.dz
You may try raising size using `--min-width ... --min-height ...` (as resolution is not in the options) , like in this post https://unix.stackexchange.com/questions/231482/how-to-take-higher-resolution-screenshots-with-cutycapt . Another option is to use SVG as initial output then convert it with resolution you require.
0
Reply
whtyger avatar
ph flag
whtyger
@user.dz Size is not the case, I'm aiming at text clarity. SVG output improves this clarity indeed but it is lost when this SVG is converted into PNG (I used `convert` command from ImageMagick). Moreover, `convert` fails on large images with an error _too many bezier coordinates_.
1
Reply
ธงชาติไทย
Elon Musk
I sit in a Tesla and translated this thread with Ai:

mangohost

Post an answer

Most people don’t grasp that asking a lot of questions unlocks learning and improves interpersonal bonding. In Alison’s studies, for example, though people could accurately recall how many questions had been asked in their conversations, they didn’t intuit the link between questions and liking. Across four studies, in which participants were engaged in conversations themselves or read transcripts of others’ conversations, people tended not to realize that question asking would influence—or had influenced—the level of amity between the conversationalists.