Accessibility of ~
I ran a Lighthouse audit for performance and accessibility on a comments page (specifically this one); the results are pretty good on the whole, but there are definitely a couple of things I think ~ could do better.
Performance
IMO the performance of ~ is fine; Chrome thinks that the time to first meaningful paint is a bit high (3.1s on a simulated 3G connection with CPU throttling), but I don't know what you can do about that without doing things like inlining all the CSS, which would make the very first page load faster but hurt every request after that. Maybe minifying the CSS/JS would help? I don't know if the performance benefit would be enough to justify the increase in complexity to handle the minification, and you'd also lose the easy legibility of the source (which I personally really like).
Accessibility
There's some really small text on ~! The Lighthouse audits I ran don't catch it, but the SEO audit does, and it's not hard to see it with your own eyes either. The suggested minimum size for easy reading in that audit is 16px, which is the current size of all post and comment text on desktop, although mobile only gets 14px (I don't know if this is actually a problem, since you probably hold your phone closer to your face than your monitor).
Edit: posting this from my phone - yes, the 14px font on mobile is definitely harder to read than 16px would be. I don't know if that's just me (I have a fairly severe visual impairment), but I would definitely prefer 16px text everywhere, not just on desktop.
There's also a good amount of text that doesn't have a great deal of contrast (even using the default white theme – I'm sure it's much worse with Solarized). This is mostly all the grey text, although Lighthouse also complains about the links when they're on a grey background (especially the "visited" colour, which is much closer to grey than the normal colour).
Some specific examples: The timestamp and "Link" text for each comment is only 10px, which is a bit small for me, especially with the low contrast on "Link". Similarly, the post timestamp is a bit hard to read.
The worst offender by far, though, is the "Comment deleted by author" notice (example). It's tiny and grey and incredibly easy to miss, and is directly relevant to the flow of the conversation, unlike the timestamps. I'd really appreciate it if that could be bumped up to at least as large as usernames are currently displayed.
Thanks for doing this.
I think the performance is likely related to Tildes just running from a single server (in Eastern Canada), with no CDN. It's fast and the pages are quite small, but if you're not near the server there's still going to be some delay.
For accessibility, there's definitely small/faded text that can be difficult to read. It's a tricky balance between trying to de-emphasize text so that information and links that aren't often needed are still available, but not in your face all the time. It might be possible to bump up the timestamps and Link/Parent size a bit, I'll try it out and see how it looks.
I agree that the deleted comment notice is much too small, I'll increase that.
One thing that has stood out to me is that I can actually zoom in. That is, when I ctrl-+/- to zoom in and out, the site layout doesn't turn into a mess of overlapping elements and misplaced text, even on 500% zoom. Good job on making a web design that works for the visually impaired without needing special extensions to prevent the page from turning into a mess when zoomed in on.
Oh nice, that's good to hear. I did test how well it handled zooming a little, but not very extensively. If you do find anything weird, please let me know and I'll see if I can fix it.
Yes! This zoom feature is really good, it feels like reading a PDF file on mobile
Ahh, the "being in Canada" will be most of the slowness for me (I had failed to put two and two together there) - I'm the other side of the pond.
Thanks for being so responsive to this, not many people are. ~ is by absolutely no means unusable (it's one of the better-designed websites I use to be honest!), I just want as many different people as possible to be able to use it as easily as possible :)
Would it be possible to allow the user to set the text size themselves? Like, split them up into categories (title text, timestamp, post/comment) and make a section in the settings where the user can customize it to their liking. This would allow people to determine for themselves what's more important (Someone doesn't care about the timestamp? They can make it tiny for themselves) but also keep what they care about to a comfortable size for them.
I have no experience in making websites so I have no idea if this is easy or even possible, but I thought it might be worth mentioning.
It's possible, but in the end almost nobody will use customization of that level, and it's probably simpler (and more powerful) for the people that want to tweak things that extensively to just install a browser extension that lets them define custom CSS that will override the site's.
That makes sense. But what about mobile? Is there a way to do that on a mobile browser? I think font size could be a little bit bigger and I also think text contrast in the solari ed dark version at least could be a bit higher.
Or I guess that'll be taken care by mobile apps at some point, I believe the API is not yet accessible, right?
You can have different styles for mobile, yes. Currently I'm actually shrinking the main text (for text topics and comments) a little on mobile since I thought it was a bit large, but I could stop doing that. It's always hard to say though, different people have different personal preferences for what size they like. Generally you can adjust the settings in the browser to increase/decrease text sizes, but they might not all support it.
I don't intend to have an official mobile app. It's possible that there will be some third-party ones created once there's an API, but that could be a fairly long time between getting the API built and then having a decent app created on top of it.
Yes, I was referring to third-party apps.
Umm, I think comment text is small enough, maybe even a little too small, but I would have to be able to compare to give an opinion.
I'll try to find out how to modify styles on mobile, then. Thanks.
No no, I'm not going to make it even smaller. I mean that it's already a bit smaller on mobile—currently, desktop uses 16px font and mobile uses 14px.
I can try turning that off and see if anyone complains (and if you like it better) though.
You can give it a try. But maybe just adding some contrast would be enough. I'm using the solarized dark theme, and I'd prefer text to be whiter and the background to be a bit darker and greyer instead of blue.
As a reference, this is my current config on my reddit app. I think the text is same size, or even smaller, but the contrast is higher and thus, for me, more readable. I find in the black theme the contrast is too high though, that's why I'm using solarized.
Just to add something to my previous reply. I have set the accessibility settings in Chrome (Android) to 115% percent text scaling. And it's easier to read, and I found no problems in the site structure as a consequence, so I guess there is no need to change the text size on your side, it's easy enough to change on the user side. However, I still feel contrast is too low as I said in my previous reply to this comment.
Stylish supports Firefox Mobile. If you can find a mobile version of Greasemonkey, that should do the trick too.
Thanks, I'll check it. Although I use Chrome to keep history in sync.
I think that's mixing unrelated functions. The buttons at the bottom are actions you take on the comment/topic - voting, tagging, replying, editing, deleting, etc. Link and Parent don't really fit in with those actions, they're more like navigation.
People are used to it all being down there from reddit, but I think that's mostly just familiarity and not because it really makes sense to have them mixed in there.
While there is currently no CDN, have you looked into enabling CloudFlare on the domain instead of DNS Made Easy? As their free plan does offer quite a bit of security, and performance as well as CDN/cache
I'd rather not involve CloudFlare at all, they're not a great choice for user privacy (way too much of the internet effectively goes through them now).