1491154 - Switch body text from Verdana to Arial

Status: RESOLVED FIXED

(developer.mozilla.org Graveyard :: General, enhancement, P1)

Description

[Eric Shepherd [:sheppy]]

Attachment: JavaScript page appearance

While the improved load times are a great accomplishment, we may have compromised text legibility a little too much. But the problem is generally visible, even while reading content. Among other issues I'm having:

* The new styles cause a lot of the text to have character spacing that's noticeably wider, sometimes enough so to look like there is one or more space characters between characters. While I see this throughout the text, it's particularly visible with strings such as "{{", where there's a large gap between the braces.

* Interestingly, what I see when I look at pages does not match the screenshot found at https://github.com/mdn/mdn-fiori/wiki/MDN-Web-Fonts#article; I will attach a shot of what I see.

* Forcing the text rendering to use greyscale rather than the default subpixel rendering leaves the text much lower contrast than before, leading to it being uncomfortable to read and feeling slightly fuzzy.

Comment 1

[Eric Shepherd [:sheppy]]

Attachment: Editor text appearance in Verdana

Comment 2

[Eric Shepherd [:sheppy]]

Attachment: Editor text appearance in Verdana

Comment 3

[Eric Shepherd [:sheppy]]

Attachment: Editor appearance in Open Sans

Comment 4

[Eric Shepherd [:sheppy]]

The two "editor appearance in" files I've attached show what I see if I use the current default style versus what I see if I change Verdana back to Open Sans, leaving all else alone. The character spacing becomes much better.

Comment 5

[Eric Shepherd [:sheppy]]

More that I just noticed: when a link occurs within a <code> block, the contrast difference between the link color and the background is very low given the stroke size of the text.

It feels like perhaps finding a way to stiffen up the strokes of fonts just a little if possible would make a big difference. They're all just a little anemic compared to the old styles, so things just blend together more.

Comment 6

[Florian Scholz (Open Web Docs)]

We're changing Verdana to Arial.

Comment 7

[John Whitlock [:jwhitlock]]

I merged https://github.com/mozilla/kuma/pull/5023, which sets the font to Arial and adjusts several element sizes accordingly.

Comment 8

[[github robot]]

Commits pushed to master at https://github.com/mozilla/kuma

https://github.com/mozilla/kuma/commit/518c2811821aa3468a9cade78f38c361f3666b11
Fix Bug 1491154, switch from Verdana to Arial

https://github.com/mozilla/kuma/commit/ed60513e92181fa3f5c8b529254da8922e4860f8
Merge pull request #5023 from schalkneethling/bug1491154-switch-body-text-to-arial

Fix Bug 1491154, switch from Verdana to Arial