Early on with this site, I made the decision to go with the serif font for the post's body. I thought it was a good look for a lot of articles, and also implicitly positioned ourselves as a viable Medium alternative.
But a lot of types of content really look bad with this font choice, and a sans-serif, similar to the comments, makes more sense in our opinion.
This is a one-line change, but not something we'd make lightly because these are your posts and we don't want to catch people off guard.
How do folks feel about this?
Latest comments (40)
When a piece of body text has a large enough font, and lots of breathing room around it )like the text above, and like the text on Medium), I think serif works quite well. It feels more peaceful, like reading a book, you will take the time to read it.
Sans serif works better for UI elements, small text, or just when you have a lot of content that the user has to browse through as fast as possible.
I like serif fonts for online content. I find them more pleasing to read. The non-serif ones look cheaper, less formal -- like a chat site and not an article site.
Why not go hardcore/meta and make it monospaced? ;) Fira Mono is the place to be these days!
Ooo, there's also Fira Sans. It'd be nice to go with something other than Helvetica...start to give the site its own unique feel.
Are you just going to do system-default
sans-serifor are you investigating alternative webfonts? Roboto and Open Sans are great, and it'd be interesting to at least check them out!This is our current font stack:
All system fonts with various fallbacks, all the way down to
sans-serif. We'd rather avoid using webfonts for performance purposes, but it's all on the table in one way or another.Yeah, I absolutely understand your performance concerns. In a pretty much text-only site, however, I wouldn't blame you guys for using a webfont.
The only reason why I'd go as far as to suggest webfonts is because I personally really don't dig Arial, which is probably what it'll fall back to on Windows 😬
PLEASE
Good idea!
Interesting, that I implemented these this week because someone sent me the link.
I'm ok with any font but it would be great if we can consider monospace, Source Code Pro ftw!!! jk
Oh, and by the way, MathJax support is a good thing to consider as well.
So the comments are san-serif already. Which has a weird vibe to me.
I'd say do the san-serif throughout.
I personally find sans serif to be more readable, but reading the comments here are really interesting! It's not an obvious choice.
While it'd be "cool" to give authors the option, you probably shouldn't for branding/consistency purposes. I trust whatever you decide, as long as it's not Papyrus 😂
Lol, yeah this thread has been really eye-opening. We can't be so democratic about every single change, but I had a feeling this might strike a chord. I'm fascinated by the proposals to give readers the option. It's a slippery slope into configuration hell, but I think it's actually a pretty neat idea.
Oooooooh! That's fancy. I like it.
Why not a have a user-set preference?
If an article writer sets a particular font, then use that. Otherwise, unset text uses the preference.
I think overall web trends have been moving toward sans serif, but I know many people have strong preference.
Could it be a user preference setting?
I much prefer serif fonts, and I wish that both the post and the comments were all serif.
Of course I can fix it myself by Chrome ➤ View ➤ Developer Tools and tweak the CSS. But that's a bit of a hassle. (I think there's a Chrome add-in which can post-load twiddle the CSS on a site-by-site basis. I remember I had one for Firefox, back in the day.)
In either event, I'd definitely vote against Comic Sans.
Since the replies seem pretty evenly split, I think that this would be the best solution. This could also be used to improve accessibility for dyslexic users by featuring a font like dyslexia to cater to dyslexic users.
Stylebot is great for "fixing" sites for yourself. Been using it a lot for minor tweaks.
Comic Sans Ms is fine too :v
Serif vs San-serif is unclear according to this 2012 usability article.
nngroup.com/articles/serif-vs-sans...
With high PPI screens more common especially on mobile, you can probably go either way, unless you know you have a lot of low PPI desktop users.
Focus on finding a font that's readable that fits your branding.
Maybe you can find a serif font that works for more types of articles.
Or maybe go with san-serif for low PPI screens and serif for high PPI screens.
I personally find the serif font to be decent-to-good on hi-definition screens (retina or 4k), but much less readable on "normal" screens (720 or 1080).
Especially because the font is too big, so I have to scale down the whole website to 90% (on 22-24") to make it readable.
If I may add a suggestion: on a 7-8" tablet the website scales the font to a huge size, maybe because it thinks it's a phone, and I can't scale it. It makes it unreadable, unless you hold your tablet at an arm's lenght.
Would it be possible to disable this feature and just stick to a fixed size (15-16px, maybe)?
Thanks!
Yeah, it would be a possibility. In the meantime, thanks for the input to make us aware of this so we can look into immediate fixes that should at least remedy the poorly-handled screen size defaults.
I think your serif font looks great, and I'm curious what types of content it's worse for besides code and headers, which you're already using monospace and sans-serif for, respectively.
I switched the font on Indie Hackers articles over from sans-serf to serif a few weeks back. While it doesn't look quite as good as it used to, it still looks good, and the readability improvements are worth it (example).
Looking at the comments here, I find the sans-serif font harder to read than the main post body. Although maybe that's just the specific font choice, line height, etc.
One potential issue is that we don't distinguish between "articles" and other types of content. For example, this post is the same as any other article, but on IndieHackers it would not be. And maybe that's a line of thought we should explore further.