Freya Helps Me

A Beginner's Guide: 9 Steps to Building a Website from Scratch

The homepage of Freya's website is displayed on a laptop, Mac, tablet, and phone

Websites… it feels like everyone has one these days, am I right…?

Well, I mean, they ARE pretty useful… more essential for almost all businesses. It gives your business an online presence, a place where your clients can go to find out more about you and even a way you can sell your produce… But where do you start when you need to make a new website?

In this blog, we’ll explore building a website from scratch, and if you’re a beginner in the vast world of web development, fear not! We’ve got your back with a step-by-step guide that will take you from a curious novice to a proud website creator.

Step 1: Define Your Purpose and Audience

Before anything else, take a moment to consider the purpose of your website and who your target audience is. Whether you’re building a personal blog, portfolio, e-commerce store or business site with just information on how clients can get in touch, having a clear website brief will help shape your design and functionality choices.

For more guidance on creating an effective website brief, be sure to check out our detailed blog on the topic once you’ve finished reading this one!

Step 2: Choose a Domain Name and Hosting Provider

A domain name is like your website’s home address on the internet – it’s what people type into their browsers to find you. Think of it as the easy-to-remember name for your site, like “google.com” or “facebook.com,” instead of a long string of numbers. It’s your website’s first impression, so make sure it’s simple and memorable! For us, it’s www.FreyaHelps.Me – which will take you back to the homepage.

Choosing a domain name is the first step in building your online presence. After that, selecting a reliable hosting provider is crucial to make sure your website is accessible to everyone. Platforms like Bluehost, SiteGround, and Hostinger offer easy out-of-the-box type solutions, but they vary in pricing and features.

If you want someone with boots on the ground and a personal approach, we work with some brilliant people we can recommend you to however (they host this website and that of other clients too so we trust them first-hand). Be sure to do your research and pick the one that best fits your needs.

Some hosting providers also give you X number of maintenance hours free a month (to update plugins), have downtime reports (so your website consistently stays live/online) or even heightened security measures (such as secure server locations) etc.

Step 3: Plan Your Website Structure

Plan out the pages and content you want on your website ahead of time. This might include a Homepage, an ‘about me’ section, a portfolio, a blog, product pages or any other important pages. Having a clear outline will save you time and make building your site much easier!

The one page we’d always recommend though, is a decent ‘contact’ page – to ensure your clients can get in touch easily.

It’s at this point that it’s a good time to start thinking about what you want your website to say, the words, the images, the pictures, the call to action… you name it. This planning step is one of the most important – it doesn’t have to be perfect, you can change it at a later date BUT getting the structure right at this stage will save you effort in the long run.

Step 4: Learn HTML and CSS – not always applicable

Now, let’s look into the fun part – coding! When building a website, HTML (Hypertext Markup Language) is what gives your webpage its structure. Think of it as the foundation, like the walls and frame of a house. Then comes CSS (Cascading Style Sheets), which adds all the style and design, making your site look polished and unique – kind of like choosing paint colours and decor for your home.

If you’re new to coding, don’t worry! There are plenty of beginner-friendly resources out there to help you get started. Websites like W3Schools and MDN Web Docs offer easy-to-follow tutorials that will guide you through the basics step by step. Before you know it, you’ll be creating your own web pages!

If you’ve not got the time or energy to code though and still want to give it a go yourself, you could always opt for a website builder tool such as Squarespace, or (our preferred) Wix. These types of sites ‘lock you in’ to using their platform, but for lots, that’s not always a bad thing.

We actually wrote a blog that might help you with this decision ‘Wix Vs WordPress – What Platform Is Best And Why’.

Step 5: Incorporate JavaScript for Interactivity – also not always applicable

Take your website to the next level by adding some interactivity with JavaScript! This allows you to create a more engaging experience for your visitors. With JavaScript, you can learn the basics like functions, variables, and events to make things happen on your site – like buttons that respond when clicked or forms that give real-time feedback.

It might sound tricky at first, but with a bit of practice, you’ll be able to add some cool, interactive features to your site!

Step 6: Choose a Framework or CMS

Frameworks like React, Angular, or Vue.js can help streamline your development process. Alternatively, Content Management Systems (CMS) like Wix & WordPress provide a user-friendly interface for building websites without extensive coding knowledge.

Step 7: Test, test and test again!

As your website starts coming together, it’s important to test how it looks and works across different browsers and devices. This ensures that your site offers a smooth experience for everyone, whether they’re on a phone, tablet, or computer. Catching and fixing any issues now will save you a lot of hassle down the road!

Get multiple people to test your website works – you don’t want any broken links or drop-off points, so iron them out.

Step 8: Optimise for SEO

SEO, or Search Engine Optimisation, is a key part of building a successful website. It helps your site rank higher on search engines like Google, making it easier for people to find you.

To boost your website’s visibility, start by implementing some basic SEO practices. Research keywords that are relevant to your content, create descriptive meta tags (the short descriptions that show up in search results) and optimise your images to help your pages load faster. These small steps can make a big difference in attracting visitors to your site!

For more information on this, check out our blog on why SEO is about more than just content

Step 9: Launch Your Website

Congratulations, you’ve made it!

Once you’re satisfied with your creation and have tested it thoroughly, it’s time to launch your website and share it with the world.

Remember, the journey of web development is a continuous learning process. Don’t hesitate to explore new technologies, keep honing your skills, and most importantly, have fun building your digital masterpiece! If you’d like a helping hand from a friendly face, then feel free to get in touch – we offer completely free 30-minute consultations where we can discuss your business needs and form a plan of action, should you require my help.

If this all sounds too complicated and scary though, we can also help make and manage the website for you – all you need to do is ask.