firefox-devtools / profiler

Firefox Profiler — Web app for Firefox performance analysis
https://profiler.firefox.com
Mozilla Public License 2.0
1.18k stars 385 forks source link

The marker timeline labels are difficult to read (Low vision accessability) #574

Open PaulBone opened 7 years ago

PaulBone commented 7 years ago

The marker timeline canvus (click the Timeline button and look down) where the markers are drawn on a horizontal timeline, has difficult to read labels for the markers. My firefox is configured to ignore the colours of a site and substitute my own high contrast inverse colours. When this happens the titles on the left of these markers have some poor contrast and can be difficult to read. I would like them to have white-on-black, and perhaps a larger font.

perf-accessability

┆Issue is synchronized with this Jira Task

julienw commented 7 years ago

at the moment, we "draw" the labels in the canvas and that's why your configuration doesn't apply.

Our plan for the general layout of this tab is:

  1. split this tab in 2 tabs: https://github.com/devtools-html/perf.html/issues/563
  2. display markers for the selected thread only: https://github.com/devtools-html/perf.html/issues/478 (this issue is badly named, or maybe we should file a separate issue) This will make the current gutter useless and the plan is to move the labels there.

I don't know if this would be reliable to draw the markers in a canvas while rendering the labels in HTML. But we can try it.

gregtatum commented 7 years ago

@PaulBone could you provide steps to configure our own browsers this way? That way we can try it out with the same settings.

PaulBone commented 7 years ago

In the Firefox preferences, scroll down to "Fonts and colours", click "Colours", I choose: Text: white Background: black Unvisited link medium blue Visited link: medum red

Untick "Use system colours" Choose "Always" for "Override the colours specified by the page".

One of these days I'll write this up, with screenshots and other information as a blog post, since I've learnt that many people are curious.

PaulBone commented 7 years ago

I'm sorry @julienw, I forgot to respond to this:

I don't know if this would be reliable to draw the markers in a canvas while rendering the labels in HTML. But we can try it.

I think I've seen that done before, and if it is what I think it is, then it looked awful. Although I may be mistaken, I'm not a web programmer myself.

gregtatum commented 7 years ago

I think I originally drew the markers with the canvas mainly because it was an easy prototype.