{"id":20950,"date":"2018-12-19T08:57:07","date_gmt":"2018-12-19T13:57:07","guid":{"rendered":"https:\/\/www.hostgator.com\/blog\/?p=20950"},"modified":"2019-03-26T14:05:11","modified_gmt":"2019-03-26T19:05:11","slug":"basics-website-building","status":"publish","type":"post","link":"https:\/\/www.hostgator.com\/blog\/basics-website-building\/","title":{"rendered":"The Basics of Website Building"},"content":{"rendered":"\n

Learning <\/span>how to build a website<\/span><\/a> is easy. Building a good website that gets your visitors attention, offers a solid user experience, <\/span>and<\/span><\/i> puts your business in the best light possible will take a little more work.<\/span><\/p>\n\n\n\n

At the core, a website seems pretty simple. Often, it\u2019s little more than a few pages of text and some pictures that display in your web browser.<\/span><\/p>\n\n\n\n

When you\u2019re building your website it\u2019s important to have some foundational knowledge that will help you build the best site possible. In fact, that\u2019s the very reason we wrote this post.<\/span><\/p>\n\n\n\n

Below you\u2019ll learn core <\/span>web design principles<\/span><\/a> that will make your site shine, a few planning measures that will help you create a site that serves your visitors, and finally the step-by-step process of building web pages in the most beginner-friendly way possible. <\/span><\/p>\n\n\n\n

Let\u2019s jump into the<\/span> basics of building web pages<\/span>!<\/span><\/p>\n\n\n\n

\"start<\/a><\/figure><\/div>\n\n\n\n

Core Web Design Principles to Keep in Mind<\/span><\/h2>\n\n\n\n

Your new website is your canvas. However, there are some basic principles you\u2019ll want to keep in mind as you build a website. . Think of it as coloring inside the lines. You might not get something wholly unique, but by sticking to user expectations you\u2019ll be able to deliver a much better experience that will increase the chances of your site\u2019s success. <\/span><\/p>\n\n\n\n

1. Understand Visual Hierarchy.<\/span><\/h3>\n\n\n\n

Visual hierarchy refers to how people read and engage with text on a website. Typically, people will read left to right, from up to down. But, when we expand this to the internet people read in a very different way.<\/span><\/p>\n\n\n\n

First, instead of reading from top to bottom people usually scan a website to see if the information is relevant to them before they dive in.<\/span><\/p>\n\n\n\n

On websites, people tend to follow an '\u02dcF\u2019 shape. So, on a traditional website, they\u2019ll start at the logo, scan across the navigation, then slowly read down the page. <\/span><\/p>\n\n\n\n

When you\u2019re building your website make sure to keep this structure in mind, so you can place your most important elements where readers will actually see them. <\/span><\/p>\n\n\n\n

2. Choose the Right Fonts.<\/span><\/h3>\n\n\n\n

Adding Google fonts to your WordPress website <\/span><\/a> are a typically overlooked aspect of web design. People usually end up using the stock fonts, or choose way from left-field and end up selecting a font that ruins their site. <\/span><\/p>\n\n\n\n

Today, there\u2019s a wide variety of font choices that are actually supported by your browser. This means that they\u2019ll end up rendering properly. The number of fonts you\u2019ll have to choose from are incredibly massive.<\/span><\/p>\n\n\n\n

But, with that selection, it\u2019s usually better to stay simple with both the font size and design. After all, your font choice can say a lot about your site, and if you don\u2019t have an eye for website design it could actually detract from your overall efforts.<\/span><\/p>\n\n\n\n

Make sure to keep your font size and choice minimal, and only use two or so fonts across your entire site. When it comes to font choice, less is more.<\/span><\/p>\n\n\n\n

3. Know How Images and Colors Work Together.<\/span><\/h3>\n\n\n\n

It can also be tempting to go crazy with your color and image selection. But, there\u2019s one rule to live by here, less is more.<\/span><\/p>\n\n\n\n

A tiny splash of color will draw the eye to it and give your site some creativity, but too much and your website will be distracting to your target audience..<\/span><\/p>\n\n\n\n

In regards to images, the same can be true. A few images that are thoughtfully placed will add some life to your site and help to convey emotion. But, don\u2019t just use images to fill white space. Every image you place across your site should be intentional.<\/span><\/p>\n\n\n\n

The <\/span>Basics of Website Building<\/span>: Principles<\/span><\/h2>\n\n\n\n

Now that you\u2019re better equipped about some website design best practices, let\u2019s start planning your site. By taking the time to think about your audience, and what you want your site to include, you\u2019ll make it that much easier to build and launch your site.<\/span><\/p>\n\n\n\n

Here are two things you <\/span>need to know before you start building<\/span><\/a>:<\/span><\/p>\n\n\n\n

1. Plan Before You Design.<\/span><\/h3>\n\n\n\n

This first step of the web development process is all about taking stock of who your audience is and the type of site you\u2019re trying to build.<\/span><\/p>\n\n\n\n

Without nailing down these two elements it\u2019s much more difficult to stay  on track as you\u2019re building your website. Even if you\u2019re building out a site for fun, you\u2019ll probably want to start with a goal of what you hope to achieve.<\/span><\/p>\n\n\n\n

Let\u2019s start with looking at your overarching goals for your site.<\/span><\/p>\n\n\n\n

Spend some time with the following questions. They\u2019ll help you find what category of site your building, which will help with the final step below. <\/span><\/p>\n\n\n\n