Tildes CSS and Android accessibility
Hi all. On my Pixel phone I have the accessibility option for font size and display size turned up a notch or two but noticed that not all of the text in Tildes adheres to this. Some front page topic text is bigger, some of them remain small.
Is this something that can be quickly tested and fixed if it's a bug? It might drive poor sighted people away from the site.
I'm assuming it's not me, as my Pixel 7 is quite new .... but I am on the Android beta program.
Can anyone else try and see if it's a localised issue or more global?
I can post screen shots of needed but not sure what image sharing sites you prefer to use in here!
Edit:
Fixed with a chrome flag....
the text-scaling is being replaced by the "Accessibility Page Zoom" feature (currently hidden behind the feature flag in chrome://flags)
I had a quick look at the Tildes source code and nothing in there jumps out immediately to what can cause the behavior you are describing.
All font sizes that are defined are using the same unit and also aren't fixed.
It might be that some text actually doesn't have font-size defined. Can you provide a screenshot so I can get a better idea of what text is causing issues for you?
Hi, thanks for answering.
These are the 2:
Standard settings:
https://ibb.co/tQjD8mq
Increased Font size and Display in accessibility settings:
https://ibb.co/WsjtbLV
(I would expect it all to be larger)
I'm using Atom One Dark but it is the same on all themes.
Edit:
These are the accessibility settings I change:
https://ibb.co/m4Yzg75
I think this may be a bug with Chromium because there are no style differences on Tildes' end for the titles that are scaled weirdly in your and @MsPiggleWiggle's screenshots. I found this bug report about the accessibility font scaling where one of the latest comments mentions it breaking by just removing 1 word of text from a paragraph. Maybe that's the same thing happening here? Some text is different and the scaling applies/does not apply?
Yes that's it I think. They've been working on this since 2016?!
In Chrome on Android, Settings > Accessibility > Text Scaling, I have mine set at 140%. When I changed it to 100%, the heading styles all displayed as the same size. When I dropped it down to 85%, still OK. So it's just with the increased text scaling.
I've never noticed this problem on any other website, or not in a long time at least. Not sure why. Skimming to the bottom of that bug report is this comment from January 2023:
I think that means for the current version, Settings > Accessibility set Text Scaling to 100%.
edit: Hope there's another solution besides lowering text scaling - especially since I don't see this issue on other websites, I'm hopeful there's some trick out there. I think that January comment is pointing to the Zoom feature, but that's not the same thing. Text scaling allows text to resize within its container, so to speak, while zoom just gets you closer to the text, meaning if you zoom you can't see all the text. I've not done a good job explaining it, but if you think about zooming in a photo it makes sense.
Thank you so much, this fixed it:
the text-scaling is being replaced by the "Accessibility Page Zoom" feature (currently hidden behind the feature flag in chrome://flags)
This fixed it for me too. I don't use zoom in Chrome, rather I have it set via android Settings-> Display->Font Size . I looked as to why it worked by default in Firefox and under Accessibility it has "Automatic font size, font size will match your Android settings."
THANK YOU! This worked for me.
For Chrome, I reduced my Accessibility > Text Scaling to 100%. Then in Android settings, I increased Display > Font Size.
It didn't fix it for me. Maybe I'm looking in the wrong place? For you, is that flag currently at Settings > Accessibility > Force Enable Zoom?
Accessibility Page Zoom, I enabled it.
I noticed the same thing with font sizes last night and wondered if a change was made to indicate "hot" or something. Here are 4 screenshots viewing this website on Chrome with an Android device. It doesn't happen on Chrome with a desktop.
You can upload on imgbb.com.
For example this is how Tildes home page looks for me. https://ibb.co/zPL3R2H I'm using a custom rom Based on AOSP Android 13. Vivaldi browser, no accessibility settings turned on.
I'm on Android, running Chrome, and it appears something changed today for me as well. A substantial number of topics are now displayed with a smaller front, but not all of them.
Oddly enough, only when I'm logged in, when I'm not, it appears normal. (Or the way that I'm used to seeing it anyway)
From my limited testing, on Firefox it appears as normal both logged in and logged out.
Same!
Two screenshots here - both Chrome browser on Android device with Accessibility setting Text Scaling at 140%. Screenshot #1 logged in; #2 logged out.
I feel like before last night, when logged in, the titles were all smaller (like the heading size for the Dune link in screenshot #1). It's Chrome 114.0.5735.147 - I wasn't forced to restart my phone, but is it possible this is a new release that was pushed to our phones last night, and it's caused the difference? Just brainstorming... still haven't seen the issue on other websites though, yet.
I'm at 114.0.5735.131
Within Chrome, Accessibility, Text Scaling is set to 100%.
This is definitely not in my wheelhouse. Just providing information in case it's helpful to others.
For now, I'll just browse it in Firefox when on mobile.