Ask HN: How to build a good looking SaaS landing page?
adnanxsg 2021-08-17 05:00:54 +0000 UTC [ - ]
A better option is to purchase something off of https://themeforest.net/category/site-templates
its usually pretty cheap (sub $100) and the quality is pretty high.
Learning to design your own is harder. I'd say start with something from the resources above and iterate as you optimize for specific goals. As you spend more time optimizing your product you'll see design patterns being used by your competitors and learn along the way.
floridageorgia 2021-08-17 16:00:52 +0000 UTC [ - ]
Sketchappsources looks promising.
> A better option is to purchase something off of https://themeforest.net/category/site-templates
I found templates on themeforest fall short on the aesthetics that you find in SaaS websites like linktree.com that I alluded to in my post description. Please correct me I have the wrong impression of themeforest.
> As you spend more time optimizing your product you'll see design patterns being used by your competitors and learn along the way.
This is where I'm at. I'm able to build a front-end but competitors products look way good and I want to bridge the aesthetic gap.
max_ 2021-08-17 07:51:13 +0000 UTC [ - ]
[0]: https://andybrewer.github.io/mvp/ [1]: https://colorhunt.co/
bjacobt 2021-08-17 13:50:16 +0000 UTC [ - ]
So I purchased multiple themes and settled on Landkit[0], which is built on top of bootstrap.
ecesena 2021-08-17 15:04:43 +0000 UTC [ - ]
[1] https://github.com/cssninjaStudio/fresh
[2] https://github.com/saasform/saasform/tree/main/data/themes/f...
floridageorgia 2021-08-17 16:12:44 +0000 UTC [ - ]
the2ndfloorguy 2021-08-17 05:42:36 +0000 UTC [ - ]
Being an engineer, downloading a free template and just using it does not suit me. Designing on your own might take time some time but will help your product in long run as using a template restricts creative additions.
floridageorgia 2021-08-17 15:55:00 +0000 UTC [ - ]
I feel the same way about templates as they constrain design freedom. I lean more toward CSS/JS frameworks.
> Pick any existing CSS framework sucha tailwind CSS
I've noticed tailwind gets a lot of love on HN. Is Tailwind UI going to help make it easy to create a landing page with top notch aesthetics?
roosgit 2021-08-17 12:54:38 +0000 UTC [ - ]
The first thing I would do is look for a structure that would fit my subject. For example, what goes at the top? Quite a few websites choose a tagline or a small description(with a large font size) on the left, followed by a slightly longer description(with a smaller font size) and a visible action button. While on the right, there's usually an image of the product. Now, does this work in my case? If it doesn't, I look at other examples.
The next sections can be cherry picked. I might want to show the main or unique features, testimonials and other things I'd consider essential to tell the visitors.
Only after I'd be done with this part (could be called wireframing), I'd start choosing colors and fonts. My recommendation is that if you like a color combination used on a website, use it and stick to it. Don't replace one of the colors, stick to what is there. Just don't pick the colors from a competitor's website, that's poor form, in my opinion.
Typography is a little trickier. You have to play with sizes and combinations. And in a lot of cases, good fonts are not free. But there are also decent options available in Google Fonts. On this page you can find good free font pairs https://www.fontpair.co/all.
floridageorgia 2021-08-17 16:09:40 +0000 UTC [ - ]