2023-02-27
Like the title suggest, we’re breaking down how you can learn to build a website by copying other established website 👀
I see a lot of founders and builders approached web design like art, they aim for originality and authenticity. Unfortunately, web design is like art, and achieving an original masterpiece on your first try is almost impossible, and completely unnecessary. No one is asking you to be an artist.
Your GOAL: deliver the message about:
As long as these 3 things are conveyed properly, you’re good to go. Focus on your product friends!
So, how do we achieve that? It’s fairly simple. Just like learning anything, you start by copying. Here’s an analogy:
In this scale, getting to level 3 is usually enough, while getting to level 4 is what almost every website does.
Still not convinced? Take a look at these major sites:
Like seriously, they’re all the same... Check out this blog for a check list of what you need to put in your website.
But right now, we’re focused on the styling part, the feel, the look. You might say, “Oh yeah, simple enough: A heading, some subtitle, and a button
But it might not look the way you want it unless you have the “design feeling”. This is where attempting level 3 is safe. So let’s get you there by the end of this blog post
Remember, copying it EXACTLY is very very important. Even use their words, just try to recreate it in your favorite tool and see how it looks.
1. Pick a nice looking site, and copy it exactly. I recommend you to pick from this list:
Of course, without using pure code, there will be limitations on what you can recreate. So just try your best, if the button is originally square, but you tool’s button is round, just use the same color.
2. Start building, try using the original site’s texts first. Using your own site’s copy might not work because the design might have been made for the exactly words being put there 😉. Also use their pictures for now, we’ll dive into building mockups later on.
3. Once you can somewhat copy the site, pause and take a look at that site. It should look pretty good and you’d be happy to use it as your site.
This exercise helps you actually see what the font size and weights are for each part of the website. Usually, you’d have:
That’s it! Your site should look mint & fresh, following the current trend of sites, with consistent typography and colors.
Now, if you’re ready to step up, you can try combining 2-3 sites with a similar style together, and you’d have a site that’s perfect for your product.
We're a remote software company, building online tools for creators, builders, and side hustlers. We quit our 9-5 to pursue our dreams, and we want to help others do the same.
Backed by
Copyright © 2023 Govest, Inc. All rights reserved.