Build a Pro Website

In this section we will go over in more detail how to build a professional website that will wow your potential customers and visitors in general. We will go over the planning that it takes to prepare for the building of your site and places you can go to get quality elements for your site, and tips for how to structure your site to keep your visitors engaged and on your site. We will also go over our favorite platform that you can use to build a site. Of course, you can always pay someone on Fiverr to build a site but learning this skill will be invaluable when you start building more brands and editing existing sites you may already have.

The first step to building a website that will save you a ton of time is to draw out a design for your site on a piece of paper. If this website is for a business, you should look at some websites that are large competitors to your brand and take some ideas from those sites in order to get a good picture of what your site will look like. Look at what information and buttons are at the top of your competitors’ sites and the overall designs that seem to be consistent with your industry. Once you have a good idea of what your site will look like, draw out these sections on your piece of paper and draw some ideas for elements you will add to these sections to make it unique to your brand.

Now that you have a picture of what your site will look like it is time to focus on creating the unique elements that you will add to decorate your site. One of the main elements that you will add throughout your site will be your brand’s logo. If you do not already have a logo for your site, you can pay someone on Fiverr to work with you on this as well as any other decorations you have come up with or you can use an AI art generator. Logoai.com will generate a logo for you for free in seconds or you can use more advanced ai generators like Mid Journey or even use ChatGPT that can give you even more detailed results. The only downside to these options is that it can be difficult to exclude odd looking text from your logo, but if you play around with it enough you can create a breathtaking logo that truly represents your brand. Once you have your logo built with AI you can use photoshop or photopea.com (a free alternative) to remove the background of your logo image so that you can add it to your site with a transparent background. You can also do the same thing with any decorative elements that you want to create for your site and using AI for this can take even less time than going back and forth with an artist.

Now that you have some decorative elements and your logo created, it is time to go over some basic tips for keeping your site visitors engaged on your website. The first thing you want to make sure of is that the first page your visitors will see on your site clearly shows your branding in the middle of the page and shows what problem you solve for your customers. If you are building a site for pool services for example, you should have a nice picture of a beautiful pool in the background with your transparent logo placed in the middle, somewhere that does not take away from the beauty of the background. Beneath your branding it should say something like, “Building and Maintaining Pools in the ____ area with a smile”. This shows what problem the business solves right away and adds a bit of personality to the brand as well. Beneath this line of text, you would also want to add a button that will allow the potential customer to buy your product or service. For this example, the button should say “book a free estimate”. There they can fill out their information so that you can call the customer and set up a time to go out to the property. If your brand is selling a product, you can have that button take them to a checkout page where they can buy that product right away.

Once you know what your homepage will look like, it is time to focus on keeping your visitors’ attention as they scroll through the rest of your site and adding multiple action buttons throughout it that will lead to you gaining a customer for your business. I recommend adding a high-quality video of yourself talking about your brand’s services and values or of an employee doing work and talking about what makes the company different than others in a concise manner. Videos grab attention better than any other form of media, so it is good to have a video just below your homepage that will grab the attention of your visitors. Below this video you will typically add a list of your products and services with a short description of each if necessary. At the bottom of that section, you can add another call-to-action button that will still allow them to become a customer without scrolling all the way back to the top. At the bottom of your page, you can have a form to contact your company as another form of call to action as well as a list with your place business if necessary and any phone numbers, contact info, and social media links that are relevant. Make sure to always think about how each section on your site will help lead your visitor to becoming a customer and have multiple call to action buttons and you will have the basics of design down to a science. Think of your site how you would think about creating an ad, make sure there is little fluff and that it is easy for your customers to follow.

At this point you are all ready to begin making your site. The best platform that I recommend using especially when you are new to web design, is Wix.com. I always recommend Wix because it will let you begin designing a site before even entering any payment information and you don’t have to pay anything until you add your own custom domain and begin hosting it on their platform. The fist thing you want to do once you have entered the site editor on Wix is upload all the elements you have gathered for your site to the media panel. Make sure that all the elements are on your computer so that you can do this easily. Having most of your site’s elements already uploaded will make creating your site much less stressful. Now we will begin editing the site from top to bottom, or from homepage to your last page.

The first thing you should check to see on Wix, is if they have any free templates that already fit the layout that you have drawn up. You can search for your industry in their templates, and you should be able to find a template that will make a good starting point for your site. If there are not any templates that fit your design well, do not force it. I have found myself starting from scratch plenty of times and since you already have a drawing of what you want it will be much easier to start on. However, if it is the first time you have built a site and have very little knowledge on it I would recommend using a template just so you can see how the different elements and sections work. Either way start by organizing the header on your site which is the top bar with the navigation links. If you are using a template delete any links in your header that are unnecessary and add the transparent PNG of your logo in the left corner as well as the different sections or pages on your site that should be easy to access starting with Home. Some examples for these buttons would be, Home, Services, Who We Are, Contact Us. You can choose to make this header sticky, meaning it will stay at the top of the page as they scroll, or you can allow it to disappear as they scroll past. If you choose to make it sticky be sure to set a solid background to it rather than a transparent one, so it does not overlap with other elements on your page.

Once you have taken care of your header, you will need to create the homepage of your site. Simply add a section below your header by clicking the plus button and dragging a section over to your site and then adjust the size of it from the bottom so that it will cover your users screen when they visit the site. Then you can click on quick design and add the background you have saved already, or you can create a gradient background from right within Wix itself. Then you will add a text title element by clicking on the plus icon again and drag that onto your site as well. Here you can add your company name to the middle of your home section. Drag and drop the image of your logo above this text and drag and drop your call-to-action button below it. With the button elements it is always good to add a shadow and change around the colors to match your brand by clicking the style or design button.

Congratulations, you have already learned the basics of building a site on Wix and have created a beautiful homepage for your site. Below your home section you can add that video that you created if you did. However, I recommend uploading the video to a YouTube account and embedding it on your site so that it will load faster, which is important for ranking on Google and for overall visitor experience. You should create a new section for this and give it a title that you can link to, which you should do with all new sections even if you are unsure if you will link to it. It will keep you organized later. Then you can add a new section below your video and drag it down to make it bigger to add your list of services. You can simply click the plus again and choose list and pick a style that fits your site. Each list item that you add should have a picture beside it to keep your visitors engaged. You can use an AI generated picture like we talked about or a stock image from pexels.com or pixabay.com for free. If you are using a stock image, be sure to add a border to the picture with the style option so that it looks professional on your page. As for the contact form at the bottom you can also add a premade contact form from the plus button as well and edit the form so that it makes sense for your business.

Now that you have the majority of your site laid out, all we have to do is set up your payment or contact page and add a footer to your site. If you are going to be accepting payments, you will have to leave the site editor and go back to your Wix dashboard. Once you are there you can type, “accept payments into the search bar and click on the button when it pops up. From there you can check off the payment methods that you will want to offer. I recommend accepting credit cards and PayPal at the very least, but you can choose whatever works for your business. After you have done this, you will click complete setup and add your bank account and PayPal account in order to receive payment for your business. You can create a new page that will link to your call-to-action buttons and add a simple Wix form to that page along with any pricing and product or service information the customer will need to know. Once you have added the form you can highlight it and click form settings and then click the payment button to add a payment form. You can choose multiple step forms to gather different information like shipping or if you don’t need to gather multiple steps of information you can keep it as a single form. You can also choose to add multiple items for them to purchase or just a single item depending on your business. From there you will simply add the name of the item or service and the price. If you are simply adding a contact form because you have a service business that needs quoting, then you can keep it as a simple form and link your company email which we will go over later.

For your footer, you will simply be repeating the steps we went over with the header, but you can also add your social media links by clicking quick edit on your footer and adding a social bar. You can also add any trademark information for your brand and once you connect a domain and pay for hosting you can remove the Wix logo from the bottom of your header as well.

The last step to creating your site is to add a domain, begin hosting and setup an email for your domain. You can go on godaddy.com to buy your domain and then connect it to your site, but I recommend buying it through Wix because it will allow you to add the domain right away. Simply click connect a domain at the top of your editor and choose get a new domain. From there you can type in your brand name and find a site ending like .com that works for you. I always prefer .com but today it does not really matter as much just make sure it is something that makes sense for your industry and will be easy for people to remember. Most people will find your site through a link rather than typing it in though anyway usually so it is not the end of the world if you cannot secure a .com domain. From there you will be walked through pricing on hosting your site as well. Starting out you should choose one of the smaller plans until you scale your business and start bringing more traffic to the site. A large plan is not needed unless you plan on adding a large amount of data to your site or are planning to have a crazy amount of traffic right away. Once you have gone through this process and added payment, you can also add an email for your domain from your dashboard. For your first email I suggest using something broad like info@doamin, support@domain or yourname@domain if it makes sense for your business. You can then attach this email to your Gmail app to stay up to date with any filled out forms or customer emails.

Once you have finished your site, you will need to also optimize it for mobile browsers. Keep in mind that over 70% of web traffic today is done on a mobile device. Because of this, your mobile site is much more important than your desktop site. Click on the phone icon at the top of the editor and make sure that you resize your sections and elements so that they fit well for mobile devices. You can also click on an element or section and click on the eyeball icon to hide it on the mobile version if it does not work well for phones. Sometimes I will hide an element that does not work and rebuild it on the mobile editor with a different design that does. Spend as much time as you need to make your mobile site just as appealing as your desktop version. I know that at this point you are probably tired of dragging and dropping elements and resizing things, but this is the most important part. After you have finished optimizing your site for mobile devices you can simply click publish then to the domain you have purchased, and your site will be up and running!