# How to Make a Website | Step by Step [2026]

Channel: Steve Builds Websites
Video: https://www.youtube.com/watch?v=prLv5uwUtuY
Duration: 28 min
Language: English
Words: 4758
Transcript page: https://viewrankai.com/tools/youtube-transcript/prLv5uwUtuY

---

[0:00] so you want to make your own website well you might open your laptop head to Google and search how to make your own website and you might regret that you're read about HTML CSS domain names SSL JavaScript Frameworks WordPress Wix it's all a lot to wrap your head around so let's cut through the noise because guess what anyone can make their own website even total beginners and that's what we're going to do in this video we're going to take this sketch I made right here and we're going to turn it into a real live website on a real life domain name we're not going to skip

[0:30] anything SEO design domains we're going to do it all and it's not going to be painful it's going to be straightforward and clear let's do this so I want to build a website for my YouTube channel like the channel you're watching me on right now it's called Steve builds websites and if you look at my sketch you can see it's a pretty straightforward website a logo a navigation and just a nice homepage pretty typical for any Small Business website or personal website our first task is to choose a tool to build our website with because almost every website on the Internet is built using a tool now there are literally hundreds of

[1:06] tools for building websites but for the sake of Simplicity I'm going to generalize a little bit and lump all these tools into four categories Frameworks static site generators CMS and website Builders and here are examples of each almost all websites on the internet use a tool in one of these four categories now right off the bat don't even worry about Frameworks and static site generators if you don't know how to code because they require coding a CMS like WordPress might require some coding but not as much and a website builder has no coding so of course if we place this on a Continuum Frameworks and static site generators

[1:46] are the most challenging to use while website Builders are the easiest I've built websites using Tools in all of these categories and here's what I've learned match your website project to the tool for example if you were to build something like Facebook you'd want to use a framework but if you're building a simple Small Business website like we're going to build today you'd want to use a website builder you could also use a CMS like WordPress especially if you use a plugin like Elementor but in my experience it probably won't be as easy website Builders are just simple and easy to manage and that's what I'm looking for

[2:24] so let's zoom in on website Builders there are a lot of different website Builders but in my experience there are a few that are definitely better than the others Squarespace Wix Shopify card web flow and framer let's call these the elite 6 now remember when I said match the website project to the tool well that's true for website Builders too because each of these tools have their own strengths Squarespace and Wix they're the best allaround website Builders they have drag and drop editors so you can just grab out elements and move them around your website you can also resize and reposition things how you want all

[3:05] kinds of sites are built with Squarespace and Wix small business sites portfolios blogs restaurant sites and more I personally like Squarespace better than Wix but Wix definitely deserves to be mentioned Shopify is the best for e-commerce like if you're building a proper online store with multiple products with variations and check out you'll probably want to use Shopify it's not super easy to use like it's not a drag and drop editor like Squarespace and Wix but it does have outstanding features for e-commerce card is a fun one because it's definitely the cheapest option but there's an important asterisk Card is only for onepage websites so like these

[3:52] are all example sites and you see a lot of personal websites and landing pages built with card I think it's worth considering if your website can be condensed down into one page web flow and framer are the best for totally Custom Designs like you can build just about any kind of design using web flow in framer for example I've seen people recreate Apple's website in webflow like including the animations that's pretty incredible the only thing is both webflow and framer have a pretty serious learning curve like even if you have a web design background they will still take you a few days maybe weeks to learn but in

[4:27] return they'll give you total design freedom you can design however you'd like now what's the difference between the two well framer is probably a bit easier to use and web flow is probably a bit more powerful so we want to match my website project Steve builds websites to the right tool probably not Shopify because I don't need e-commerce probably not card because kind of want multiple Pages probably not web flow or framer because I don't want to spend too much time on this project which leaves Squarespace and Wix I'm going to choose Squarespace because as I've said I I like it better than Wix but that doesn't mean you need to

[5:04] use Squarespace remember match the website project to the tool you can find links to each of these tools in the video description and I should say almost all of these links are affiliate links so if you click those links you'll be supporting my work I hope it's clear though this is not a sponsored video like I currently have websites on Squarespace Shopify webflow and card I trust these tools with my own businesses but our first goal is done we've chosen Squarespace as our tool now let's get to work let's start by building the pages and header of our website here we are in Squarespace we can create our website

[5:41] from templates or from scratch with a blank template the Squarespace has a ton of templates you can choose from if we click through them we can see a lot are really good but I'm not going to use them we're going to build this site from scratch with a blank template but don't be intimidated it's actually really straightforward so here's our website and remember here is my little sketch as you can see I've got a list of pages I want to add so let's start by adding those pages we'll go to pages and we'll add a blank page and I'll do this quickly now we have five pages and we

[6:24] can see them listed in the navigation here now if we refer back to my sketch you can see I have a bit of a different header layout the logo is here the navigation is in the middle and the button is on the right so let's make that change we'll hit edit then click edit site header let's first add an element and there's a couple different elements squar space lets us add but I really want a button nice then let's edit the design and I like this layout best and there you have it we've designed a very basic but effective header now you've probably noticed before that headers have a pretty

[7:06] consistent layout across the internet this consistency across the entire internet is a very good thing doesn't matter if you're Apple charity water or the cafe down the street your header is going to be pretty consistent logos on the left buttons on the right and navigation is somewhere in the middle your website header should feel familiar even if a visitor has never been to your site before they should intuitively know how to use it think of it like elevator buttons every elevator has buttons in the same place when you enter an elevator you know where the buttons are going to be in the same way don't make people

[7:44] think or have to search in order to navigate your website and I want to talk about this button it's often referred to as a call to action or CTA and you want to reserve this button for your website's most important business goal if you're a barber this is book an appointment if you're a landscaper this is get a quote if you're a restaurant this is reservations and if you're a nonprofit this is donate Squarespace has some cool features that I could use for my CTA I've seen other websites using squarespace's appointment scheduling feature and I thought I could use that to let people schedule a call with me if

[8:20] they wanted some personalized help or see lots of other creators selling courses and it seems pretty lucrative so maybe I could make the button buy my course but to be honest scheduling calls sounds like a lot of work and I think we have enough creators selling courses in the world we don't need more so I'll keep it simple for now there's really only one goal I have for Steve builds websites and that's watch my videos on YouTube that's the main goal nice okay let's leave this editor and preview our website so far we have our Pages added and our header is designed things do look pretty basic

[8:57] right now and we will style this more but first let's create our homepage homepage that's a big page I feel like I could use some inspiration before we get started let's look at some great homepages ah this is great this is what you want a big friendly photo and I kind of dig these ferns they remind me of like the awards you see on film posters kind of a fun touch I love this you want to be concise on your homepage and Lizzie has beautifully summarized what she does in just five words find the joy and magnify it and she's backed it up with some fun

[9:33] colors another great one I like that she's putting herself front and center uh and this is a great slogan let's turn your website visitors into dream clients notice how she's talking about you and not herself there are definitely some themes coming through here be human don't hide behind stale corporate imagery put yourself out there people trust humans not faceless corporations be concise no walls of text people don't read the internet they browse the internet right so give them something scannable be about the audience put yourself in their shoes what can you do for them now theories are easy it's much harder to put theories into practice but that's

[10:13] what we're going to do now let's make the homepage so let's edit we'll start by giving this section a background image and I want to be human just like the websites we just looked at so I'm going to put a photo of myself front and center next let's add a headline so add a block drag it out and here's my slogan I try every website builder so you don't have to let's make it a heading and Squarespace has this cool scale text option which makes the text the same size as the box I don't know I think it looks sharp nice and I think the page

[10:54] could use another element so we're going to try to add some testimonials testimonials are just just a good way to build trust and I have tons of YouTube comments which are essentially testimonials so let's use some of those and I kind of want to use this Fern idea from the carpet cleaners so let's start by adding an image of the fern let's drag it down We'll add another one I've actually placed both of these font images in the video description so if you want to use them yourself uh go for it now let's add the testimonial Let's Line everything up sweet now I'm going to duplicate it and

[11:37] again just line this all up and I'll paste in the comments and let's nudge this down actually and there we go we have a homepage that was so easy or was it cuz think about it I just happened to have a a perfectly formatted image of myself sitting around on my hard drive and I seem to come up with that slogan pretty quick suspicious isn't it okay confession time I haven't been totally upfront because I made 10 other homepages before I settled on this one and this is how web design really works iteration no one gets a perfect on their first attempt you have to try out

[12:25] a bunch of different things to see what feels right and one thing I figured out late in the process my photos just weren't working I was just using photos that I had used previously for thumbnails and videos but eventually I realized I need to just take a fresh new photo that would specifically work for the website okay so I need some kind of like photo for the homepage right so I'm in my super messy basement and I'm just set up over here to shoot some stuff so I got my camera and then I have a light right there uh and then that's just uh a countertop on a keyboard

[12:59] stand and I'm just shooting something super basic so yeah I did a little photo shoot in the basement and that helped a lot once I had the photo everything else kind of fell in place now I know not everyone has cameras and lights in their basement but you can always just hire a photographer or honestly just watch a few YouTube tutorials on how to shoot a self-portrait with your phone cuz phones have incredible cameras today but I feel better I've made my confession and now I can declare in good cont ience that our homepage is done now let's style our website we're going to give it some

[13:34] fresh colors and fonts but before we do that let's take a trip to the mall according to the stock photos I found malls are where teens hang out unusually cool old people go shopping and couples pose awkwardly in elevators what's interesting about malls is all the stores are the same shape long rectangles and so it's up to the store's entrance to grab the attention of people walking by look at how different each storefront looks there's a reason apple is tidy and minimalist well Toys R Us is loud and colorful and it's the same with websites websites can communicate A vibe and tone with colors fonts and

[14:14] photography building an art portfolio you might go for a minimalist Vibe lots of white space and room for big photos building a food website you might go for something colorful and bright and you might even use some louder fonts so what do I want from my website well I think the vibe I want is something sort of playful unfortunately if we open site Styles in Squarespace there are different themes we can choose

[14:45] from I think I kind of like this one but let's modify it a bit let's change the color palette all palettes have two light colors one accent color and two dark colors for the lightest I chose a a soft green and this is actually a little design trick sometimes a pure white is a little harsh soften it up a little bit with some color then we'll add a mint green and for the accent I want something playful I like this green then I'll leave the blue and for my darkest I'm going to use black perfect next let's add some splashes of color to this page let's give this button our accent

[15:27] color sweet and we'll make the text black and then let's go back to our heading and Squarespace has the option to underline text it's kind of cool so let's do that let's use our green accent color and let's choose a fun underline nice things are starting to feel more playful now I'm not totally sure about the shape of this button and we can change it by choosing a different button pack there's a couple we can choose from

[16:04] I think I kind of like this one just a classic round button and just like that I think we've got our style done now let's build our next page it's called my promise sometimes it's hard to know what other Pages you need on your website so you want to be thoughtful about it only create Pages because they're going to be genuinely helpful to your audience for example my mom is a therapist and on her website she has a page called what you can expect where she explains what a typical therapy session is like I love this if you've never been to therapy before can be a bit intimidating this

[16:38] hopefully helps people prepare themselves a bit my mom is so smart or consider this cleaning company they have an FAQ page where they answer basic questions like how long does it take my carpet to dry when can I walk on my carpet both my mom and the carpet cleaning company are doing something important they're putting themselves in the shoes of their customers they're creating pages that answer the questions and concerns their customers might have so back to my website why do I have a page called my promise well I'm a YouTuber who reviews tools for building websites one thing I'd imagine my audience is wondering is this guy

[17:14] trustworthy so on this page I'm going to make some promises that explain what you can expect from my videos first let's make a heading let's Center it then let's start adding promises I actually use the tools I recommend there isn't a best [Music] tool my videos shouldn't be boring and let's get these all lined up no sponsored videos but I do have some affiliate links after all my videos do take time to make so I have to make some money and let's just move the page up a bit and let's give that heading the same underline then let's add some lines just to give this a bit more

[18:10] [Music] order and let's move it all down and yeah that looks okay now I think the key here is to be specific notice I'm not saying you can trust me instead I'm making specific commitments and people can make up their own minds about me to illustrate this let's look at another example a bad example my bank TD Canada Trust plasters Canada with the slogan banking can be this comfortable and they include a chair that frankly doesn't even look that comfortable but that's not the point because in Canada at least banks are the worst to deal with they're not comfortable at all TD Canada Trust is telling us it'll be comfortable but

[18:54] they're making no concrete commitments so I have no reason to believe them I think a more effective ad would include a specific commitment for example no hold times longer than 10 minutes boom that's a specific commitment that would catch my eye so when you make your own Pages try to avoid making vague statements like we pride ourselves on customer service or we're committed to Quality or customers are core to our mission it's too vague and meaningless get more specific if you can okay let's keep going below this I'm going to add some biographical info just feels like I need that somewhere on my website so let's drag it out and then

[19:37] I'll add a photo move it over here and then let's use squares spaces shape tool to make it a bit more interesting kind of like this shape and there we go ah one more tweak now I'll be honest I find copyrighting really difficult I think I did a decent job here but my best advice is to write like you're chatting with a friend over coffee don't be overly formal good writing is conversational of course these days chat GPT can be really helpful for brainstorming ideas or just as a way to get started though be careful the stuff it generates is pretty vague you can also use squares spaces

[20:19] built in AI tool too though it's also pretty vague and to be honest we want to avoid large walls of text like this okay now this page still feels just a bit Bland to me so I have this idea Squarespace lets you add animated art to the background of your pages interesting kind of like this one now it's way too distracting right now so let's make it a little more subtle and change the shape maybe make them bigger and I think that's kind of interesting I am kind kind of sacrificing a bit of readability here because I think it does make the text more difficult to read but it's a bit of

[21:04] a trade-off and you can make your own decision for your own website okay my promise done next up the rest of the pages but let's just jump to the completed versions of these Pages let's take a look at them popular videos this is just a gallery of my popular videos pretty straightforward FAQ here I try to answer the most common questions my audience asks things like can companies pay you for more higher ratings what gear do you use can you make a personalized recommendation that kind of thing lastly I created a basic contact page with a form and those are the other Pages now we haven't yet looked at

[21:44] something that's super important mobile sure our website looks good on desktop but how's it going to look on phones so let's take a peek nice let's look at the FAQ page and it could use some adjustments Squarespace lets you edit the website on mobile to get things lined up how you want yeah that looks just a bit better and I'll have to edit the mobile version of the other Pages too but I'm going to skip that I think you get the point okay so mobile done at this point we've built our website all we have to do is publish it on a domain name after that we can

[22:24] talk about SEO and marketing cuz our website is useless if no one visits it but back to domains domain names can sound intimidating but it's pretty easy to set them up with Squarespace and it's really important to know if you register your domain name with Squarespace you can always transfer your domain name to a different provider no website builder can hold your domain name hostage that's illegal so we'll just go to our site settings domains and email and let's get a domain name fortunately Steve builds websites.com is available for me so that's easy and I'll check out domain names do cost money after all and we got it we do need to upgrade

[23:06] to a paid plan yet so just going to select the cheapest plan and I should mention all these prices are Canadian dollars and we're done our website is live on a domain name seriously it's up there like you can go look at it right now finally we can talk about the fun stuff SEO and marketing because our website is useless if no one visits it SEO or search engine optimization is a term that gets thrown around a lot but basically it means how do you get your website to show up in search engines so let's walk through an SEO example let's say you're Common Goods Pottery this is

[23:46] actually a real business in Toronto they sell Ceramics and they also offer pottery classes let's think of some SEO keywords they might want to focus on a keyword is just any word or phrase that people search for in a search engine for example people might search pottery classes in Toronto but what would be really useful is if we could know how often people are searching that keyword while we can get this information there are tools that can give a pretty accurate estimate of this it's called keyword volume and I use a tool called sem rush for this or sem rush I have no idea how it's pronounced so let's check

[24:21] pottery classes in Toronto wow 3600 people search that each month that's actually awesome let's keep thinking what else can we try they sell Ceramics so what if we try ceramic mug yeah people are definitely searching that but here's the thing if we flip over to Google we can see a lot of websites are competing for the keyword ceramic mug including Amazon and CB2 so it's pretty competitive so let's get a bit more specific let's try handmade ceramic mug Amazon and CB2 are less likely to compete on that and yeah that gets plenty of traffic too that's a good one or we could come at this completely

[25:03] differently let's try housewarming gifts and we can see that gets a ton of searches over 40,000 we could easily write a blog post with a bunch of housewarming gift ideas and include our own ceramic mugs this is the core of SEO find keywords with some volume that aren't too competitive I've included a link to sem rush in the video description though it's pretty expensive it starts at like $140 per month I bet if you looked around you could probably find a cheaper option so we have our keywords but how do we actually rank in Google for these keywords and that's where things get complicated there are many factors that

[25:37] contribute to where you rank in Google more then can be covered in this video and there are actually some great SEO YouTubers that I'll link to in the video description but let me give you a broad overview for starters you want a good title for your page in this particular case I'm not talking about the headline though I mean Pages have a title like you can see it in your browser window this title is also what shows up in Google search and this title should probably mention your keyword and be sort of enticing then a much bigger question is how does the content on your page support your SEO and I often use a

[26:12] tool called clear scope to help me with that basically you give it a keyword and it will give you a list of terms to mention on your page then as you write the content for the page it'll highlight the terms it'll also give you a Content grade to tell you how you're doing none of this guarantees you'll have any SEO success SEO is very competitive which is why you might want to consider Google ads this is basically paying Google to show up when our keywords are searched notice the sponsored tag you don't have to worry about ranking organically but it does cost money I've used Google ads for a couple family

[26:48] members businesses my brother's concrete company and my mom's therapy business and it's a super effective way to get new leads for small businesses okay I want to end with some advice a great website is not about technology it's not about HTML it's not about CSS and it's not about whether you choose the perfect tool if you want a great website be human put yourself out there be like the stores and malls and use colors and fonts to create a Vibe and tone no walls of text be concise you don't have to be a perfectionist but keep iterating until it feels right to you and above all don't make your

[27:27] website about you put yourself in the shoes of your visitors understand what they need and try to provide it so even if you don't feel like a technical person don't stress that's not as important as you think stick to these principles and you can make a great website thanks for watching

---

About this transcript
Read from YouTube's own caption track and laid out by ViewRank AI (https://viewrankai.com).
ViewRank AI finds the videos already beating a creator's own average on Instagram, TikTok and YouTube Shorts, transcribes them from the audio itself in more than 60 languages, and turns what worked into new ideas and scripts.
Free transcript tools, no account needed: https://viewrankai.com/tools
How to read any video this way: https://viewrankai.com/llms.txt