How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

HOME FEATURES DEMOS PRICING SUPPORT 

LOGIN GET STARTED!

How to Build a WordPress
Website in 2021 in 6 steps.
An A to Z Guide

Back in 2017, there was an opportunity at the company I was working in to learn web design.

I began learning HTML, CSS, and Javascript. I pretty much enjoyed it. Until I ran into my first
bugs. Later on, I was assigned a side project: an actual website. I was thrilled, my colleagues

1 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

were there for me when I asked for help.

A few months later I was working on a pro-bono WordPress assignment for an NGO.

Let me state that we were in the travel market and I was doing marketing. But there was this
culture of empowering people in learning new skills.

I am the DIY type and realized that the learning curve for learning code is far longer than
expected. With WordPress, things worked differently.

Fast forward, in 2020, I ended up working for the Colibri makers, Colibri being a popular
WordPress drag and drop page builder.

Things are so easy today with such tools. WordPress can really empower people to build a
website from scratch in no time. And inspiration for websites is just…all over the internet.

Now, here are steps:

1. Choose your domain name

2. Acquire website hosting
3. Get familiar with the WordPress interface
4. Install a WordPress theme
5. Build your WordPress website
6. Install vital WordPress plugins

Because having some steps ain’t enough for having a supercalifragilisticexpialidocious website,
I have one bonus for you at the end of the guide: UX design tips and tricks.

But before jumping into the topic, I want to shine a light on another subject. Won’t take long, I
promise.

How much does a WordPress website

cost?
If we are to make a cost breakdown for a WordPress website, here’s what we should include:

Buying a domain: prices can begin at $15/year

Hosting acquisition: prices start as low as $8/year
WordPress theme. Now, depending on the levels of customization and how many features
you want to include, you can start with $0. If you don’t want to settle with a basic website,
yearly WordPress theme plans revolve around $70.
WordPress plugins. Many of them are free of charge, but if you want advanced options,
you’ll need to upgrade to a paying plan.

2 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

This means that the most basic website will start from $23/year. The moment you want
advanced theme features, the cost will rise to about $100/year.

When you upgrade plugins, you might end up paying around $200-500 a year.

If you want something custom made, and you need to call in a WordPress developer, the costs
can go over $1000 in the first year.

For online stores, the costs can increase significantly, because you need lots of functionalities,
and performance and security are top of mind.

Now that we clear this out, it’s time to get to the bottom of our topic today: how to create a
WordPress website in 2021.

1. Choose your domain name

Source: https://unsplash.com/photos/N1XUwR8iOf0

If you didn’t know this yet, the domain name is your business name or product name. Names
can be really powerful, so don’t be hasty when choosing your domain name. If you feel you’re
getting cold feet, don’t worry, there are tools out there that can help you out.

Tips and tricks for website domain name choosing

I was doing some brainstorming for a website domain for a business a while ago and realized

3 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

that “Wazz” sounded quite interesting. It’s short, easy to remember. But the moment I googled
it, well….let me say, I burst into laughter. In British slang, it meant “urination”. Really folks, do
your research.

Later on, I wanted to name my photography website. I was analyzing “moonshine”. It felt so
nice, romantic, fairytale-ish…except it wasn’t. It seems that it meant “ illicitly distilled or
smuggled alcohol”.

So, make sure your naming is unique, memorable, and doesn’t have any weird meaning in
English or another popular language (eg: Spanish) if you want to go international. If you’re a
local business, you might skip this.

Now, let’s look a bit at a tiny checklist for choosing a domain name for your WordPress website:

Make a list of relevant keywords for your business/product. Think of how the users should
feel after using the product. Let’s say you have a skin product line based on natural
ingredients. Your list might contain words such as “skin”, “care”, “safe”, “natural”, “beautiful”,
“fresh” etc. Use a tool such as Namelix or Novanym to generate domain name ideas.
Check the meaning of your newly found domain name. I always google it like this “{insert
name here} meaning”. I will end up with dictionary explanations. Next, I go to Google
images and see how it gets matched. Maybe there’s a singer with that name, a manga
cartoon name, etc. If so, you’ll need to redo the process.
Look for the domain name on Facebook or LinkedIn to see if there is a business page with
that name.
Check if there’s a website domain available for sale. For many sites, “.com” is the best
top-level domain (TLD), followed by “.org”, “.net” or “.io”.
Buy your domain name. You can do so via a domain registrar such as GoDaddy or via
your hosting provider.

And this leads us to our next chapter.

2. Acquire website hosting

Every website you’ve ever visited is hosted on a server. This means you’ll need to acquire web
hosting from a hosting provider.

Considering we’re building a WordPress website you can choose a hosting plan from
WordPress.com or some other third-party hosting provider.

Let me clear something out before we proceed. There are wordpress.com and wordpress.org.
The difference is that on WordPress.com you can host and build a website. From
WordPress.org you usually acquire themes and plugins for your website, which is hosted
elsewhere. You can compare the WordPres.com plans here.

4 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

This guide’s hypothesis is that you really want to build a brand and have full control over your
website. This means you’ll go to a third-party hosting provider.

There are three main hosting services: shared hosting, VPS, and managed hosting. In the first
situation server resources are split among more sites. In the long run, if these sites grow, and
yours as well, you might encounter performance issues. You might realize that you need a VPS
service or a managed hosting plan.

So, you need to have this in mind when choosing a hosting provider: which are your business
goals?

If you go with VPS hosting, resources will still be shared, but you’ll gain some control over
them. You’ll see improvements in terms of security and performance as well.

Managed hosting is kinda an “à la carte” service. You’ll get your own physical server all to
yourself, and you’ll see a boost in performance and security.

Definitely, things can get more complicated than this, but I just wanted to paint the big picture of
hosting.

Next, when you analyze the plans, take a closer look at:

Pricing
Storage
Support
Performance

Some hosting providers have some extra features packed such as domain offering (eg:
Namecheap), website builder (eg: GoDaddy), e-commerce options, etc.

Now, you’ve probably noticed by now some websites using “HTTP” or “HTTPS”. What’s up with
those?

HTTP is the basis of the modern web. It connects the browsers and servers, and functions on a
request-response basis. Now, the extra “s” means the connection to the website is encrypted
and the data shared with the website is secure.

Let’s say a user makes a payment on your website or logs into an account. The info the user
will type in will be private. Safe from hacking. This is happening through the SSL technology,
which stands for “Secure Sockets Layer.” For consumers, seeing “HTTPS” signals trust,
because you can protect their data and privacy. This means that you’ll need to acquire an SSL
certificate.

Make sure your chosen plan includes this as well.

The moment you acquire your hosting plan, and you’ve set up your login details, the only
missing piece is going to be WordPress itself. Most of the hosting providers out there allow you

5 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

to install WordPress from their dashboard/wizard. It’s all pretty intuitive.

How will you log in to your site? Easy peasy. Just type in the browser your website address and
add to it “/wp-admin”, as seen below.

3. Get familiar with the WordPress

interface
The WordPress dashboard has 9 sections. Let’s take a look at them.

WordPress settings

Inside this section, there are 7 more menu items. I’ll describe briefly the most important things
that need to be done here.

Under “General” you can set up the site title, tagline, URL, time zone, time & date format,
and language.
Under “Reading” you’ll “tell” WordPress which page serves as the homepage, and which
one is your “blog”. This is an important step. You’ll also choose how many blog posts can
show up on a page or if you want your website indexed by Google.
Under “Discussion” you’re going to do the blog comments setup.
Inside “Media” you can establish the maximum dimensions in pixels to use when adding an
image to the Media Library.

6 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

Inside ‘Permalinks” you’ll set up the format of your URLs.

You can define your privacy policy pages inside “Privacy”.

The best way to approach the “Settings” panel is to enter all these items and fill in the missing
info, just to make sure you don’t skip anything important. Things are pretty straightforward, so
don’t get cold feet. All the setup can be done in less than 30 minutes.

WordPress pages and posts

What you need to know is that your content will go inside “pages” or “posts”. Here you’ll spend
95% of your time.

The “pages” are static. You can have a “homepage”, “services” page, “contact us” page, you
get the point. Under posts you can have your latest blog articles, maybe your portfolio. These
are dynamic pages because they automatically place your newest website content at the top.

7 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

When you select “Posts” from the dashboard, you will be able to create a post, visualize all
posts, and manage tags and categories.

You can create a new post if you select “Add New” as seen above, or go to “All Posts” and then
select “Add New”.

The same works for pages.

What you’ll see in your “All Pages” or “All Posts” are some default pages and posts deployed by
your theme.

Now, how can you edit a post or a page?

8 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

When you hover over your default pages and posts you will see some options: edit, quick edit,
trash, view. In the screenshot above there’s also “Edit in Colibri”. This is because we installed a
plugin that allows you to customize pages using the Colibri WordPress builder (but we’ll talk a
bit later about this).

WordPress media

All your media goes in here: images and videos. You can drag and drop them or upload them.

You can also add media from your post/page level. I’ll show you more on the topic later.

WordPress comments

The 4th dashboard section is called “Comments”. Here you can manage your posts’
comments. You’ll receive tons of spam comments that can be moved to spam or trash. You can
approve the relevant ones.

9 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

The “Appearance” menu

At this level you can:

Search for, install, and activate a theme (more details in the following chapter).
Customize widgets to add blocks of content to your site’s sidebars, footers, and other areas.
Define your WordPress website’s menus.
Add a background image to your site.
Edit the code of your theme inside “Theme Editor” (recommended only if you are a
developer).

Now, the moment you activate certain plugins, you might see a few new menu items
underneath “Appearance”. In this case, because we’ve activated the Skyline theme, we see an
option to set it up under “SkylineWP Settings”. Each theme can come with its own setup.

“Install Plugins” is the other extra menu item added by the Skyline theme. In here you’ll see
some plugin recommendations that work well with Skyline.

This leads us to our next menu item.

10 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

Plugins

There are lots of features that can’t be managed by theme only, such as SEO optimization,
website security and back-up, tables, forms, e-commerce features, and more. Plugins are here
to compensate for the lack of such options.

Here’s a tiny tutorial on how to install, activate, and deactivate plugins. It’s all intuitive and user-
friendly.

How to Install, Deactivate and Work with WordPress Plugins

Users

At this level, you will decide who has access to your website. You can give access to
contributors, guest authors, editors and more, depending on your needs.

11 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

Tools

Under “Tools” you’ll have the option to import and export tools data to and from other content
management systems (eg. Blogger).

There’s also a “Site health” section, which shows you critical information about your WordPress
configuration and items that require your attention, with some advice.

Because we need to respect privacy policies, here you can export or erase personal data for
your users.

And, with this, we’ve wrapped the WordPress dashboard chapter.

Let’s get to more interesting business.

4. How to install a WordPress theme

For this, you need to go to your WordPress admin dashboard, click “Appearance” from the left
menu, then “Themes”.

12 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

Next, click on the “Add new” button.

You’ll see a bunch of templates showing up, and you can filter them by latest, featured,
popularity…or by features.

We’re proud to say that our very own Mesmerize and Colibri themes are listed in the top 20
most popular WordPress themes.

The moment you choose a theme, click “Install”, then “Activate”.

13 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

You can also activate your WordPress theme if you head over back to Appearance->Themes.

The whole installation process is explained in our tutorial as well.

How to install, set up and delete WordPress themes

Now you’re ready to rock and roll!

14 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

via GIPHY

5. Build your WordPress website

In WordPress, your website design depends on your chosen theme. If you need something
extra, well…you might need to find something to fill in the missing features.

Usually, every WordPress theme has 2 designs: one for the blog and one for the pages. Colors
are limited, there are no special customizations. This means that at a certain time, plugins will
come in handy.

Now, WordPress themes have a theme customizer with basic functionality. They are a good fit
for those that don’t need any custom features and want to build their site really quickly. When in
need, you can add your own CSS styles. Just make sure to pick a theme that has a layout that
matches your own vision.

How can you customize a theme? Just head over to Appearance-> Customize.

15 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

From the left-hand side, you can choose what to modify: content, menu, and more. On the
right-hand side, there’s your website preview. You can change the text in real-time, by clicking
on the pencil icon.

On the other side of the story, we’ve got WordPress builders. They are plugins that help you
build truly unique websites. You can alter your theme’s layout completely.

In our case, Skyline pre-installs such a builder called Colibri, we’re going to use it as an
example.

Depending on the version of the theme, the free or paid one, you’ve got various elements to
play with: from headers, specific page sections, to tinier components such as calls to action,
tabs, counters, accordions, and more.

You can edit your theme as before, from Appearance-> Customize, or take the shortcut, as
shown below.

What changes? You’ll get access to more features inside the Customizer.

16 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

Besides using the customizer, there’s another option for website customization in WordPress –
the default editor. You can access it from the “Edit” option below every post and page. Also, the
moment you add a new post or page, you’ll get straight inside the default editor (unless you
have a builder activated).

17 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

So, in our next chapter we’ll go in-depth with how to:

1. Create a WordPress website using a WordPress page builder

2. Create a WordPress site using the default WordPress editor

A. How to build a WordPress website using free website builders

WordPress website builders help you take the WordPress Customizer to a whole new level.
You will be able to customize everything: headers, page content, footers, navigation menus,
global, individual styling, you name it! No design or coding skills needed!

It’s usually a drag and drop process. And you do not need to worry about the mobile design,
the builders have the responsiveness aspect covered.

How to adjust website settings in the Customizer

Look at your left-hand side panel. Now scroll down to “General settings”.

18 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

Here’s where you can set up:

Your website’s name.

The overall color scheme and typography of your website.
Templates for blog, header, and footer: what backgrounds to use, spacings, borders,
shadows, etc.
Spacing: inside buttons, columns, etc.
Custom CSS Styling

How to create content in WordPress using builders

As mentioned before, if you want to create a new website page, head over to “Pages” and
select “Add New”. You’ll be directed to the default WordPress editor where you’ll name your
page. Next, select “Edit with Colibri” as shown below.

When you want to edit an existing WordPress page, just click “Edit in Colibri”.

19 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

How to add sections to your WordPress pages

Every “+” sign in the left-hand side panel opens up a window with blocks and components. You
can scroll down until you find a design you fancy, or just type in a category. Here are the
categories available in the Colibri builder: Hero Accent, About, Features, Content, Call To
Action, Blog, Counters, Portfolio, Photo Gallery, Testimonials, Clients, Team, Contact, F.A.Q.,
and Pricing.

20 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

These are pre-defined templates, that will match the color scheme of your choice.
By selecting one of the blocks, by clicking on the “+” sign showing up on the block, the block
will be positioned at the bottom of the page.

You can move them wherever you want, by dragging and dropping the section from the left-
hand side panel.

There is also an option for “blank” blocks.

21 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

This means you can customize them however you see fit. In the end, you can even save your
design for later use.

From the setting icon in the top right corner of every section you can adjust the number of
items per row, you can reorder items, add new blocks, and even delete the whole section.

How to customize sections of your WordPress page

If you want to change the text in your sections, you can do it in-line, meaning inside the section
itself, live.

22 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

In-line editing is not available for texts on buttons. They will be managed in the panel on the
left.

If you want to change an image from your site, it’s all intuitive. Start by selecting your image.

You’ll be able to see it inside the panel on the left as well. Click on the image. You’ll see a new
window popping up asking you to upload an image or select one from the library. If you choose
to upload, you can do so by drag and drop.

Now, going back to the panel I’ve just mentioned, it has 3 main options: Layout, Style, and
Advanced. Whenever you select a section from the website preview on the right, you’ll see the
corresponding panel of the section.

Let’s take them one by one:

23 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

Layout

Here you can adjust the width and height of the container, at the structure level. . Simply put,
the container is the actual space a block occupies. Inside the container, you place the content
(text, images).

You can also adjust the spacing of your content, and how close to the top or bottom it gets
placed.

You can also add new rows inside your block.

Style

At this level, you can customize the background of your block or add dividers. Dividers are
visual cues that signalize when a website section ends or begins.

24 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

Advanced

Here comes the fun, folks!

From typography and spacing to responsiveness, this is where you can get into the smallest
website details.

You can create variations depending on the state of the element: normal or hover.

If you select a certain element inside a blog, let’s say a heading, the same panel will show up
on the left.

25 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

This means you can go more granular with your editing.

Speaking of headings and more granular elements, these are named “components”. Let’s see
how you can play with them.

How to use components in your WordPress site

The components refer to headings, sliders, dividers, buttons, carousels, pricing, and more.
They can be accessed in the same way as blocks. They sit side by side and they have drag
and drop functionality. Colibri offers 40 components.

26 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

As mentioned earlier, you can adjust them from the panel on the left, if you go to “layout”,
“style”, or “advanced”.

Mobile responsiveness

In a multi-device world, it’s vital to have a fully responsive website. By default, Skyline is a
mobile responsive theme. This means that its sections will adjust according to various devices.
If you want to preview how your WordPress site looks like on tablets or mobile, you can do so,
when playing with the controls in the bottom left.

You can also select to hide certain features on mobile, for example, inside the “advanced”

27 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

options.

How to build a menu in the WordPress Customizer

Now, let’s say that you’ve designed your pages and you need to add them to a menu. In the
panel on the right, you have all your sections, ordered from top to bottom, like on your site. The
Footer is your last section. Below it, you’ll see some extra features.

Here you can create your menu.

After selecting “Create New Menu” you’ll get to name your menu and choose a placement for it
(header, footer, pages, etc.).

When selecting “Next” you’ll be able to add your pages to the menu, from the “Add items”
option. It can’t get easier than this.

28 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

How to work with WordPress widgets

I’ve already mentioned that widgets are blocks of content that you can add to your site’s
sidebars, footers, and other areas.

When using a WordPress builder plugin, you’ll be using widgets only for your WordPress
sidebars, because you have predesigned footer layouts.

Usually, sidebars are used by blog pages. Each theme has different widgets options, from
search bars, recent posts, and comments, social widgets, to images and videos. Let’s say you
want to show your Instagram profile in a sidebar, there’s an Instagram WordPress widget for
that.

29 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

One of my favorite widgets is the one that allows for custom HTML editing. I find it really
powerful.

This being said, you’re kinda done. Congrats, your WordPress site is up and running!

Now, let’s check the other method for building sites in WordPress.

B. How to build a WordPress website using the default WordPress

editor (Gutenberg)

I’m going to make this really quick. This editor is still new in WordPress (it’s the default
WordPress editor since December 2018), but it’s evolving continuously thanks to community

30 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

contribution.

The classic WordPress editor looked like this:

Now we have:

Now, what you need to know is that not every theme is compatible with this new editor. You’ll
have to find one Gutenberg-ready.

Layout design with the default WordPress editor is limited. It’s also based on blocks. Now, as
you’ve probably found out in the previous chapter, blocks can be pretty much everything:
headings, images, buttons, videos, etc.

31 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

Now, why I’m not insisting on the topic: if you check for Gutenberg reviews, the most recent are
1-star reviews. It’s not a good experience. Even if it’s already been 2 years from the launch,
and many updates in the middle, this is still in its infancy. WordPress relies now on the
community to create new blocks so that the editing experience can evolve.

Right now the tool behaves like a text editor, with low power on the styling side.

There are tools out there such as Kadence, that can help you out, but we’re not there yet.

6. Install vital WordPress plugins

The WordPress ecosystem is made of themes and plugins

There are thousands of WordPress plugins available out there that can extend the functionality
or add new features to your website.

This is a very short tutorial on how to install a plugin.

32 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

Our plugin recommendations

Plugin type What it does Recommendation

Gives your theme

WordPress builder drag and drop Colibri
functionalities

Minimal website
changes that can
SEO WordPress plugins Yoast SEO
help it rank
organically

Use forms to
capture valuable
Forms WordPress plugins user data (with Forminator
their consent, of
course).

Develop marketing
Email marketing campaigns to stay Mailchimp for WordPress
in touch with your
subscribers and

33 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

clients.

Cleanup malware
and protection
Security plugins Jetpack
from unauthorized
logins.

To help you set up

E-commerce WordPress plugins WooCommerce
an online store.

Prevent your site

Anti-spam from publishing https://akismet.com/
malicious content.

Helps you
understand your
Analytics Google Analytics
traffic and user
behavior.

Now, let’s get a bit into another topic: page speed.

Both your visitors and Google care a lot about your site speed.

Why Google?

Speed is an important factor that’s taking into consideration when ranking organically, meaning
here:

34 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

Why is site speed bad for the users, and ultimately you?
Well, if you offer them a bad experience, they might not engage with your offer, or might not
even come back anytime soon.

According to 2018 research by Google, 53% of mobile users leave a site that takes longer than
3 seconds to load (Holy Moly!).

And take a look at that!

How does page load influence mobile visitors (note: bounce meaning leaving the site)?
.
So, how can you fix this, and also improve your overall website performance so that you won’t
receive a thumbs down from both your users and Google?

I’ve picked 2 laid back solutions (there are many more out there, but pretty technical).

● Optimize images
Your website images shouldn’t be uploaded in their original size. Also, try going with PNGs
instead of JPEGs (they have fewer colors).
Smush is our preferred WordPress plugin for image compression. You won’t be seeing any
visible drop in quality and your page speed will be optimized.

● Caching
Simply put, cache is providing temporary storage for content to be accessed later. Your website
loads differently if accessed for the first time or the 5th time by the same visitor.

Why is that?
When you’re dealing with browser caching, your browser saves a copy of files from a website
on the user’s device

35 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

(hard-drive, mobile phone). When a website is cached, the browser only needs to load new or
updated pieces of a page, and won’t need to initiate a new server request. The same thing
happens if you click the “back” button, your browser will display the page from cache. This is
also super helpful when dealing with a slow Internet connection, the pages will load quickly.

Wanna understand more about how caching works? Read on here.

The tools we recommend here are:

➔ W3 Total Cache (W3TC) improves the SEO and user experience of your site by increasing
website performance and reducing load times.
➔ Hummingbird. This has some extra features as well that we love, like the compression of
Javascript, HTML & CSS files.

Now, how can you check how fast your website is loading?
Google has just the tool to help you with that, and also provides some fixing ideas.

Bonus: UX design tips and tricks

Remember me saying the “sky’s the limit” with the WordPress page builders?

Well…there’s always a “but”. When you design a website you should always have in mind your
audience, or the buyer personas (as the marketers like to say). You need to provide them a
great experience on your website, that’s what UX stands for (user-experience).

Now, for that, there are certain rules you should follow in order to provide a frictionless user
experience.

Meet the users’ needs

Users on a website don’t want to think too much. They need useful information that can be
skimmed and understood with ease. They don’t need an experience consisting of many clicks
or much back and forth.

People look for instant gratification: finding what they need fast and with ease. If this is not
happening on your website, they’ll look for another one.

Visual hierarchy

Not all website parts are treated equally, some are more important than others (forms, buttons,
headline, value proposition, etc.).

Where would you like your user to land on? Where do you want him to click?

Make use of visual cues to help him achieve what you want. All the elements on the pages

36 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

should behave as a tour guide.

Researchers have found out that users that read from left to right scan websites in a Z-shaped
pattern.

This means that’s where you should direct your most important information.

Easy navigation

You should keep the navigation bar simple, don’t go into too many options. You might end up

37 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

with a paradox choice situation when users get overwhelmed with the possibilities.

Pages should be internally linked to other relevant pages so that the navigation is smooth, and
the user shouldn’t click “back” many times to get to previous pages.

Make use of white space. White space allows information to be organized in digestible content
areas. This will make users feel more comfortable and not overwhelmed by loads of data.

Same color scheme (consistency)

Avoid super dark or super intense colors on your website. They might send users away. You
can use stronger colors to highlight important aspects of your website.

Use colors that are equally balanced. Here‘s some inspiration.

And one more thing before moving on to the next UX design principle. Colors have meanings
around the world, they are connected to various emotions. This infographic will shine a light on
the topic.

38 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

Use effective writing

Don’t use exaggerated and clickbait copy. Write with common sense, in a natural language,
don’t use jargon (not everyone is familiar with certain technical words).

39 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

Use max. 3 typefaces in a maximum of 3 point sizes — a maximum of 18 words or 50-80

characters per line of text as Smashing Magazine recommends.

Use social proof

Why should I trust you, your business, or your products?

We, humans, are social creatures. We live in communities, we have friends and family. They
can be our influencers. We care a lot about their opinion.
.
Let me list out some examples for you:
● Ratings and reviews

● Testimonials

40 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

● No. of clients (“you’re in good company”).

● Clients’ logos

● Case studies backed up by results

41 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

● Press featuring and awards

Also, if you want to find out about the latest design trends, the Coastal Creative folks did a
marvelous infographic on the topic.

Conclusions
We can call it a wrap don’t you think?

We wanted to go the short way, not to overwhelm you with information. But, in the end, the
devil’s in the details. We just gave you the helicopter view.

The thing is that you can have your website up and running in less than 2 hours. But, the more
features, pages, content you want to add, the longer it will take. And don’t you ever neglect the
latest web design trends.

One last thing though, if you are the DIY type, you definitely need to take our Colibri builder for
a spin!

Here’s a video on how to build a WordPress website page using tons of features.

42 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

How to create WordPress landing pages that convert [in less t…

Now, if you liked this article, and you want to learn more about how to design a WordPress
website, make sure to subscribe to our Youtube channel and follow us on Twitter and
Facebook!

Search …

Wanna jumpstart your business?

Get bi-monthly updates

© 2021on:
ColibriWP Blog.

designing stunning WordPress websites

building an online presence
promoting your website

Email address:
Your email address

Tick if you have more than 18 years old and you want to receive
exclusive giveaways, news about WordPress and our products, by
e-mail. You may unsubscribe at any time. Check our Privacy Policy and
Terms of use for more information.

Subscribe now

43 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

44 of 45 3/5/21, 12:32 AM
How to build a WordPress website in 2021 - An A ... https://colibriwp.com/blog/how-to-build-a-wordpre...

45 of 45 3/5/21, 12:32 AM