A browsing tip: In Firefox, you can right-click on low-contrast text, select 'Inspect (Q)', and a thing will pop up showing all of the attributes of the text. You can uncheck the 'color' styles to restore a good text color, the filter at the top of the list helps find the 'color' entries. For some reason everyone loves grey-on-grey these days, so I find I'm doing this a lot.

I've been thinking of writing a Firefox extension to auto-detect the page background color and set the text color to the polar opposite of that. Haven't done it yet, but I'm getting close.

I'll do you one better, just use reader mode. It's the document looking icon in the url bar to the left of the bookmark button.

reader mode often gets past many 'subscribe to continue reading' overlays.

Is also my go-to to avoid clicking either 'accept all' or 'click here to read 10 pages of dark patterns to maybe disallow a few trackers' cookie modals.

There is an addon for this actually. Adjust colors for your own pleasure and press F2 (or whatever you want). https://addons.mozilla.org/en-US/firefox/addon/dark-backgrou...

Thanks, this looks great. I'll give it a shot!

Just pushed an update - btw Cloudflare pages are fantastic its been perfection for a personal site.

Hmm I don't see any change yet but LOL if the 404s turn out to be my own fault due to a Workers bug. :)

https://3be909f6.personal-site-v4.pages.dev/ has the updated styles but the change doesnt seem to have propagated to domain yet (made the background pure white instead of grey)

Yeah that page looks much better, not just the colors but also the headings and paragraphs are now formatted correctly.

Crazily enough, it looks like the missing files are actually a problem on our (Cloudflare's) end. We're looking into it. But a re-deploy should fix it for now, I think.

Hey Ben, we think your re-deploy solved the problem, but the old content is still being served from Cloudflare's cache for many people. Can you do a cache purge in the Cloudflare dashboard?

(It just updated for me, looks much better. But the old version might still be cached in some locations.)

The root cause was actually something we fixed last month, but it seems problems can stick around if the site was originally deployed before that fix... we're working on that.

On further investigation we think this might have been purely a caching issue, not the backend problem we originally suspected.

The problem is that your site generator produces different file names for each version, but doesn't preserve the old files. So when you upload a new version, then the old version of the assets become 404, unless they happened to be cached. But it's possible the HTML is cached and the CSS not cached, in which case people will get the old HTML which refers to a CSS file that is now 404.

This is a classic problem and we need to find a better way to solve it. In principle, though, you could manually avoid it by preserving older versions of the CSS such that they continue to be served under new versions of the site.

Alternatively, if you change the config on your domain so that it doesn't cache at all (or at least turn off the "cache everything" option), and instead rely on Cloudflare Pages itself to manage caching, that also should mostly* avoid the problem. Pages does do its own caching, so adding a second layer of caching on top of that shouldn't be necessary.

* There's still a problem if someone is unlucky enough to load the site exactly when it's being updated, but at least a refresh fixes that. We need a better answer, though...

Wow. Thanks for the explanation and for being humble in considering it (partially) your mistake.

I have to admit it was quite a plot twist, but this is why I love HN: we're both users and developers at the same time!

Thanks for following up! Looks like that setting was on from an old version of the site. Probably not a super common thing for people who are onboarding to CF Pages (previously my origin was on AWS) and I migrated to Pages.

seconded -- great read / info also as user of Cloudflare Pages for multiple domains

Isn't that a default behavior for modern JavaScript SPAs: bundle all the frontend code into several files with unique hash names and refer them from generic html home page? Changing hash every time code changes?

Yes, which is why Pages has some dedicated logic to help preserve assets that were "seen in the last version now gone". Unfortunately, the "cache everything" setting at the CDN overrides that. We should probably be clearer about that in the docs, and potentially we could autodetect that setting when you register your custom domain, hmmm...

interesting read, thanks for sharing this

I'm curious, how do they compare against S3? (cheaper, easier to use, ...?)

I had my site fronted with CF previously w/ an origin on S3 and it cost about $0.53/mo (super cheap). CF Pages current pricing is free for unlimited bandwidth which is pretty incredible - https://pages.cloudflare.com/#pricing

The page presents as an almost pure black background, and almost 100% white text to me - about as high-contrast as you can get. Maybe this is a light/dark mode issue?

Yeah - on my phone it's WoB but on my desktop (which is dark mode) it's BoW

I think it is because the font is so thin it looks gray, even if the thin lines are made up of 100% white pixels. FireFox reader mode makes it readable though.

I don't have dark mode enabled. What I see seems to be the default style, and is consistent across multiple browsers for me.

Very interesting. This is what I see - https://i.imgur.com/eV4yDd0.png

Huh! It's more than just colors, you have padding between paragraphs whereas I don't. I think the page must not be loading correctly? I do see these two stylesheets returning 404:

https://benadam.me/assets/prisma-dark.19c66771.css

https://benadam.me/assets/work.b7de8a03.css

The padding for the paragraphs is indeed coming from prisma-dark.css - that would explain it!

This is what I see: https://imgur.com/dN7nPOS . Almost unreadable after a few minutes, it's so faint.

This is almost exactly what I see on Edge 64-bit 96.0.1054.62, Windows 10 19042.1415

It's a surprisingly small world we've created

This kind of thing is why I love to be on HN. It's so interesting to be able to discuss technologies with the people that created them.

- it has an 8+ contrast ratio so I thought it would be ok (also been mostly working in dark mode) - will update. Thanks for your feedback.

I think some of the stylesheets are not loading correctly, I get 404 on these:

https://benadam.me/assets/prisma-dark.19c66771.css

https://benadam.me/assets/work.b7de8a03.css

The weight was the problem for me. document.body.style.fontWeight=600 in the console made it readable.

It also has <p> styled with a zero margin, which makes things hard to read as well.

This page is almost unreadable for me too -- a giant oil-spill of light gray text on a white background with no discernible headers, no spaces between paragraphs, etc. Brave, desktop, Version 1.33.106 Chromium: 96.0.4664.110 (Official Build) (arm64)

As a Cloudflare customer, I really like that you were comfortable just taking responsibility and jumping on it. That’s a healthy sign in an engineering group.

This is slightly similar to that moment when checking code and ask who is the dumb ass who wrote a certain piece just for git blame to show your name...

This happens with so many sites now... UI and 508 compliance seem to be going out the window lately... Almost thought I was goin blind. :(