HN Explorer

Ask HN: My eyesight is not good enough to read HN. What can I do?

44 points by wunderwaffe ↗ HN
I own an iPad and an Android phone. The text on HN is simply too small for me to read.

Before HN added CSP headers, I used a bookmarklet to change the font size. But since the CSP headers were added, FF and Chrome both refuse to execute the bookmarklet.

Some might suggest to use an app instead. But I don't use apps. As a programmer I know how bad the app security models are.

Is there any solution, or am I effectively cut off from HN?

54 comments

[ 3.1 ms ] story [ 131 ms ] thread
wakeywakeywakey
Just wanted to comment to raise awareness for those of us without 20/20 eyesight.

HN staff: please consider having a typographer/UI designer make a few improvements to the base stylesheet. I realize the codebase may be old, but it's a paragon of Lisp purity so it should be easy to change, no? ;)

wunderwaffe
My experience ist that everytime a designer touches a website things get worse :)

Current example: The Reddit redesign. It's a nightmare.

Changes to HN that would help me are:

Get rid of the CSP headers

Change the output so that the browsers reader mode can understand it.

[dead] jochung
If only there was some sort of mechanism to decouple the content from the design. Some sort of "sheet" of styles, that different users could choose according to their own preferences. It could even be targeted to specific dimensions and devices.
nils-m-holm
A white-on-black color scheme would go a long way!

That being said, in my experience HN is really one of the least problematic sites when it comes to accessibility! It even works fine with CSS off. Kudos to the designers!

Tomte
Try a user stylesheet with your browser.
taspeotis
iOS has excellent accessibility features built in. Take a look at VoiceOver or Zoom [1]. You should be able to toggle either on easily via the Control Center.

[1] https://www.apple.com/au/accessibility/iphone/vision/

wunderwaffe
There is a lot of stuff in the iOS accessibility tools, but unfortunately nothing that makes the text on HN bigger.

Ironically, setting the "dynamic text size" makes all kinds of text in the OS way too big but lets the text on HN as small as before.

And I don't want to "zoom" because that makes the text overflow the screen on the right.

gm-conspiracy
What about reader mode in mobile Safari?

Or maybe some JS bookmarklet (never tried w/ iOS Safari), personally.

I also thought there was an "Accessibility Zoom" that uses 3-fingers (for all iOS, not specific app)?

FBISurveillance
I used to have bad eyesight, just zoomed-in the page with `Cmd +` to 110% or 125%.

Unrelated to reading HN, if LASIK or similar is an option for you I would suggest you to talk to your ophthalmologist. Having eyesight corrected has been one of the best decisions I've made. It had such a drastic impact on my quality of life.

nils-m-holm
Good to hear that it worked for you!

However, LASIK and similar approaches are not without problems when your vision is really bad (10 diopters or more), so I would recommend to inform yourself thoroughly before taking this step!

severine
Please take a look at Bookmarklets Context Menu, a WebExtension that allows to execute bookmarklets as privileged scripts:

https://github.com/mems/bookmarklets-context-menu

https://addons.mozilla.org/es/firefox/addon/bookmarklets-con...

Not sure if it'll work in the mobile version of Firefox though, works great in desktop.

nils-m-holm
I have impaired vision myself and I find HN to be one of the most accessible sites around. I have set all font sizes to 32-point and do not allow any smaller fonts. Also I have chosen a font that easy to read for me and do not allow sites to select any other fonts. On bad days I disable CSS so I can have my default bright-on-dark color scheme.

Using these settings, HN is a pleasure to read! Other sites suffer, of course, because large fonts destroy their layouts, but those sites are FUBAR (from an accessibility point of view) anyway.

wunderwaffe
These sound like solutions for the desktop? I'm looking for a solution for mobile. Well, thanks to mike-cardwell, I have one now!
nils-m-holm
I'm using the same approach on my smartphone. Good to hear you found a solution!
y0ghur7_xxx
Why don't you just zoom in? This seems so obvious to me that I am sure I am missing something.

I set the hn zoom level to 120%, and firefox remembers my zoom setting for the site so I don't have to set it every time.

mike-cardwell
On mobile Firefox, when I pinch zoom on HN, it means I end up having to constantly scroll horizontally to read anything. Maybe that's why?
saagarjha
You want Command + or the equivalent, not pinch zooming.
mike-cardwell
Yeah. I use that regularly on my laptops and desktops. No idea how to do it on mobile phones though, which is what is being discussed here.
sbr464
Curious why Cmd+/zooming doesn't work?
cstross
Hint: can you tell me where to find the command key on your iPad?

(User is specifically asking about reading HN on mobile devices, not a desktop OS.)

mike-cardwell
The existing HN CSP policy allows inline styles. A bookmarklet which just does the following would work:

document.querySelectorAll('*').forEach(d => d.style.fontSize='20px')

I find it odd that mobile browsers don't allow you to set the font size like desktop browsers do.

OJFord
Firefox on Android allows scaling according to system font, under Settings > Accessibility.

I suppose though that OP is happy with system fonts and not HN fonts.

DanBC
The font is still quite small on HN even with the system font set to the largest size.
wunderwaffe
Awesome! I was creating a style element and added it to the head. The CSP do not allow that.

Now that I know I can alter the elements directly, I will do that instead.

Hacker News - I'm back!

mike-cardwell
Using a style element should have worked too. The HN CSP policy has unsafe-inline which covers both of these things.

Perhaps your problem wasn't with CSP at all, but something else. Maybe a CSS specificity issue?

[edit] - Yeah, I just created this bookmarklet and it worked fine:

javascript:(function(){s=document.createElement('style');s.textContent='*{font-size:20px}';document.head.appendChild(s)})()

wunderwaffe
Even better!

My solution was a link element with a data: URI. Yours is much more elegant. And works!

Thank you very much!

mike-cardwell
That would be the problem. The HN policy for styles is:

style-src 'self' 'unsafe-inline'

This means they can include CSS from the same origin, or inline. It would need "data:" adding to the list to allow data URI's as an accepted source.

xparadigm
I set the zoom level to 130% in Firefox for this site only. It is persistant. I don't have to do it every time I visit the site. And it doesn't effect other sites.
realusername
I do the same, except for me it's permanently at 240%.
DanBC
How do you set the zoom in mobile Firefox?
comex
On iOS, it's possible for App Store apps to add actions to Safari's share sheet that execute arbitrary JavaScript on the current page. This can act as a substitute for bookmarklets. (There's no way to have extensions run automatically, though.)

From a quick search of the App Store, here are two apps that may help – I haven't tried either of them, though:

Font Size App Extension: https://itunes.apple.com/us/app/font-size-app-extension/id10...

Safari Snippets (lets you add custom JS snippets to execute): https://itunes.apple.com/us/app/safari-snippets/id1126048257...

I'm assuming that by "I don't use apps", you just mean you don't want to use a specialized HN reader app. If you don't want to install any apps at all, I guess the above won't help… though you could always write your own app.

edit: The above may be unnecessary if, as mike-cardwell suggested, the issue isn't that the bookmarklet isn't executing, but that it tries to add a style tag and isn't allowed.

[dead] picsao
Write a app that renders the pages through a physical lens.. Bonuspoints if you allow to order cheap glasses online with the settings.

#NoAudienceInTheValleyForThat

nyrulez
>> As a programmer I know how bad the app security models are.

Don't understand this. What does this mean? And then do you not use any apps at all?

wunderwaffe
No, I don't use apps.

Apps can do millions of things you don't want an untrusted party to do on your device.

mikhailt
Browsers are apps too and your statement is too vague.

Please explain what you’re afraid of.

To me, it sounds like you’re talking about third party apps, and your fear is about third party developers having access to your web accounts. In that case, that makes a bit more sense but then I hope you’re not using any browser extensions as well.

wunderwaffe
Yes, with untrusted parties I mean developers of third party apps.

And yes, I don't use browser extensions either.

[deleted]
(comment deleted)
joppy
If you are using the Opera browser on Android, then when you zoom, the text resizes but then reflows to fit on the screen. I cannot fathom why the other phone browsers do not have this feature, it makes every site readable without any scrolling left or right.
juzffoo
Came here to say exactly this! Text Reflow works great and imho must have for every mobile browsers.
mstolpm
For the iPad, you could try a browser app called iCab mobile. It comes with an extension to increase the text size. That works with HN as well.

See it in action in this screenshot: https://www.dropbox.com/s/nh9kjn4vgec694l/IMG_0073.JPG

(If alternate browsers count as „use an app“ advice, I apologize for my suggestion.)

jowsie
I can't help but wonder how you are going to read all the responses here?
brador
Magnifying glass? Or how about a magnifying monocle?

Accessibility settings on ipad has some zoom features too.

Or just write a quick scraper.

tarboreus
I'm blind and am reading HN right now.

On an iPhone:

1. Hold down the home button to summon Siri.

2. Say "turn on Voiceover."

Now when you touch parts of the screen, that element will be read to you. If you're focused on a button or link, tap twice to activate it. Scroll with a three finger swipe.

Will definitely take some getting used to, but in some ways it's actually superior to sighted reading. No strain or fatigue, you can control your phone without taking it out of your pocket, and you can listen while walking around.

An alternative, and I also do this, is to do this workflow:

1. Get an RSS reader with HN hooked up to it.

2. Read all the article titles and open the ones you think sound interesting in the browser.

3. Use the Pocket for Chrome extension to add those items to the Pocket app. It's Mozilla, it's not particularly evil or leaky.

4. Read the articles on your phone in a readable font You can change the text size in settings.

There are some other alternative workflows for getting text read aloud on the laptop, message me if you're interested.

rishav_sharan
If you dont mind me asking, how do you reply on HN? Your post is very well formatted to have been done using any speech to text service.
tarboreus
I used my computer. But it's entirely possible to type while blind on the iPhone using Voiceover, though I admit I'm rather slow. If I have to send an email on the phone, I usually use TTS, then go through it one character at a time to correct formatting using Voiceover.