Step-by-Step Guide: How to Design a Website in 2020
As technology advances, it enables us to achieve more and more tasks without even realizing how complex they are. Look at how easy it has become to access any video on your phone (your three-year old nephew already does it, with one hand) or to find love with the swipe of a thumb. Creating a website by yourself is one of these wonders that has become a reality. Thanks to the evolution of website builders, everyone can design a website and craft an impressive online presence for themselves. Even better: The myriad of professional features available (an online store, booking capabilities, etc.) makes it possible to generate revenue, nurture a community of fans, and promote your brand online. In other words, a website is no longer a beautiful shop window - it’s the very center of your business life in the online world. To get started, you’ll need some basic knowledge to put you on the right track. From choosing your website builder to claiming your domain and getting found on Google, this full guide will walk you through how to design a website in 2020:
How to design a website
Set your goal
Choose your website builder
Define your layout
Claim your domain name
Gather your content
Add the right pages
Put usability first
Do your SEO
Pick the professional tools you need
Make it accessible to everyone
Engage with your visitors
Optimize for mobile
Ask for feedback
Publish - and get back to it
01. Set your goal
Before starting, you need to be crystal-clear about what you want to achieve. With so many website ideas out there, yours can take on many different forms, including:
An online store to sell your products
A portfolio to showcase your art
A landing page to promote a marketing campaign
A resume website to grab the attention of potential employers
A blog to share your knowledge
An event website for weddings, parties and company events
Whatever it is, your website should meet one main goal. All elements of your site should serve that overarching purpose. For example, if your site’s purpose is to sell your photos online, you can utilize different techniques to support your effort, such as displaying your work, writing blog articles to share your expertise and more. Keep in mind that your visitors - as well as Google’s bots - want to understand what your business is all about in the blink of an eye. Having multiple main objectives is likely to result in confusion, which can in turn increase the chances of your visitors leaving your page prematurely.
02. Choose your website builder
Now that you’ve identified your goal, it’s time to pick the right tool to reach it. A website builder (also called a content management system or CMS) is a platform on which you can create, personalize and publish a website. There are dozens of platforms available on the market, but not all website builders are born equal. Not sure which one to use? Wix.com was ranked #1 out of the best website builders in the world, and for good reason. Here are a few of Wix’s advantages: The price: Creating, publishing and hosting your website is totally free, for as long as you wish. If you want to upgrade your online presence with some tailored features, Premium packages are also available. They include everything you need to succeed online, from an all-in-one eCommerce solution to a custom domain name. Your style, your result: Whether you’re a seasoned website designer or are still wondering how to design a website, you’ll find that Wix offers different creative routes adapted to everyone. For example, beginners can enjoy Wix ADI (Artificial Design Intelligence), the first artificial intelligence platform that creates websites for you. At the same time, experienced creators can look into Velo by Wix, which lets you dive into your site’s engine to build sophisticated apps, APIs and databases. This way, you’re sure to have a result that suits your brand perfectly, and looks like no other website in the world. Built by professionals, for professionals: Because your website is the hub of your online life, Wix puts all of the professional solutions you need in one place: newsletters, invoices, user databases, and more. These are all accessible from one interface, with only one password to remember. On top of this, we make sure your website is on par with the highest standards of the industry. Not only will you have the tools to create a website that looks professional, you’ll also be able to optimize your site with the Wix SEO Wiz to up your chances of getting found on Google. And as Wix provides every one of its users with an SSL certificate, you’ll be able to ensure maximum security for your site. No knowledge barrier: Being the most complete platform on the market doesn’t make it the hardest to use. On the contrary. Wix is a drag-and-drop website builder, which means that you can place any content you want, anywhere you want it. From your images to your text, you can change everything in seconds, without needing the help of a third party. Expert tip: Have a burning question? Need assistance? Don’t worry - you’re not alone. From the 24/7 support team to our social media pages, there’s always someone to talk to. You’ll also find plenty of helpful material available online. Start with these basic Wix tutorials, and keep on exploring the Wix Blog (sincerely yours) and Help Center, to grow your knowledge in web design, online marketing, SEO and more. Ready to create your website? Here’s how to get started:
Go to Wix.com from your desktop or mobile.
Enter your email address, pick a password - and voilà! You now have your account, from which you can create as many websites as you wish.
Explore the vast collection of website templates, pick the one that’s most relevant for your needs, and start customizing it with the tools and features of your choice. If you’d rather build your website from scratch, you can start with a blank canvas and take it from there.
03. Define your layout
Fact: It takes only 50 milliseconds for visitors to form an opinion about a website. This is why the visual structure of your pages - or in other words, your website layout - is so crucial to get right. To set off on the right foot, you can pick a template on which to base your layout. Templates are websites with pre-designed layouts, created by professional designers. To make a template your own, you can fully customize all its elements. Remove, add or change details like text, images and color. Wix offers an extensive library of free website templates. You’ll find designs for every kind of business, whether you’re looking to create a blog or make a personal website. Each template comes complete with the necessary tools, such as an online booking widget if you’re an instructor, or a Google Map widget if you have a brick-and-mortar store. You can pick between a multi-page template and a single-page one. If your website includes a hefty amount of content, you’ll probably opt for a multi-page site. In this case, you’ll include a classic website menu from which your visitors can navigate your site. However, if you have less textual content to display, you may want to go for a one-page website. This trendy option is a popular choice for landing pages, event websites and other short-form content sites. Expert tip: Ready to get your creative juices flowing? A good start is to look at other websites that have got it right. So grab a pen and paper, and jot down ideas as you browse through successful website examples and some of the best website designs. There are plenty of social media platforms dedicated to design inspiration, such as Pinterest and Dribbble, so make sure to check those out too.
04. Claim your domain name
To put it in simple terms, your domain name is your address on the internet. It’s what your visitors will see in the bar of their browser, right after the “www.” Registering your domain name is critical for your online success. Websites with a customized domain are automatically perceived by internet users as more professional and trustworthy. When chosen wisely, a domain name also helps search engines (like Google and Bing) to understand what your website is about. In turn, this could positively impact your SEO. Last but not least, having your own domain name is the first step in acquiring your custom email address. Now, how do you choose a domain name for your brand? To make it memorable, it has to be:
Short: The longer it is, the higher the chances of visitors misspelling it.
Simple: Avoid symbols, special characters and numbers.
Professional: Your domain name should incorporate your business name, to avoid confusion.
Evocative: Include a hint of what you do into your domain name, by looking for words that are related to your business.
Want to find out if your dream domain name is available? Get the info in a second with this domain name registration tool. If your top choice is still up for grabs, don’t hesitate to acquire your piece of property on the internet. If it’s not, don’t panic. Try out different variations of your original choice. You can play around with the word order, add a word like “the” at the start, or change the domain extension. From .org to .com and .net, you can choose from 45 top-level domain extensions. Pick one that suits your business type and geographic location.
05. Gather your content
Now it’s time to get practical and prepare the materials that will be featured on your site. This includes your images, slogans, videos, texts and more. Use your own original materials as much as you can to ensure you’re offering valuable and branded content. Whenever you’re not creating unique content, make sure to acquire your resources through legal ways. Wix comes with a wide selection of media features, including a library of over one million free photos from our partners at Unsplash and interactive videos that are exclusive to Wix. There’s also endless stock photo and image reservoirs you can check out. While plenty of content is great, remember to always put quality over quantity. People read 25% slower on a screen, and are therefore less patient. In an era of decreasing attention spans, the best way to catch your visitors’ attention is to only showcase your best content. Moderation is also important because the more content you put on your site, the longer it will take to load. And if your visitors wait too long, they will leave your page without taking any action (this is called “bouncing” in web design lingo) - and go to a competitor. So make sure to spread your content across your different pages, and follow these techniques for website speed optimization. Finally, make sure your content is fully branded. Think of your website as your online persona. It should represent who you are, from your brand colors to your fonts and your logo. Speaking of which, if you don’t already have a logo, now is the time. Create your own logo with the help of these logo design tips. Once you’re ready, place it in your website’s menu and link it to your homepage, enabling visitors to easily navigate your site. Expert tip: New to the marketing game, or feel like you could sharpen up your brand language? From texts to visuals, this guide explains everything you need to know about building your own brand, and gives you the first steps to a solid brand identity.
06. Add the right pages
Every business is unique, and so is every website. Nevertheless, there are some traditional sections that your site visitors will expect to see. Here are the must-have pages any website needs:
The homepage: You only have one chance to make a good first impression. As it’s likely to be the first thing visitors will see, your homepage design needs to be clean, organized and eye-catching. It should clarify who you are and what you do. Make sure it contains the most crucial information: your logo, the name of your business, your slogan (if you have one), and a button inviting visitors to browse further. Include all of this info above the fold (the section of your site that is visible to visitors without having to scroll down), as it’s the part of your page that will be seen first. Your product or service page: Your product page is where your visitors discover what you have to offer, and if they’re convinced, there’s a chance they’ll take out their credit card and make a purchase. The core recommendations for this category: Add high quality product photography, write precise and engaging service or product descriptions, and be transparent about your conditions (such as shipping and return policy).
The ‘About Us’ page: Tell your story, and share your values, methods and any other piece of info that helps depict your brand. Favor the first person (“I” or “We”), as it makes things more personal, and add a touch of humor if it suits your purpose. Also, don’t forget to add a picture of yourself or your team members, since clients always like to see the face behind the business relationship. The contact section: Make sure to include your phone number, postal address, business email address and social media accounts. Visitors should be able to get hold of you easily. You can also consider adding a live chat widget that gives visitors the chance to reach out and get an immediate response.
Extras (but highly recommended): A blog: Creating a blog boosts your reputation as an expert, helps you foster a loyal community, and is an effective way of driving traffic to your website. There are also strategies you can implement to monetize your blog. Even if you’re not a natural-born writer, don’t fret - you have much more to say than you think. You can talk about your clients (success stories, case studies, interviews) or yourself (events you attend, new employees, and more). But the most valuable blog ideas will come from you sharing your expertise. Your readers will love to discover the tips, methods and hacks you use to solve the problems you meet. Check out these blog examples for more inspiration. Testimonials: 69% of consumers would recommend a company to others after a good customer experience. Leverage the power of word-of-mouth and let your clients do the selling for you with honest website testimonials.
07. Put usability first
A beautiful website is great, but far from enough. If you want your visitors to spend time on your pages, enjoy your content and, eventually, engage with it, you need to facilitate their navigation. This is what user experience (UX) is all about, and here are some fundamental notions: Architecture: Just like the rooms of a house, your pages need to be properly connected to one another to ease your website navigation. For this to happen, make sure to implement internal links between your pages. Ultimately, follow the “two-click rule:” Your visitors shouldn’t have to click more than once to access any page of your site, wherever they are. Colors: As we can see in color psychology, color has a huge impact on the human psyche, which is what makes it such an important marketing tool. A general rule is to limit yourself to three shades - one primary color (60% of the mix), one secondary color (30%), and one accent color (10%). To craft the perfect color combination, consult with some of these free color palette generators, or look into successful website color schemes for inspiration. CTAs: Calls-to-action are the messages that tell your visitors which action to take. The web is filled with call-to-action examples, such as “Register now,” “Don’t miss out” or “Get yours today.” CTAs can be in the form of a button, or as linked text. They should be short, have a verb in the imperative form, and preferably include an element of urgency. Learn more in this complete guide to writing effective CTAs. Fonts: What’s the point of having quality content if no one can read it? When choosing the best fonts for your website, pick ones that are legible (both on desktop and mobile), consistent with your brand identity, and that go well with one another. While the world of typography is vast, this selection of free fonts will put you in the right direction. The golden rule: Opt for a maximum of three fonts in order to avoid visual chaos. If you’re not sure how to mix-and-match, here are some of the best font pairings you could go for. Footer: This is the bottom part of your site (the top is known as the header). Website footers are not immediately visible to your visitors, but they can be used in a number of ways to enhance usability. For example, they’re a great place for you to add all of your contact information, display a simplified menu that links to the categories of your site, or display your site disclaimer text. This practice can drastically improve your website’s user experience. Menu: This central element of any professional website ensures that visitors can easily navigate from one category to another. For this reason, it should appear on every single page of your website. Whichever type of website menu you choose, it’s highly recommended to go for a fixed menu (that stays put when visitors scroll down the page), so that they don’t have to go all the way up to find it. For your mobile menu, keep the number of categories to a minimum, to avoid overloading the small screen. Motion: This refers to all of the non-static elements of your website. Motion can come in many shapes, sizes and locations. It can be anything from a hover effect, to a full video background that you can create using Wix Video Maker. Animations are great, as they catch the eyes of visitors. But like any good thing, use them in moderation. Curious to learn more? This guide explains all the dos and don’ts of animation on websites. Scroll effects: As the name suggests, they appear when the visitors scroll up or down your site. Their sophistication draws attention and creates a smooth transition between the different layers of a page. You’ve probably heard of parallax scrolling. This professional 3D effect continues to be an essential web design trend year after year. But there are more scroll effects (such as reveal or zoom-in), all of which are already embedded in your Wix Editor. Whitespace: This is the area of your website that doesn’t include anything. Frightened by all this void space? Don’t be. White spaces give your visitors room to “breathe” between images or pieces of content, contributing to a much better user experience. Expert tip: What does Leonardo da Vinci have to say about online creation? Actually, a lot. The same rules that governed art and design for centuries are also applicable to the internet. From balance to symmetry, discover how the 7 fundamental principles of design can be applied to websites.
08. Do your SEO
Many factors are involved in getting your website found on Google. In fact, there are over 200 signals that make up algorithms for ranking websites, such as the quality of your content, the competitiveness of your industry, the number of backlinks you have, and so on. SEO (search engine optimization) is a science in its own right. It requires time, patience and persistence in order to get your first results. Yet, there are many steps you can - and should - already take while creating your pages. Work according to the following SEO tips, in order to give the content you publish the best chance to be found and properly ranked: Keywords: Conduct keyword research to find the keywords that are relevant for your site. Start by asking yourself what kind of questions a potential visitor might search for in Google in order to find a website like yours. Once you have them, pick one main keyword, and a couple of secondary ones - but no more than that. Place your keywords in strategic locations across your site (SEO title and description, homepage, etc.), but don’t overdo it. Search engines penalize websites that “stuff” keywords unnaturally into their content. On-page SEO: On-page SEO is about telling search engines what your pages are all about. For each page, your website builder will ask you to fill in the meta-data. This includes the URL, the SEO title (the blue link you see on Google’s list of results) and the description. Even though your visitors may not notice these elements, don’t overlook them as they’re critical when it comes to ranking. Hierarchy: Google bots seem to like well-structured pages. Give some hierarchy to your text by putting the important content first, and utilizing different levels of headers combined with and concise paragraphs. On top of improving your SEO, it will also please your visitors, who are more and more inclined to skim read websites. Local SEO: If your business has a physical location, you want your website to appear in the top results of people in your geographic area. For a chance to be found on Google Maps, register to Google My Business. Also, make sure that your contact info is consistent across all your online channels. This guide to local SEO will help you market to local customers and increase your foot traffic. Alt text: Google may have a lot of knowledge, but it can’t “see” photos or GIFs (yet!). However, visual content still appears in Google results pages. This is because bots read the descriptions that you give to your pictures. These descriptions, commonly known as alt text, are not visible to your visitors, but still give a very strong indication as to what the media is about. Writing SEO friendly alt text for your images is also an important practice in improving your website’s accessibility. Internal linking: The more your pages are inter-connected, the easier it is for bots to navigate through your website. Add links throughout your site to encourage visitors to discover more pages. Expert tip: There’s nothing more satisfying than checking off an item on your to-do list. Wix SEO Wiz is a free and powerful tool that analyzes your web pages and issues a personalized checklist of the SEO elements you need to cover. It’s a must-have.
09. Pick the professional tools you need
The internet is becoming the most important marketplace in the world. It’s estimated that in 2021, over 2.14 billion people worldwide will purchase goods and services online. That’s why your site needs to include all of the tools to facilitate safe and efficient business. Wix encompasses the professional solutions you need to interact with your clients - whatever your size or industry: Bookings: Any service based website needs to be able to receive online reservations and payments, 24/7. Wix Bookings does just that. It includes the most sophisticated options on the market, from the ability to manage your staff’s calendars to convenient marketing automation capabilities. The best part: Your transactions are commission free.
eCommerce: Want to sell your goods online and generate a continuous stream of revenue? An online store is the way to go. From tracking your orders to getting paid easily and expanding your business with dropshipping, you’ll be able to manage everything from one dedicated place. Photography: Whether you want to showcase your work, sell photos online, or attract new clients, creating a photography website is the way to go. For more inspiration and tips on how to grow your photography career and business, check out the Wix Photography Blog. Music: Wix Music is a cutting-edge platform for musicians who want to expand their audience while maintaining total creative freedom. It enables you to sell your music directly on your website and keep 100% of the profits. Simultaneously, it distributes your tunes to over 120 digital stores. Hotel: Your hotel website will let you manage reservations, let guests book in their preferred language, send instant confirmation emails, accept online payments and more. This step-by-step guide will walk you through the stages of creating a hotel website to wow your guests. Restaurant: A restaurant website will allow you to take orders and table reservations online, providing your customers with a convenient and professional solution. Entice your site visitors with a mouth-watering menu design and easily connect it to your Facebook Business and Foursquare pages. For more tips, here’s everything you need to know on how to create a restaurant website. Expert tip: The Wix App Market includes a large selection of apps to boost your website’s business potential. From chat to payment, pop-ups and advertising on Google, there’s a tool for every aspect of your business.
10. Make it accessible to everyone
These days, a truly professional website should be accessible to everyone. Web accessibility ensures that all people, regardless of their abilities, can comfortably experience and interact with your website. This includes people with vision impairment, temporary injuries, hearing loss and more. With over one billion people living with some form of disability, catering to everyone’s needs is crucial. It also shows that you and your business value inclusivity and diversity. There are a number of ways to improve your website’s accessibility. Make sure to build your website hierarchically, using clear headers to define the different levels of information. In addition, ensure that your site is fully operable with a keypad, write alt text for your images, use heading tags and more. There are many more things you can do to make your website accessible - and all of them will also boost your SEO efforts. On top of that, consider whether your customers could benefit from a multilingual website. Is your business based in different countries? Do you have customers from across the globe? Are you looking to expand to new markets? If you answered “yes” to any of these questions, it might be time to build a multilingual website. Offering your visitors content in their own language will help them engage (and buy) more, ultimately improving the customer experience.
11. Engage with your visitors
Websites are more than just static items meant for browsing. These days, visitors expect to engage with you through your site. Adding the right promotional tools will help you convert visitors into customers, and from customers into loyal clients. Here are the features you should consider incorporating into your site: Live chat: This professional tool can do wonders to your sales. In fact, a Wix survey found that users who installed a live chat feature on their website saw an increase of 33% in bookings and 39% in sales after just one month. Adding a live chat widget to your site makes a giant difference in visitors’ ability to interact with you. Whether it’s to provide fast customer support or to help undecided visitors make their way to the cart, this small window at the bottom of your users’ screen is a helpful addition. Social media: Similar to your website, your social media channels are an important aspect of your online presence. To become a successful social media master, you must have a well-planned social media calendar, brilliant social media content ideas, and the right tools to create social media graphics. Read up on social media marketing to craft a powerful strategy for your business. On top of that, connect your website to your social accounts and vice versa. Place a link to your website across your social channels, and also add social icons on your website’s homepage. These should be located somewhere visible, such as under the menu, on the right or left side of your page, or in the footer. Newsletter: Once considered the king of online marketing, email marketing is still a major source of traffic to your website and your business. You can use it to advertise your latest sales, promote your blog articles, or celebrate your company’s achievements with your subscribers. How exactly can you optimize the success of your campaigns? In order to get subscribers to your mailing list, place a lightbox on your site inviting people to subscribe. Simultaneously, start sending your first newsletters. Wix’s email marketing solution lets you do everything - from designing your newsletter with pre-made templates, to sending and checking your stats - straight from your website’s dashboard. Forms: Who doesn’t like to share their opinion? One powerful way to build long-lasting relationships with your customers is to ask for their feedback. Creating an online form for your website makes sure that visitors have a safe place to share their thoughts about your products, services, website or customer support. Plus, this makes for golden material that you can add to your testimonials section. Make sure to limit the number of fields in your form, to include only the most essential information. The more questions you ask, the less likely customers are to fill in your form. Expert tip: Making yourself available across multiple channels is not the only thing you can do to increase your visitors’ interactions. From design to member pages, this guide will let you in all the strategies designers use to increase website user engagement.
12. Optimize for mobile
Smaller screens do not equal smaller impact. With such an increase in smartphone and tablet usage, it’s crucial that you ensure a seamless browsing experience across all devices. What’s more, since Google implemented mobile-first indexing, optimizing the mobile version of your site has become even more important if you want to up your chances of ranking on page one of search results. When creating a site with Wix, a mobile version of your site is automatically generated with the Mobile Editor. This means that you don’t have to worry about building a new structure from scratch. However, it’s still up to you to make sure you’re optimizing your content to fit this smaller piece of real estate. Firstly, on your mobile website, try to keep only the most important elements on the page, removing whatever isn’t absolutely necessary. Secondly, optimize the space above the fold by placing the most vital bits of information there. This is what your visitors will see first, so keep it engaging and informative. Lastly, add the quick action bar. It will let your visitors contact you easily via phone or email, and get shortcut links to different pages of your site. This means less time scrolling, and more time enjoying your content.
13. Ask for feedback
At this point, you may know how to design a website successfully, but there’s still room for growth. Being impartial is especially difficult when it comes to your own creation, which is why this step is crucial. Whether you create a portfolio, blog or any other type of website, it's time to take a step back and ask someone you trust to provide you with honest feedback. Be receptive to their critique, and remember that you may not always like what you hear. To ensure a flawless final result, ask a friend or colleague to check the following elements:
Is the text proofread? Spelling mistakes can ruin the professional reputation that you’ve worked so hard to build.
Are the pages easy to navigate? If it takes more than a click or two to find any strategic page of your site, it means that you may need to rethink your pages’ architecture and the visibility of your menu.
Is the mobile version optimized? Almost 50% of internet users browse websites using a mobile device. You certainly don’t want to leave half of the world’s population frustrated.
Are all the links working? Click on every link to make sure none of them return a 404 page (indicating that the page doesn’t exist anymore). It’s also recommended to make external links open in a new tab, to minimize the risk of visitors leaving your site.
Are all the SEO elements filled out correctly? From alt text to title tags, there are a lot of items to verify. Thankfully, you can rely on Wix’s SEO tools to help you rank higher and grow your search engine visibility.
Expert tip: Worried you may have missed something? You won’t be after reading this essential website launch checklist and this guide on how to make a website. Make sure to go through them before hitting the “Publish” button on your website.
14. Publish - and get back to it
Congratulations! Your website is now live. However, if you think it’s finished and done with, think again. Not only is there always room for improvement, but you also want to make sure that you’re constantly keeping your content fresh. A site that looks like it’s been lying dormant for too long is uninviting and can also seem unreliable. Regularly updating your website shows that you’re present, active, and up-to-date with what’s happening in your industry. Make sure you’re in line with current trends, and are sharing timely content, such as Black Friday promotions or summer smoothie recipes. You can also embed your Instagram feed to your site to make sure that your newest content will show up on your homepage automatically. Lastly, regularly check the growth and performance of your site by utilizing Wix’s marketing integrations and connecting your website to tracking tools. The following platforms will help you see where and how you can improve: Google Analytics: How many visitors came to your page? Where are they from? How long did they read your blog articles for? All of this information (and much more), is made available to you by Google’s famous tool, for free. For more information, this beginner’s guide explains how to use Google Analytics effectively. Google Search Console: If you’re curious to see how your pages are ranking on the leading search engine, this is the right platform to use. Here, you’ll get every detail about your organic traffic, from the keywords you compete for, to your progression through time. Looking for a little guidance? This Google Search Console guide will show you the way. Heatmaps: Using a precise color code, heatmaps show you which parts of your pages visitors are looking at and what they click on. This valuable tool can help you improve your design and content. With Wix, you can connect your website to a number of leading heatmap solutions, including Crazy Egg and Hotjar. Conclusion: Having a website is a necessity in 2020. But having a website that is up-to-date is what really makes the difference. Make sure to stay alert, keep in-the-know, and update your content as often as you can.
By Jonathan Sitbon Blog Expert at Wix
By Dana Meir
Design Expert & Writer