Creating a Website | Part 1

As announced in my new year post, I'll be sharing my progress as I create my own website, both the how's and the why's. Hopefully, for those who have a similar desire, this will be useful.

Creating a personal website is not very difficult anymore. In the early days of the Internet, it was all about knowing how to code in HTML, Javascript, and a few others to get all the frames and designs out. If you look back on early 2000 website pages, you can see just how much things have changed since then. Part of this was due to the fact that there weren't templates or ready-made schemas for designers, and everyone had to do everything themselves. Back then, “web designer” was basically synonymous with “coder”, rather than the plethora of jobs today, ranging from UI/UX designer to graphic designers.

Now, anyone can design a website, even if you have absolutely no skill in either programming or graphic design. Let me show you how!

Building Websites with a CMS

The first thing to understand is that, for the vast majority of people, building a website revolves around using something called a “content management system”, or CMS. The CMS is generally where you do the majority of your work, whether it is creating the look of the website, making blog posts, uploading photos, linking to your social media, etc. Today, there are a lot of different CMS services like Squarespace and Wix which allow you to build a website from pre-designed templates. The one I will be using is called Wordpress.

The wordpress.org website.

Wordpress has been around for a really long time. Because of this legacy, it has grown to be one of the best supported and most flexible CMS's out there. You can build something as personal as a blog site (which is what I'm doing), or you can build an entire social networking site with it! The amount of things you can do is pretty crazy. In fact, one of the reasons I'm using it is because Coil has a plug-in for Wordpress that allows Coil subscribers to stream payments to the website owner.

With such flexibility, sometimes it may feel a bit daunting to know how to start. Here's how.

Beta-Testing Your Site

There are a couple ways to use Wordpress to create your site. The first is to go to Wordpress.com and just follow the instructions from there. Doing this is similar to Wix and Squarespace and other online CMS's, where they will walk you through website creation step-by-step.

However, like Wix and Squarespace, Wordpress.com is not very flexible, as there is an (admittedly large) array of things you can do, but you won't be able to do much outside of what they allow you to (unless you pay the money to do so). Furthermore, these sites allow you to only edit your website online. In other words, if there are some things you want to test before your website launches, it's basically impossible.

So instead, if you want the full-fledged open-source Wordpress, and the ability to test your site before you launch it, you can download a little app called Local by Flywheel. This is an extremely useful tool that builds the basics of your site for you while giving you all the flexibility of the entire Wordpress suite, and allows you to beta-test it both offline and online. Then, when you're ready to launch, you just export your site to a host online.

The Local by Flywheel website.

After you download the app, install it, and open it (this may take a while at first) you'll be presented with a window that looks like this:

My Local App.

Of course, if you're doing this for the first time, you won't have the actual “TEST” and “THE POOL” listed on there, since those are my sites. Instead, you can click on the big “+” sign at the bottom left to get started. Name your website, then determine the PHP setup environment (I'd recommend sticking with the default), and then choose a name and password for yourself. After you do so, it will generate the needed files, after which you'll end up with something like the below:

After you create your site.

When you're ready, click the “start site” button at the top right hand corner, and wait a few moments. Then hit “admin”, and it will launch your site's backend, where you log in with the name and password you created before. Then you will be greeted with something that looks like this:

Congratulations! You've created your first website!

Customizing Your Site

Now, what you're looking at so far is actually the backend of your website. This is where you create things like pages or posts, upload any media for your site, edit comments, etc. This is not what people will see when they visit your website. If you want to see what they'll see, click on the name of your website on the top left corner (where mine says “The Pool”).

Now, if you didn't edit anything, your website might look like an almost blank nothing:

This is because you haven't added anything to your site. What it's displaying are the default post and pages without any themes, plug-ins, or anything. So let's go over some of that stuff.

Themes

Themes are the backbone of websites. They are the graphical and interactive design portion of your site, and how other people will see it. Thus, to access the themes of your website, go back to the admin backend (click on the name of your website again at the top left), hover your cursor over “Appearance” on the lefthand menu, and click on “Themes”.

Because Wordpress has been around for so long, the number of themes that have been created number in the thousands. If you hit the “add new” button, you will be greeted with a few pre-installed themes. However, if you head over to the Wordpress.org website, and go to the “Themes” page, you'll see those thousands I was talking about.

8,026 themes as of January 7, 2021

These are only the themes hosted on the Wordpress.org website. If you want to see even more, there are third party websites that have both free and premium themes you can buy and download. On most of these theme browsers, you can filter what you're looking for, or simply look at the most popular ones.

For me, themes are both the most fun part of creating websites, and sometimes the most frustrating. It's fun because simply looking at the vast number of themes possible energizes me a lot. It's really fun just seeing how creative people are in designing websites for things like online magazines, storefronts, fashion portfolios, etc.

But it's also a bit frustrating because, at the end of the day, I know I need to make a theme work for my own personal tastes, and oftentimes, I see themes that are almost what I want, but not quite. That's why I like Wordpress so much, because you can edit any part of a theme to make it exactly how you want it to be. Much of this customization can be made through the “appearance” tab we were at earlier, though if you want to get really nitty-gritty, you can certainly edit the code underlying the entire site as well.

For third party themes, you can simply download them, and then upload it in the “themes” part of your website that we navigated to above.

Posts and Pages

Because Wordpress was originally a blogging platform, the way you manage it is very similar to one. You have posts that you can create, which are similar to “blogs” or “news items” on typical websites. Then there are pages, which are static pages that can be used for things like contact forms or support and about pages.

Posts typically are attached to categories and tags. You can make different pages host different categories of posts, but typically those are determined by the theme. Instead, pages often have different widgets and menu items (all under “Appearance”), and are there for specific things. Visitor comments typically fall under posts, though you can enable them in various pages as well, if you want.

Plugins

Plugins are, in my opinion, how Wordpress beats its competition. While most things can be done through coding HTML or Javascript, plugins allow non-programmers (like me) to get access to a vast number of things that would take a lot of development time to embed natively into your website. From spam protection to making your site into a wiki to the aforementioned Coil plugin, really, the sky is the limit to what you can get with them.

It's really easy to get caught up in reading through, and then enabling or adding a bunch of plug-ins at once. However, keep in mind that every plugin added typically also adds a bit more loading time to your website. It's not uncommon for amateur Wordpress sites to be extremely sluggish because of the amount of plugins the owner added onto it.

All-in-all, I would recommend having only plugins that you really need, or plugins that group a bunch of functions together so as to conserve resources.

That's it!

That's the end of this part of creating a website! Hopefully, this has given some inspiration for anyone who wants to start making their own website to do so!

Next time, I'll be going over more specific parts of my own website I'm creating, and go more into depth of why I'm making my own website. Then, I'll be ending this small series with how to upload your newly created site for people to see!