Page MenuHomePhabricator

Set the base font size to respect the user's default browser font settings
Closed, DuplicatePublic

Description

Hi folks, thanks for the great ongoing work. :) I've got a typography/accessibility bug to report, and related notes.

At https://phabricator.wikimedia.org/T81 adrianlang wrote:

MediaWiki's font-size depends on the configured default font size in your browser. Phabricator's doesn't.

That's the main bug, that I'd like to address.
I.e. If I go to my (firefox) browser's Edit->Preferences->Content->Fonts & Colors and set the default font size to (e.g.) 24px, then nothing changes at phabricator. Whereas most other sites get the massively increased font size.


This was part of a longer discussion about changing the base font size from the current 13px (rendered) up to 14px (which is what most of MediaWiki currently uses by default, for body copy).

I added some links and notes about industry standards/recommendations (i.e. using em or %, instead of px, to define font-sizes) in a comment at https://phabricator.wikimedia.org/T81#952891

I also made this recommendation, that I'll copy in full:

Long-term, it would be good to change

body { font:13px/1.231

to

body { font:100%

and then adapt everything else from there...

Short-term/bandage, adding something like this would help a lot.

.phabricator-remarkup (font-size: 110%}

(That will get the main comment text up to 14px).

I'm not a professional in this area, so please do check/verify those recommendations. I hope they help. :)


Related to T4843: Making Phabricator accessible to assistive technologies

Event Timeline

quiddity raised the priority of this task from to Needs Triage.
quiddity updated the task description. (Show Details)
quiddity added projects: Design, Wikimedia.
quiddity added a subscriber: quiddity.

There would be a few concerns here:

  • Overall, it seems very few sites respect the browser's size change. Single digit percentages at best from my testing of a few dozen sites. I can't imagine someone who needs accessibility would use this mechanic over other functions.
  • Information density is something most current Phabricator users value, that is we've gotten pretty good feedback in a negative fashion when we make things bigger.
  • "Vanilla" Phabricator is meant to serve the most common use cases, which invariably means its going to be worse for someone.
  • There seem to be many browser extensions available to actually override font choices, unclear why browsers implement such a feature poorly.

If there is a way to get this for free that I haven't been able to find, let me know.

CC @scp for his expert accessibility opinion