How to make a website? The ultimate guide on how to design a website, write a copy, and promote it
Published: May 24, 2023
Reading time: 31 minutes 26 seconds
Table of contents
If you're going to create your first website, and you want it to look good, you should read this article.
Look, I've been there too. A complete rookie browsing through one blog post after another, trying to find answers, not knowing how to ask the question correctly.
That's why I decided to write a very beginner-friendly but in-depth guide on how to make a website. It's a step-by-step tutorial filled with examples, dos and don'ts, and other good stuff that you've been looking for.
Who needs a website anyway?
The Internet has become an inseparable part of our everyday lives. It's a fact that I don't think anybody would dare to argue with. If you want to take some virtual space for yourself, you have two options. You can create a profile on one of the social media platforms or have a professional website.
As you might have already figured out social media are for people to connect and show their everyday life. Websites are more professional and meant for business. The lines are blurry, though. Nowadays, it's hard to find a company that doesn't have an Instagram profile. Some people even start their businesses on Instagram or Facebook and use it as a main channel to connect with their clients - to inform, sell and help.
Same with websites.
Spoiler alert!
It's not a rocket since to make one.
Even without a huge budget and a company with a headquarters on the top floor, you can have a website. What's more, you don't even need to have a business to have a website.
You can be an artist and use a website as your portfolio.
Or maybe you're planning a wedding and want to create a website for your guest to find all the tips and information about the event.
As many people, as many reasons for one.
All being said, you probably need a site to show yourself or your business to the world. If you're still wondering if social media profiles will not do the part, let me just remind you about the benefits of having a website.
-
You're not dependent on a platform that can shut down one day and all your online presence with it.
-
The image you can create with a website is way more professional, hence you're more credible.
-
Your potential clients can find you not just because they know your name but because people are looking for a product or a service you're offering on Google. You're expanding your reach.
-
You have total control over how your website will look, not just over the content you put out there.
-
You have much more insight and data to analyze and use for polishing your communication and selling more.
-
A website can be easily updated and expanded as your business grows and evolves making it a flexible and scalable solution.
-
It's an excellent way for improving customer service since a website can be an all-in-one platform for your clients to access information, make inquiries, and submit feedback or complaints.
I hope this list helped you decide if having a website is worth it. Now let's go through the ways you can get it.
Different ways to make a website
Hire a freelance web designer or web design agency
Back in the day, commissioning a professional to create a website was the only way to have one. Unless you knew how to code and had an aesthetic sense.
You can still go to a web design agency or find a freelance web designer and work with them on this project. However, you must be aware that it's not the cheapest service. Frankly, quite the opposite.
The prices usually vary from $1000 to $10.000 for designing a website. However, you must remember all the additional costs of maintaining a site. Creating a website the traditional way will also take some time - be prepared for meetings, briefs, and waiting.
That's the full price you pay for the skills and time of professional web designers.
Tip number 1
If you don't need a site for a worldwide e-commerce business that requires lots of data-focused integrations, you should think about creating a website by yourself
DIY website - be your own web designer
Recent years changed the way we think about website design and who should be in charge of website creation. Thanks to website builders you can build a website by yourself. You don't need to know how to code, because the website builder will do it all for you.
If you decide to use a template, you don't even need to know what looks good and what doesn't. You can just add your content and publish your website.
But don't worry, going a DIY route doesn't mean you're sentenced to have a generic-looking website based on the same template as everybody else.
Website-building software, like WebWave, allows you to design a website from scratch. Such a process resembles creating graphics in a graphic design tool.
Join over 514 000 WebWave users and create websites with a true drag and drop website builder.
How to design a website by yourself?
As we've already established, you can create a website without any coding knowledge and by yourself. But still, if you've never done it before, you can feel a bit intimidated.
To make this whole process easier for you, I created this 13-step guide on how you can make your website. If you follow those guidelines and tips, you can be sure that the results will blow your mind and you will not break a tear in the meantime.
WebWave also allows you to quickly remind your password, so you don't have to worry even if you forget it.
The process of website creation can be divided into 4 main parts.
-
Preparation
-
Design a website
-
Create content
-
Promote your website
Now let's dive into details.
Step 1. Identify your goals and audience
To successfully identify your website's goals and audience, you need to answer the following questions.
What is the primary purpose of my website?
Leading questions:
-
Am I looking to sell products or services, generate leads, provide information, showcase my work, or achieve another specific objective?
-
What specific actions do I want visitors to take on my website (e.g., making a purchase, submitting a contact form, subscribing to a newsletter)?
-
What specific problem or need does my website aim to address for my target audience?
Why establishing a site's purpose is important?:
-
it sets up a clear focus and direction for the website's design, content, and functionality
-
you get the guidelines to design a user experience (UX) that meets the needs and expectations of your visitors
-
it ensures that your website provides value to its visitors
Who is my target audience?
Leading questions:
-
What are the demographics of my target audience (age, gender, location, interests)?
-
What are their needs, pain points, and motivations that my website can address?
-
How can I create a website experience that resonates with and engages my target audience?
Why defining a target audience is important?:
-
it allows you to create content and messaging that resonates with their specific needs, interests, and preferences; think about creating persuasive calls-to-action directly influencing conversion rates
-
you can improve general UX; consider their needs and expectations and design intuitive navigation, prioritize relevant content, and create user-friendly interfaces
How does my website align with my broader business goals?
Leading questions:
-
How does my website support and contribute to achieving my overall business goals?
-
How does my website fit into my marketing strategy and customer acquisition process?
Why aligning your website with business goals is important?:
-
Your website plays a pivotal role in supporting your overall marketing strategies.
-
Setting specific and measurable goals allows you to track the performance of your website and evaluate its success
If you're creating a business website, you've probably already answered similar questions concerning your business itself. Regardless of that, it's still important to remind yourself of the core of your profession. You need to be aware of your goals and audience because they create guidelines for your web design project and will help you make the right decisions.
Tip number 2
Throughout the entire process of making a website, you will ask yourself - is that the optimal solution for my audience and business goals?
Step 2. Pick a website builder and hosting provider
Picking the right tool to build and host your website is not an easy task. There are many options available on the market, so it's hard to compare the best website builders to make the most rational decision. That's why I prepared some notes for you, explaining what to pay attention to and what tools you should consider.
Ease of use and customization options in a website builder
Creating websites using website builders is supposed to be easy. "Supposed to" is not a typo. You must be aware that website creators vary in terms of ease of use and skill set required to get the best of them.
Solutions currently available on the market can be divided into 3 sections.
We have very simple website builders like Wix, Squarespace, and Zyro. Making websites with Wix is a very uncomplicated process. It's possible because you are obliged to start your project from website templates. You can't create a website from scratch. As you might expect, it limits the customization options.
The second group is website-building tools that resemble graphic design programs. Thanks to the drag-and-drop editor designing websites with tools like WebWave or Framer is more like creating graphics. WebWave drag and drop website builder is a perfect solution for those who know how Canva works, and Framer targets more advanced users of Figma. Both tools allow you to customize your pages to a high extent and will be great for building websites not only from a template.
The final group consists of advanced tools like Webflow, EditorX, or WordPress. To achieve the best results with them you have to at least understand web development and coding principles. Usually, you will need to add custom code to create a high-quality website with these tools.
If you're interested, you can read our in-depth comparison of the most popular HTML website builders. It should help you make a decision about which tool you should use.
Additionally, most website builders give you a chance to build a free website so that you can find out by yourself which workflow suits you best.
What functionalities does your kind of website need?
Do you remember when I told you to have a clear goal for your site? It's going to be useful right now.
Your business profile and goals determine what type of functionalities your website needs. When choosing a website builder, you should look for one that will make it easy for you to achieve the results that you're the most focused on.
Here's the list of the most popular website purpose-functionality pairings:
-
selling products and services - an online store
-
generating leads - contact form
-
showcasing portfolio - gallery
-
building brand awareness - blog (and if you work in a team, a website builder should offer a content management system)
-
customer support - live chat
-
social proof - testimonials showcase
-
enhancing local business presence - maps
-
reaching new clients - SEO tools
Website builders can have in-build functionalities or rely on integrations. You can always check the list of solutions that the software is compatible with.
Additionally, your design software of choice must support responsive website design. In today's mobile-driven world, it is crucial that your website is mobile-friendly. This ensures that your website looks and functions well on various devices, providing a seamless user experience. We have a guide on the best responsive website builders where you can read more about the concept itself as well as know your options.
Hosting provider
Hosting makes your website accessible on the Internet. A website (even one that you didn't code yourself) consists of various files, including HTML, CSS, images, videos, and other resources. These files need to be stored on a server that is connected to the internet so that people can access them from their web browsers.
Thankfully, most website builders offer such services, often it's even free web hosting. It's a very comfortable solution taking the burden of finding the hosting provider off your shoulders.
Tip number 3
If you decide to create a website using WordPress, you must find a web hosting provider by yourself. Comparing uptime, performance, and speed as well as security is a challenge
Thankfully, most website builders offer such services, often it's even free web hosting. It's a very comfortable solution taking the burden of finding the hosting provider off your shoulders.
Step 3. Choose a domain name for your website
This step is the first one that will directly reflect in the final version of your website. It's time to pick a domain.
A domain name is a unique address that identifies a website on the internet. You need a custom domain name for your new website, otherwise, your site won't be recognizable by internet users. Domain names play a crucial role in branding and recognition. They help establish the online presence and identity of businesses, organizations, and individuals.
If your business has a name, you can simply include it in a domain. However, chances are that you will have to enter your creative mode and come up with something unique.
Here are some useful tips for you
-
Keep it simple and memorable
-
Do: Use simple, easy-to-pronounce words or phrases and pt for shorter domain names -> Google.com
-
Don't: Include complex or uncommon words that might confuse users -> xyzq28937-website.com
-
-
Reflect your brand (if you already have it)
-
Do: Incorporate your brand name or a variation of it -> webwave.me
-
Don't: Choose a generic or generic-sounding domain name that doesn't align with your brand identity -> FashionWebsite123.com
-
-
Consider keywords
-
Do: Include relevant keywords that people might use to search for your products or services -> FitnessEquipment.com
-
Don't: Stuff your domain name with unrelated or excessive keywords that make it sound spammy -> BestCupcakesFitnessGym.com
-
-
Choose the right domain extension
-
Do: Use a .com extension for commercial websites or choose an extension that aligns with your industry or audience -> MyLocalFlowers.com
-
Don't: Use a domain extension that is unrelated to your business or target audience. -> MyLocalFlowers.xyz
-
-
Check availability and secure it
-
Do: Check domain availability using domain registration services or registrars (it's worth checking out if your website builder offers a free domain and set everything up via their platform)
-
Don't: Delay registering your desired domain name, as it may already be taken by someone else.
-
Step 4. Research
Research might feel like a dull step, but trust me, it's crucial to create your website.
Check out the websites of competitors from your field. When you are a beginner web designer, you will see lots of benefits from conscious web browsing. You will see what solutions you like, what you want to incorporate into your project, and what you want to avoid. Do it for inspiration, but also to see the design and functionality patterns.
Don't be afraid to go to Pinterest or other social media platforms and search for the type of website you want to build and to get familiar with design trends.
Researching and simply checking out other websites is the best way to become fluent and comfortable in the web design world.
Step 5. Create a website outline
The preparation is over! It's time to create. Let's do it step-by-step so that you will build your website with a smile on your face.
A website outline is a structural plan of the pages and content that will be included in a website. It serves as a blueprint, a guide, and a reference point for you during this whole process.
Tip number 4
Don't just think of it. I like to sketch it out on a piece of paper or go for a digital solution and use a tool like Canva. If you're using a website builder like WebWave, you can also do the website outline directly in the editor.
Depending on what type of website you're building, your outline will be different. However, there are some must-have elements that you should consider when creating a site outline.
Main navigation
This section outlines the primary navigation menu or menus that will be present on the website. It identifies the main categories or sections of the site that visitors can access from the top-level navigation. You will probably add there a logo that will be an active button that will link to the homepage.
The navigation will usually be on top of every page. It can be horizontal (common solution) or vertical (less popular sidebar on the left).
Don't put too many elements into the navigation. Keep it clear and concise.
Pages and Subpages
The outline should also include a list of pages and subpages that will make up the website. Here, once again you need to recall a purpose for your website that you established at the beginning. It will determine how broad your website will be.
To help you with it, I prepared a list of the most popular types of websites (with purpose) and what pages they should consist of.
-
Business/Corporate Website:
-
Purpose: Promote a business, showcase products/services, and provide information.
-
Pages: Home, About Us, Products/Services, Contact, Testimonials, Blog (optional), and additional pages specific to the business.
-
-
E-commerce Website:
-
Purpose: Sell products or services online.
-
Pages: Home, Product Categories, Product Listings, Product Details, Shopping Cart, Checkout, User Account, About Us, Contact, and additional pages for policies, FAQs, etc.
-
-
Portfolio Website:
-
Purpose: Showcase the work or achievements of an individual or a creative professional.
-
Pages: Home, Portfolio Projects/Works, About Me, Resume/CV, Contact, Testimonials, Services (if applicable), and a blog (optional).
-
-
Blog:
-
Purpose: Publish and share informational or personal content regularly.
-
Pages: Home (latest blog posts), Blog Posts (individual articles), About Me, Contact, Categories/Tags, Archive, and additional pages for resources, author bio, or a dedicated page for popular posts.
-
-
Non-Profit/Charity Website:
-
Purpose: Raise awareness, gather support, and provide information about a cause or organization.
-
Pages: Home, About Us, Mission/Vision, Programs/Projects, Donation/Sponsorship, Volunteer, News/Events, Contact, and additional pages for testimonials or impact stories.
-
-
Educational/Institutional Website:
-
Purpose: Provide information about an educational institution, school, or university.
-
Pages: Home, About Us, Academics/Courses, Admissions, Faculty/Staff, Events/News, Contact, Student Life, Facilities, and additional pages for alumni, research, or departments.
-
Tip number 5
You can ask ChatGPT to create a content outline for your website. I do it all the time. Just describe your business and goals in a few sentences and it will generate an outline (with content ideas) for you. You're welcome!
Content and Features
Describe briefly each page and section. Note the type of content and specific features that you will include. You can draw simple shapes symbolizing different elements on the canvas. Remember that it's just a sketch of a general idea. You will polish it later.
Step 6. Design a site structure and content
With a website outline, you created a general sketch of how your website is going to look like. Now, let's make it more and more specific. While designing a site structure, you make important decisions that will directly influence how your website will look.
How to pick a website layout?
Website layout describes the arrangement of the elements on the page. It's your page wireframe. I have for you a list of the most popular website layouts with descriptions, use cases, and pros and cons to help you decide which one is best for you.
Note, that the layout will not be the same throughout the entire website and might differ from page to page. For example, the blog page on your personal website will follow the F-pattern website, while the homepage will represent the full-screen image layout.
Z-pattern layout
The content follows a "Z" pattern, where the eye naturally scans from the top left corner to the top right, diagonally down to the bottom left, and finally across to the bottom right. You can also create a Zig-Zag pattern on your page by repeating the Z-pattern layout over and over again. It's well-suited for websites with a clear CTS because it guides users through the desired content flow. If you care about conversions, you should go for this layout. However, it's not suitable for content-heavy pages.
-
Where to use it: landing pages, sales pages, business websites homepages, contact pages
-
Beginner Friendliness: beginner-friendly; you can easily implement it using website builders
F-pattern layout
By analogy to the previous example, the content follows an "F" pattern, with the eye scanning horizontally across the top, then vertically down the left side of the page, and from time to time cutting into the middle. This layout responds to the users' habit of scanning web pages, instead of reading them. Because of that, it's perfect for text-heavy websites, but may not be ideal for websites relying on strong visuals.
-
Where to use it: blog sites, news websites, knowledge bases
-
Beginner Friendliness: beginner-friendly, you can easily achieve this by organizing content in a hierarchical manner
Full-screen image layout
Here, the background image or visual content spans the entire browser window, providing a visually immersive experience. It's a great choice if you want to create an immediate visual impact. If you create a website for the creative industry, you should consider this wireframe. But, keep in mind, that it requires high-quality images and other visual content. Also, as you might already know, it's not the best option for text-heavy sites.
-
Where to use it: photography portfolios, homepages for creative businesses
-
Beginner Friendliness: moderate. the concept is simple, but as a beginner designer, you may need guidance on optimizing image sizes and loading times
Split screen layout
In this case, the web page is divided into two or more vertical sections, displaying different content or options side by side. Thanks to this layout option, you'll be able to achieve clear visual separation of content and offer an interactive user experience. Note: it can limit the amount of content displayed on each side and may require more effort to build its responsive version
-
Where to use it: product comparison page, services showcase page, creative portfolio hero section
-
Beginner Friendliness: beginner-friendly, you will easily make it with website building tools
Asymmetrical layout
The layout uses an uneven distribution of elements, creating visual interest through varying sizes, positioning, or shapes. It's very attention-grabbing and leaves you lots of room for creativity and experimentation. However, you must be very considerate and find the right balance in your visual hierarchy. This layout will not suit every website and business type.
-
Where to use it: creative studios or agencies' homepages, portfolios
-
Beginner Friendliness: moderate, the concept is slightly more advanced, but you can still achieve amazing results if you follow the guidelines
Single Column Layout
For this layout, the content is arranged in a single vertical column, providing a straightforward and easy-to-follow design. If you're aiming toward a clean and minimalistic design, you should consider this wireframe. It's ideal for websites that focus on readability and storytelling.
-
Where to use it: blog posts, landing pages
-
Beginner Friendliness: beginner-friendly, you will implement it in easy steps
Box-based layout
Here, content is organized into separate boxes or sections, often with clear visual boundaries or borders. It provides a structured and organized design, helps to group related content, and supports visual hierarchy. If you decide to follow this layout, you should pay careful attention to spacing and alignment to make sure that everything is visually pleasing.
-
Where to use it: e-commerce product list pages, team or staff pages on your business or corporate website
-
Beginner Friendliness: beginner-friendly, website builders are a great way to build a site like this
Magazine layout
The magazine layout emulates the design and structure of print magazines. It's possible thanks to multiple content sections, featured articles, and visual elements. It's an engaging design, that allows for showcasing featured content and supports content categorization. The risky part is that you must find a way to balance all the visual elements and maintain a clear hierarchy of content. However, if you're facing the challenge of building a content-driven website, you should go for this unique approach.
-
Where to use it: blog pages, lifestyle, and fashion websites
-
Beginner Friendliness: moderate, it requires some design considerations and thoughtful decision making
The color scheme on a website. The perfect way to show your brand
Once you picked the layout, it's time to think about the colors on your website.
Color plays a crucial role in enhancing the visual appeal of a website, attracting users' attention, and creating a positive first impression. In web design, it's considered good practice to craft a color scheme (color palette) for your project. It's a set of colors (usually from 3 to 5) chosen and used together in a design to create a harmonious and visually appealing composition.
The colors you choose, you will use consistently across your website. Each color in a color palette will be used for a specific type of element.
To pick the right color scheme for your website, you should keep those things in mind.
-
Branding consistency - if you have established your brand colors, your website should incorporate them, it will help you establish a strong brand identity among your website visitors.
-
Utilize color psychology - different colors evoke specific emotions and associations, and you should be familiar with them before you pick them for your design, I will elaborate on it more later in this paragraph
-
Color harmony - start by picking a primary color that will serve as the dominant color in your color palette and set the overall tone for your website, then choose additional colors that complement or contrast with it; you can use color harmony principles, such as complementary colors (opposite on the color wheel), analogous colors (adjacent on the color wheel), or monochromatic shades of the primary color.
-
Consider contrast and readability -ensure that text is readable on the background, dark purple will not work on black background
-
Visual hierarchy - color helps establish a visual hierarchy by highlighting important elements, guiding users' attention, and creating a logical flow of information on the page
As promised, here's some color psychology insight for you.
Color psychology of blue:
-
Meaning: Trust, calmness, stability, professionalism
-
Use: Often used by businesses to convey a sense of reliability and credibility. Suitable for corporate websites, financial institutions, healthcare providers, and technology companies
Color psychology of red:
-
Meaning: Energy, urgency, excitement, passion
-
Use: Frequently used to grab attention and create a sense of urgency. Effective for call-to-action buttons, sales promotions, and food-related websites
Color psychology of green:
-
Meaning: Nature, growth, harmony, health
-
Use: Commonly associated with eco-friendly and sustainable initiatives, as well as health and wellness brands. Suitable for websites related to gardening, organic products, and environmental organizations
Color psychology of yellow:
-
Meaning: Happiness, optimism, creativity
-
Use: Yellow is often used to evoke feelings of positivity and cheerfulness. It can be effective for websites related to children, entertainment, and creative industries
Color psychology of orange:
-
Meaning: Enthusiasm, warmth, friendliness
-
Use: Orange is vibrant and energetic, making it suitable for websites promoting social activities, sports, and adventure. It can also create a sense of affordability and value
Color psychology of purple:
-
Meaning: Royalty, luxury, creativity
-
Use: Purple is often associated with luxury brands and high-end products. It can convey a sense of elegance, sophistication, and creativity. Suitable for fashion, beauty, and artistic websites
Color psychology of pink:
-
Meaning: Femininity, romance, tenderness
-
Use: Pink is commonly associated with feminine brands and products. It can create a soft and delicate atmosphere, suitable for websites related to fashion, beauty, and lifestyle
Color psychology of black:
-
Meaning: Elegance, sophistication, authority
-
Use: Black is often used to convey a sense of luxury, exclusivity, and power. It can be effective for high-end fashion brands, luxury goods, and minimalist design websites
Donât forget about the typography
Typography plays a crucial role in web design, contributing to the overall aesthetics and readability of a website. When selecting fonts, it's important to consider the purpose and target audience of the website.
Serif fonts are elegant, and look kinda old-fashioned, but are extremely trendy right now. They are often used for conveying a sense of authority and sophistication.
On the other hand, sans-serif fonts offer a modern and clean look that works well for contemporary and minimalistic designs and for body copy.
Display and script fonts are reserved for special occasions and creative projects that emphasize uniqueness and personality.
Same to colors, typography also creates a hierarchy. By using different font sizes, weights, and styles, you can highlight important elements and send a not-so-secret message to the reader about what to pay attention to on your page.
Additionally, you shouldn't overlook the accessibility. It's a true reflection of a good site design. It's important to maintain sufficient contrast between text and background colors for users with visual impairments. You should also provide alternative text for images containing text and ensure that screen readers can convey the information effectively.
General UX/UI tips you should follow
To close this rather massive section (I hope you're not overloaded with information, tho) I have a list of 5 UX/UI tips that I wish I knew when I was building my very first website.
-
Keep it simple: focus on simplicity and avoid clutter by using a clean and minimalistic design, don't bite off more than you can chew
-
Clear CTA placement: think through where you will position your CTAs to make them easily noticeable and actionable; write action-oriented copy to guide users toward desired actions such as signing up, making a purchase, or contacting you
-
Streamline navigation: look, the navigation bar is not the place to be creative, use clear labels, logical categorization, and a user-friendly menu structure
-
Be consistent in your design: it builds familiarity and helps users navigate and understand the interface more effectively, also a website with a clear color scheme, typography, and layout just looks way more professional
-
Keep thinking about mobile-version of your website: throughout the entire process, make sure that your design choices will transfer well on the responsive version of your site
Step 7. Add images, videos, and other multimedia
The wireframe for your website is ready, now it's time to fill it up with some visual content.
How to choose the best images for your website?
Once again, you should come back to the website type, purpose, and audience of your website - aka step 1 of this guide. What message the images are supposed to convey? Are they the main focus? Should they illustrate something? Are they product images? Depending on the answers, you will need different images, with different attributes. Let's break it down.
-
E-commerce website
-
Use high-quality product images showcasing different angles and details
-
Include lifestyle images depicting the product being used in real-life situations
-
Incorporate images that highlight product features or variations
-
-
Blogging website
-
Use relevant images that complement the written content
-
Include visually appealing images that capture attention and enhance the storytelling
-
Incorporate infographics, diagrams, or illustrations to support the blog topics
-
-
Portfolio website
-
Showcase high-resolution images of your work or projects
-
Include before-and-after images to demonstrate the transformation or improvement
-
Use images that reflect your unique style, creativity, or expertise
-
-
Small business website
-
Include professional images that represent your brand and industry
-
Use images that reflect the emotions or desired outcomes associated with your products or services
-
Showcase images of your team members to humanize your business and build a connection with visitors
-
-
Corporate website
-
Include images that represent your company's brand, values, and culture
-
Showcase professional images of your team members, office space, or company events
-
Incorporate images that highlight your products, services, or successful projects
-
-
Educational website
-
Include informative and illustrative images that support the educational content
-
Use diagrams, charts, or visuals to explain complex concepts or processes
-
Incorporate images that engage learners and make the content more visually appealing
-
Tip number 6
Make sure that all your images are high-quality and have optimized file sizes. You can compress the images without compromising quality to reduce file sizes and improve website performance
Where to find media for your website?
Let's face it unless you're creating a photography portfolio or constructing an "About Me" page, you will most likely use stock photos on your website. Where to find them? Here's the list of my favorite sources of free images.
-
Unsplash (btw, their library is in-build into WebWave so you can browse and use their images without leaving the editor)
-
Pexels
-
Pixabay
-
Freepik
-
Flickr
Tip number 7
When you're about to use stock images, don't forget copyright and usage rights, and ensure that the images are licensed under Creative Commons
Step 8. Spice up your website with animations and interactions
Animations and interaction make your website more engaging for visitors but they can also throw them off if you decide to go too far. Keep it subtle, especially at the beginning of your web design journey.
You can go no wrong with animation on the show of text elements as well as some effects for your images like Parallax or Ken Burns effect.
Just remember not to overdo it. And keep in mind the business idea behind the website. You can be a bit extra when you're building a creative portfolio, but tone it done on a serious business site that deals with delicate matters.
Step 9. Create content for your website
You've got the images, you've got some special effects. Your website is almost done. Now it's time for some words.
Writing a copy for your website is a challenge. It has to contain important information but also serves marketing purposes. Websites goals and audience are going to you your light while you will walk through the turmoil of copywriting.
The first thing that you need to know is that the copy on your website has a structure. You use headings, introductions, subheadings, paragraphs, and CTAs.
-
Headings - they are descriptive and break up the content into sections, they help users scan the page quickly and understand the hierarchy of information
-
Introduction - under the headline you will place a compelling introduction that grabs the reader's attention and provides an overview of what the page or section is about
-
Subheadings - use them to further divide the content into relevant subsections, subheadings once again, help users with navigation and content scanning
-
Paragraphs - this is where you put more detailed information, use bulleted lists to present information in a scannable format, especially for features, benefits, or key points
-
CTA - make them persuasive and clear strategically throughout the copy
The art of headings
Headings are the most important part of your website. That's the first thing (and often the only thing) the visitor will read on your page. Here are some tips (with examples) to write them more effectively.
1. Be clear and specific
Clearly communicate the main idea or purpose of the content in the heading. Avoid vague or generic headings that don't provide enough information.
Good example: "10 Tips for Writing Engaging Headlines That Grab Attention"
Bad example: "Stuff You Should Know"
2. Use action words
Incorporate action verbs or power words that evoke interest and encourage the reader to take action or explore further.
Good example: "Master the Art of Persuasive Writing: Boost Your Conversions Today!"
Bad example: "Read This Article"
3. Keep it concise
Keep the heading concise and to the point. Ideally, it should be no more than a few words or a short phrase. Long headings can be overwhelming and difficult to grasp quickly.
Good example: "Build a Strong Personal Brand in 5 Steps"
Bad example: "In This Lengthy Guide, You Will Find All the Information You Need to Know"
4. Make it compelling
Use language that sparks curiosity or addresses a problem the reader may have. Offer a benefit or promise a solution to capture attention.
Good example: "Unleash Your Inner Chef: Discover Delicious Recipes for Culinary Excellence"
Bad example: "Some Cooking Ideas"
5. Consider keywords
Incorporate relevant keywords in your heading to improve search engine optimization (SEO) and help users find your content (more about it later)
Good example: "The Ultimate Guide to SEO: Boost Your Website's Rankings and Traffic"
Bad example: "Website SEO Tips for Increased Visibility and Organic Traffic"
Once you find your personal style, you might break the rules and write a headline "Stuff you should know". I'm not gonna lie, I think it might even work on some websites. My point is, that there are a lot of factors that you have to consider when you make your site by yourself. Rules like that help you stay on the right track.
Step 10. Make sure that your website is responsive
Once you put all your content on your website, make sure that it looks good on mobile viewports. Spend some time and adjust fonts, image sizes, and positioning. Your mobile version of a website might look a bit different than the desktop one, and that's okay. As long as the content is the same, and changes make it actually more functional, you're good.
A great tip about responsive web design is that you should check out your website on the actual device.
Tip number 8
WebWave website builder allows you to build and publish your site for free under a subdomain. You can do that and easily visit your website on your phone for a complete understanding of your future guest experience.
Step 11. Launch and test your website
Once you're done with all the final touch-ups, you're ready to launch your website. Website builders usually operate on Premium Plans. Connect the one you chose with your site and hit publish.
Your website is now live and available to the world to see under your own domain that you picked and registered at the beginning.
It's time to once again check out everything on different devices and with various browsers. Don't be afraid to ask your friends and family to check out your site. It will be easier for them to have an unbiased and fresh look at the outcome and notice something that you've missed.
Join over 514 000 WebWave users and create websites with a true drag and drop website builder.
Step 12. Promote your website
Congratulations on publishing a website!
Unfortunately, your work is not done yet.
You must promote your website for it to make sense and help you achieve any of your business goals. Without those few extra steps, no one will be able to find your website unless you send them a direct link. Let's see what you can do to help your website thrive.
SEO and content marketing
Content marketing is a strategic approach to creating and distributing valuable, relevant, and consistent content to attract and engage a target audience. SEO stands for Search Engine Optimization and is a process of optimizing your website and content to rank higher in search engine results and attract organic traffic.
Your website will not be number one on Google just like that. You have to put some effort to climb there.
There are people whose full-time job is about SEO and content marketing. It's a legitimate business industry. But even if you're not one of them and don't have their knowledge, it doesn't mean you can't incorporate some of their techniques into your marketing actions.
I have for you a list of SEO and content marketing best practices. Use them to promote your website to see the real difference in your website traffic.
1. Conduct keyword research
Identify relevant keywords and phrases that your target audience is searching for. Use keyword research tools to determine search volume, competition, and relevance.
2. Optimize on-page elements
Ensure your web pages have optimized title tags, meta descriptions, headers, and URLs that include target keywords. Use descriptive and concise language to improve search engine visibility.
3. Create high-quality and relevant content
Produce well-written, informative, and engaging content that aligns with user search intent. Focus on providing value and solving your audience's problems.
4. Build high-quality backlinks
Earn backlinks from reputable and relevant websites. Seek opportunities for guest posting, influencer collaborations, and industry partnerships to increase your website's authority.
5. Optimize website speed and performance
Ensure your website loads quickly and is mobile-friendly.
Social media marketing
At the beginning of this article, I reminded you that websites are essential for your business but social media are also a must-have. Integrate time into your marketing strategy. Create social media profiles for your business. It's a great place to engage with your audience but also to promote the content you put out on your website/blog.
Are you familiar with the term content recycling?
Let's say that you wrote an article about "How to knit a sweater. Easy step-by-step guide". Split it into parts and recycle it as your Instagram or Facebook posts. The article's introduction you wrote about the history of knitting - post it on Monday. Then you explained how to pick the best wool - it's the topic of your Tuesday post. On Wednesday you can make a reel showing a step-by-step guide.
Every post is linked to the blog article on your website.
Tip number 9
Content recycling drives traffic, builds brand awareness and you get lots of high-quality content without having to spend too much time thinking about it.
Email marketing
From time to time people try to announce email marketing is dead. The truth is, it's better than ever. Think about running a newsletter where you can link new articles that you publish on your blog. The email list that you create that way, you can also use to inform about promotions, news in your business offer, and other stuff that you think is worth sharing.
PPC advertising
PPC (Pay Per Click) advertising is an online advertising model in which you pay a fee each time your ads are clicked. The ads are displayed on search engine results pages or on various websites and platforms that are visited by your desired clients. This way, you can drive targeted traffic to your website.
You can use Google Ads or Bing Ads to manage and optimize your PPC campaign.
Step 13. Maintaining and improving your website
Your website is a constantly alive element that requires regular check-ups. Especially, if you want it to convert and help your business grow.
The obvious things that you need to revise are hosting services, domain name, and other maintenance issues. If you pick the right website builder, you will be able to take care of it with just one click by extending the Premium Plan for your website.
But besides the obvious, I have a few more pieces of advice for you on what you should pay attention to.
Update your content regularly
To keep your website fresh and engaging, regular content updates are crucial. If you consistently provide new and relevant information, you can attract and retain visitors, enhance search engine rankings, and establish yourself as an authoritative source in your industry.
Don't be afraid to add user-generated content on your website as you collect it. It could be reviews, testimonials, photographs showing them using your products, etc. Such content serves as top-tier social proof that can skyrocket your sales.
Tip number 10
Make sure that all the information on your website, especially the ones regarding your business offer is up to date. If you changed your office hours, let people know about it on your page
Monitor the siteâs analytics and performance
Thanks to tracking the performance of your website through analytics you can understand how effective it is and where is still some room for improvement. Analytics data provides you with one-of-a-kind insight about not only your website but also your business performance. It can help you make better decisions in the future.
Befriend Google Analytics and track your website performance.
Key metrics you should pay attention to are:
-
page load time
-
bounce rate
-
conversion rate
-
average time on page
-
search engine rankings
Improve SEO, design, and functionality
Once you know how your page performs, you can optimize your content and improve SEO for even better results.
When your website is live, you might get feedback from users about some functionalities and design choices. Evaluate them and don't be afraid to use them as source material for improvements. If your clients say some information is hard to find, make adjustments.
Tip number 11
A great, yet very simple way to improve your SEO is to add a frequently asked questions (FAQ) section to your page or article. It enhances user experience and makes your site more valuable in the eyes of Google robots
How to make money out of your website?
Sometimes, when your website performs well, it opens out of you new possibilities for making a profit from it.
If that sounds like your cup of it, I have a list of ideas on how you can make money out of your site.
Monetize through display advertising
Join an advertising network like Google AdSense to display ads on your website and earn revenue based on clicks or impressions.
Participate in affiliate marketing
Promote products or services relevant to your website's audience and earn a commission for each referral or sale made through your affiliate links. You can even become a WebWave affiliate and get a 30% lifetime commission.
Offer sponsored content
Collaborate with brands or businesses to publish sponsored articles, reviews, or endorsements on your website in exchange for a fee. But remember to collaborate with bands that are related to your field. Placing random links and content will negatively affect your website.
Offer sponsored advertising space
Allocate specific areas on your website for advertisers to display their banners or promotional messages in exchange for a fee. But once again, remember to keep the right balance. Nobody likes a website overpowered with ads.
How to make a website - recap
Congrats, you made it to the final section of this article. I hope you found it useful and that I manage to address at least some of the questions and concerns you had in your head when you opened it.
To ensure that some of this knowledge, tips, tricks, and advice will stay with you, I prepared a quick summary.
-
Define clearly the purpose and audience of your website and come back to those findings when in doubt. Design your website with them in mind.
-
Do your research regarding:
-
what tools you're going to use,
-
your competition,
-
websites - look for patterns and elements you like and dislike.
-
-
Plan your website step-by-step. Start with an outline, then decide on the layout, color scheme, and typography. Adding the content is the final step.
-
Make it simple. Don't jump into advanced solutions that might outgrow your skills. You will have space for this in your future designs.
-
Spend some time on your headlines and refine them. Also, don't overlook SEO.
-
Your website is live but you're not done with it. Revisit, monitor, and improve. Show some respect for your hard work through this.
Now you're ready to start creating. I hope the results will make you proud of yourself.
Good luck!
Join over 514 000 WebWave users and create websites with a true drag and drop website builder.
Are you making your first steps in web design?
Read the following articles:
WebWave website builder is your AI-powered solution for building an online presence. Create your website in 3 minutes, add an online store or a blog, and grow your business.
We created this website with WebWave.
Follow us on social media