Preview Fonts More Easily

[janga1]

Is your feature request related to a problem? Please describe.
Searching for a font on your website feels unnecessarily difficult. No need to reinvent the wheel here, just copy what practically all other fonts-websites are doing.

Describe the solution you'd like
I want to be able to quickly scroll trough all available fonts, while having sensible filtering options to easily get what I'm looking for (e.g. type, weight, variable, etc.).

Describe alternatives you've considered
Google

Additional context
NEIN!

[ayuhito]

I'd like to hear more of a detailed spec of things you feel could be improved on rather than a vague over-encompassing remark since it's hard to understand exactly what you disagree with.

Are you suggesting copying entirely what Google Fonts has done? Or are there specific things that we can work on the existing site that bother you?
If you think the former, I suggest using Google Fonts. I think the 'Preview' feature is a "nice thing to have" but not really the focus of the Fontsource website since it's a utility website for documentation and referencing. There's no real reason to replace Google Fonts if they're doing a good job of previewing and searching. Unless there are people who disagree in the direction they are going towards for their website, in which case making a competing solution does make sense.

Design isn't my forte, but I'm always open to people who may propose and help out with a full redesign mockup for the website. I have no issues implementing new designs if people want to offer their assistance for that.

[janga1]

@ayuhito, reason I found this project is because I think it has a great goal: independence. As far as I can see the project delivers on what it promises to do, so no complaints in that regard. The only thing that struck me as somewhat unpleasant was the website UX when it comes to searching/finding a font. I've found myself using Google's registry to search for a font which I would than use with FontSource, which might not be necessary. Let's cut out Google.

When I start a new project I typically don't know exactly what I want for a font to look like, just some general specs (for example, serif, bold, square-looking), so I like to search to find the right font. On Google's fonts website you can quickly preview boatloads of fonts with just a few filters. On the FontSource preview page I get a list of font names that don't mean a whole lot to me, having to click and load another page just to see what one specific font is actually like. This feels unnecessarily cumbersome.

To be clear, the project as a whole is doing fine as far as I can see. This proposal of mine is at best just a small incremental enhancement on the registry's UX. If it's not the direction you want to take the project, that's your decision to make. I'll be using this project regardless.

[ayuhito]

I don't disagree with any of your remarks here.

I think the website as a whole is due for a full refresh which might pair nicely with the v5 release. There are a bunch of outstanding issues both already on the issue tracker (e.g. #244 or #293) and some not written down (docs grouping improvements, maybe i18n, global preview text state, tests etc) that can improve the website experience.

What I can do is make a brand new issue in a couple days that will spec out the requirements and suggestions for a new website. It'll be open ended for any designer or developer who is interested in contributing to create a mock-up design and then we can move on from there.

If you have any alternative suggestions or ideas, feel free to share.

[ayuhito]

Closing in favour of #558.

[janga1]

Awesome news.

[scottrepreneur]

I didn't want to comment on the new issue, but I definitely would love to see something more for quick previews in the new website. It's really slow to click through each font name to get a new preview loaded and see if the font is the right style. Filtering a list of fonts (already previewed with the default text) will go a long way in quickly finding a font that fits the needs of your design.

The extended preview in #553 is great, but I think this is a slightly different request and very much needed. I can't send my designer to the fontsource website and say "we need to find a font that matches what you used in the design." without it taking many many clicks. (I also may have missed this in the new feature list 🙏 ) cc: @ayuhito

[ayuhito]

It's really slow to click through each font name to get a new preview loaded and see if the font is the right style. Filtering a list of fonts (already previewed with the default text) will go a long way in quickly finding a font that fits the needs of your design.

Are you perhaps talking about #552? A lot of that is already implemented at the current preview website for reference. Font loading on the homepage is also slow rn, I've got something in the works with LiteFS to speed that up.

[scottrepreneur]

Ah perfect! I missed that on the home task. Thanks. This'll be great