How does Chromium browser select its default sans serif font?

Question

I am using Ubuntu 14.04, and I got problems with the fonts after installing Kubuntu desktop. For example

<html>
    <body>
        <p style="font-family: Sans-Serif;">
&#032;&#033;&#034;&#035;&#036;&#037;&#038;&#039;&#040;&#041;&#042;&#043;&#044;&#045;&#046;&#047;&#048;&#049;&#050;&#051;&#052;&#053;&#054;&#055;&#056;&#057;&#058;&#059;&#060;&#061;&#062;&#063;&#064;&#065;&#066;&#067;&#068;&#069;&#070;&#071;&#072;&#073;&#074;&#075;&#076;&#077;&#078;&#079;&#080;&#081;&#082;&#083;&#084;&#085;&#086;&#087;&#088;&#089;&#090;&#091;&#092;&#093;&#094;&#095;&#096;&#097;&#098;&#099;&#100;&#101;&#102;&#103;&#104;&#105;&#106;&#107;&#108;&#109;&#110;&#111;&#112;&#113;&#114;&#115;&#116;&#117;&#118;&#119;&#120;&#121;&#122;&#123;&#124;&#125;&#126;&#127;&#128;&#129;&#130;&#131;&#132;&#133;&#134;&#135;&#136;&#137;&#138;&#139;&#140;&#141;&#142;&#143;&#144;&#145;&#146;&#147;&#148;&#149;&#150;&#151;&#152;&#153;&#154;&#155;&#156;&#157;&#158;&#159;&#160;&#161;&#162;&#163;&#164;&#165;&#166;&#167;&#168;&#169;&#170;&#171;&#172;&#173;&#174;&#175;&#176;&#177;&#178;&#179;&#180;&#181;&#182;&#183;&#184;&#185;&#186;&#187;&#188;&#189;&#190;&#191;&#192;&#193;&#194;&#195;&#196;&#197;&#198;&#199;&#200;&#201;&#202;&#203;&#204;&#205;&#206;&#207;&#208;&#209;&#210;&#211;&#212;&#213;&#214;&#215;&#216;&#217;&#218;&#219;&#220;&#221;&#222;&#223;&#224;&#225;&#226;&#227;&#228;&#229;&#230;&#231;&#232;&#233;&#234;&#235;&#236;&#237;&#238;&#239;&#240;&#241;&#242;&#243;&#244;&#245;&#246;&#247;&#248;&#249;&#250;&#251;&#252;&#253;&#254;&#255;
</p>
        <p style="font-family: 'DejaVu Sans';">
&#032;&#033;&#034;&#035;&#036;&#037;&#038;&#039;&#040;&#041;&#042;&#043;&#044;&#045;&#046;&#047;&#048;&#049;&#050;&#051;&#052;&#053;&#054;&#055;&#056;&#057;&#058;&#059;&#060;&#061;&#062;&#063;&#064;&#065;&#066;&#067;&#068;&#069;&#070;&#071;&#072;&#073;&#074;&#075;&#076;&#077;&#078;&#079;&#080;&#081;&#082;&#083;&#084;&#085;&#086;&#087;&#088;&#089;&#090;&#091;&#092;&#093;&#094;&#095;&#096;&#097;&#098;&#099;&#100;&#101;&#102;&#103;&#104;&#105;&#106;&#107;&#108;&#109;&#110;&#111;&#112;&#113;&#114;&#115;&#116;&#117;&#118;&#119;&#120;&#121;&#122;&#123;&#124;&#125;&#126;&#127;&#128;&#129;&#130;&#131;&#132;&#133;&#134;&#135;&#136;&#137;&#138;&#139;&#140;&#141;&#142;&#143;&#144;&#145;&#146;&#147;&#148;&#149;&#150;&#151;&#152;&#153;&#154;&#155;&#156;&#157;&#158;&#159;&#160;&#161;&#162;&#163;&#164;&#165;&#166;&#167;&#168;&#169;&#170;&#171;&#172;&#173;&#174;&#175;&#176;&#177;&#178;&#179;&#180;&#181;&#182;&#183;&#184;&#185;&#186;&#187;&#188;&#189;&#190;&#191;&#192;&#193;&#194;&#195;&#196;&#197;&#198;&#199;&#200;&#201;&#202;&#203;&#204;&#205;&#206;&#207;&#208;&#209;&#210;&#211;&#212;&#213;&#214;&#215;&#216;&#217;&#218;&#219;&#220;&#221;&#222;&#223;&#224;&#225;&#226;&#227;&#228;&#229;&#230;&#231;&#232;&#233;&#234;&#235;&#236;&#237;&#238;&#239;&#240;&#241;&#242;&#243;&#244;&#245;&#246;&#247;&#248;&#249;&#250;&#251;&#252;&#253;&#254;&#255;
</p>
    </body>
</html>

gives the following screenshot in Chromium browser:

enter image description here

whereas in Firefox, I get:

enter image description here

It seems like Chromium browser chooses some other font than DejaVu Sans as the default Sans-Serif font. I wonder why, and how to make it choose DejaVu Sans instead.

Also:

$ fc-match sans-serif

gives:

DejaVuSans.ttf: "DejaVu Sans" "Book"

Open up Developer Tools and switch to the Computed tab on the right side. For me, a font of `sans-serif` gives 216 glyphs rendered in Arial and 7 glyphs rendered in DejaVu Sans. — saiarcot895, Aug 10 '14 at 16:00
@saiarcot895 Thanks, I think I found the problem.. It seems like all the default font settings in Chromium got reset when installing Kubuntu desktop. In `Settings->Web Content->Customize fonts..` all fonts was set to `Abyssinica SIL`.. — Håkon Hægland, Aug 10 '14 at 16:04

score 6 · Accepted Answer · answered Sep 03 '14 at 09:25

I think I found the problem.. It seems like all the default font settings in Chromium got reset when installing Kubuntu desktop. In Settings->Web Content->Customize fonts.. all fonts was set to Abyssinica SIL..

The fonts quality improved by selecting DejaVu font instead:

enter image description here

Example after changing:

enter image description here

Still, the quality could be improved by installing Microsoft TrueType core fonts:

sudo apt-get install ttf-mscorefonts-installer

And then changing the default font settings again to Times New Roman and Arial:

enter image description here

Example of same page after final change:

enter image description here

How does Chromium browser select its default sans serif font?

1 Answers1

Linked