Problem/Motivation
Some of the smallest font sizes in the installer theme are too small for people with impaired vision to read (12px or less).
This is an accessibility issue and we should be aiming to keep font sizes at 1em or larger.
Proposed resolution
Similar to how Seven's font sizes were improved in #2045473: Improve visibility of Seven's smallest font elements, I propose we remove any styles reducing font sizes below 1em, whether this involves flattening the font size hierarchy remains unsure.
Remaining tasks
Create a patch.
Screenshots.
User interface changes
The font size of the progress bar appears to be the main area that needs to be increased from 0.875em.
BEFORE
AFTER
Beta phase evaluation
Issue category | Task because not a new feature or a bug. |
---|---|
Issue priority | Normal |
Unfrozen changes | Unfrozen because it only changes CSS |
Prioritized changes | The main goal of this issue is usability/accessibility. |
Comment | File | Size | Author |
---|---|---|---|
#16 | progress-bar-after.png | 3.62 KB | njbarrett |
#16 | progress-bar-before.png | 4.31 KB | njbarrett |
#16 | improve_visibility_of-2469589-16.patch | 402 bytes | njbarrett |
Comments
Comment #1
njbarrett CreditAttribution: njbarrett commentedComment #2
garzouille CreditAttribution: garzouille commentedHi, I suggest I can work on this issue.
I am at the drupal dev days in a mentoring class so thanks for your patience ;)
Comment #3
garzouille CreditAttribution: garzouille commented@njbarrett
I did what you suggested : I deleted all 'font-size' value below than 1em in the system.module folder.
We can see the difference in the module page (cf screenshots).
Comment #4
garzouille CreditAttribution: garzouille commentedComment #5
bogdan.racz CreditAttribution: bogdan.racz commentedYou can also remove this selector, as now it is not needed.
Comment #6
bogdan.racz CreditAttribution: bogdan.racz commentedComment #7
garzouille CreditAttribution: garzouille commentedOk, it's done.
Comment #8
garzouille CreditAttribution: garzouille commentedComment #9
bogdan.racz CreditAttribution: bogdan.racz commentedReviewed, looks good. I have checked it on Chrome, Firefox, Safari latest versions.
Comment #10
bogdan.racz CreditAttribution: bogdan.racz commentedComment #11
njbarrett CreditAttribution: njbarrett commentedWe are going to need screenshots of every element that changed here. There is a lot more than just the module page that the patch will impact.
Comment #12
bogdan.racz CreditAttribution: bogdan.racz commentedComment #13
garzouille CreditAttribution: garzouille commentedFor now the patch concern css rules that are only on the system.module component and I can't find "a lot" of more other elements on pages directly impact by these css.
.admin-requirements => used in the HTML module form (cf screenshots)
.update-results => update result page
.progress__percentage => on a progress bar page
.form-item .description => always overriding by the selected theme in my research
.admin-required,
.diff-inline-legend,
table.diff .diff-section-title,
.diff-inline-legend => seems to be no more used or these classes are constructed in the code
Do you have examples of pages that are directly impact from these rules ?
Do you think we need to modify other css files ?
Comment #14
njbarrett CreditAttribution: njbarrett commented@garzouille we need to see the screenshots for the progress bar, and the update result page then.
The form item description is overridden in themes except for the installer, and there are forms on that, so we need screenshots of these forms.
The other stuff I am not sure about, if they aren't used anymore perhaps thats a seperate issue to remove unrequired CSS.
Comment #15
LewisNyman CreditAttribution: LewisNyman at Wunder commentedComment #16
njbarrett CreditAttribution: njbarrett commentedThe only real change I have found needed in the installer is the progress bar, which is at 0.875em.
I have attached a patch and screenshots to reflect this.
The other CSS is not related to the installer.
Comment #17
njbarrett CreditAttribution: njbarrett commentedComment #18
njbarrett CreditAttribution: njbarrett commentedForcing testbot
Comment #19
njbarrett CreditAttribution: njbarrett commentedForcing testbot
Comment #20
njbarrett CreditAttribution: njbarrett commentedComment #21
Dom. CreditAttribution: Dom. commentedHello !
Just to mention for impact evaluation :
#7 seems too global compared to issue summary and is not
#16 will actually impact every progress bar, not only installer one.
The whole point however would be better to define if Bartik would need to be bigger overall as suggested here : #2247319: Improve visibility of Bartik's smallest font elements and not actually changing this on system module. My concern is that the ratio of information now looks tricked, since "Completed 6 on 31." now seems as important as "Installed Filter module" while it's less. Changing the overall font size would keep the ratio while improving readability.
@emma.maria, can we have an opinion on this ?
Comment #22
LewisNyman CreditAttribution: LewisNyman at Wunder commentedThis is not just on the installer, the progress bar appears in other areas of core, can we update this issue summary to reflect this?
I'm not very happy with the visual hierarchy of the progress bar with the patch applied. This is probably a won't fix for me, but we should run it past Bojhan when he has a minute.
Comment #23
Bojhan CreditAttribution: Bojhan as a volunteer commentedThe whole point is that there is a size difference between the top text and the bottom text. Because on typography level, we want to significantly decrease the prominence. I don't think we should make the top text bigger, since that disconnects this style with the overall Seven style.
Given that this issue is inherent, to the whole solution here. I am marking this won't fix.
Comment #24
yoroy CreditAttribution: yoroy commentedAgreed on won't fix. The hierarchy is intentional.
Bartik does have small type sizes here and there. #2247319: Improve visibility of Bartik's smallest font elements for that.
Comment #25
njbarrett CreditAttribution: njbarrett commentedComing back to this issue I agree with the won't fix.
Comment #26
mgifford