I have a SaaS webpage that has poor aesthetics and want to change it asap. I know basic CSS and html and have experience using frameworks like uikit. But at the end of the day I'm an engineer with a sense of aesthetic appreciation but not aesthetic creation.
To use the most recent example I've come across, how do I go about building something like the linktree.com landing page?
I'm eager to learn whatever is necessary to design a beautiful webpage.
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.