How to make a website without dying!

2019_website.jpg

Blog header image by Batensan.

It’s time—you want to make a stunning portfolio, or an awesome blog, or a cool and convenient store! Or maybe you’re feeling especially ambitious, and in the crossover of the century, you want everything at once.

…And you have no idea where to start.

Over the years, I’ve made every possible mistake in making and hosting websites so that you don’t have to. Here’s some of my findings and tutorials on how to make a website without dying!

Index

  1. The lazy man’s personality quiz

  2. What you really need to know… no, really

  3. Step 1: Getting a domain

  4. Step 2: Getting web hosting

  5. Step 3: Building your content

  6. Total cost breakdowns

 

Personality quiz!

Hate reading? Me too. Just kidding, I write for a living. But anyway, if you’d prefer to take a personality quiz instead of reading, try this little quiz I’ve thrown together! At the same time, it’s probably best to not make any key life decisions on an 7-question quiz, so… maybe do some research after.

Did it give you a bogus answer? Well… it’s just 7 questions. Please be kind to it.

Play it right here :)

 

“Hosting” vs. “domains” vs. “web content” — wait, they’re different?!

Welcome to the world of website creation! Here’s a crash course on how not to die. You might hear a lot of terms like “web hosting,” “domain registry,” and “website content.” These are all very different parts, so let’s find an easy way to break it down.

The three building blocks

In order to have a functional website, you need three core building blocks:

  1. Web domain.

  2. Web hosting.

  3. Web content.

Confusing? Do they all look the same? That’s alright. Here’s a better explanation.

YOUR SITE IS A HOUSE

Imagine that a functional website is a house.

np_address_1271842_000000.png

Your web domain is your address, like http://somecompany.com. It’s how other people can find you and know where you are. Just like your house address might be 420 Meme Lane, your web domain is http://420memelane.com. But a web domain is nothing more—it’s not the actual house, it’s just your address. Without web hosting, people will drive to the address only to find a blank plot of land at 420 Meme Lane.

np_house_481873_000000.png

Your web hosting is the actual house building. Servers hold your content and show it to visitors of your website. With a web domain and web hosting, you now have a proper house. But your house is completely empty—there’s no furnishings and no decoration. So it’s time to add the decoration, or the web content!

np_sofa_1050844_000000.png

Web content is your furniture and decor—pages, images, blog posts, products, and more. You need a system to create your web content. If you buy a web hosting package from a web hosting company, then you’ll upload HTML, CSS, and Javascript files that you make yourself (or use an open-source content management system like Wordpress). If you buy a website creation system like Squarespace, Weebly, or Wix then you have an easy drag-and-drop system to build your website.

Remember, you need all three for a website! It’s easy to mistake domain registration and web hosting as the same thing, but they’re different.

 

Step 1. Getting a domain

Okay folks, now that the boring exposition is over, it’s time to make your awesome website! You’ll want to reserve your address. A simple domain ending like a .com address will cost around $12/year, whereas a super special domain ending like .gg will cost a lot more.

Important note: If you plan on using a website builder service like Squarespace, Weebly, or Wix, many of them offer a free domain for the first year as an incentive to sign up for their services. Take advantage of this deal, and skip this section!

Screen Shot 2019-07-22 at 10.23.37 PM.jpg

You’ll have to find a domain registration service and purchase the domain through them. Here’s some that you might want to check out:

  1. Google Domains🌸 — My personal favorite. Super easy and clean to navigate, simple, and they don’t hide fees and charges.

  2. Hover — Another simple, clean, and non-scummy site.

  3. Namecheap — They offer more domain options that Google, but do be watchful as they have a tendency to charge for extraneous services.

  4. GoDaddy — A popular option, but also have a tendency to hide fees and charges.

 

Tip! Always buy your domain separately from your web hosting provider. Web hosting services tend to be kind of scummy, and they’ll nickel and dime you with stuff that you don’t actually need. Their DNS management also sucks. If that doesn’t mean anything to you, then just trust me on this one: buy from Google Domains.

 
 

Step 2. Getting web hosting

You’ve registered your address! You’ve planted your metaphorical flag on your metaphorical moon! Now you need a web hosting service to actually have your website exist. Depending on your needs, web hosting costs will range anywhere from $4/mo (basic cloud or web hosting) to $200/mo (dedicated servers). When I had web hosting, I was paying around $125 every two years, or $5.20/mo.

Reminder: website building services provide web hosting as part of their package, so you can skip this section if you’re going with Squarespace, Weebly, Wix, or other comparable site builder.

 

Tip! Some services like Leprd.space provide web hosting for free. Do note that they often come with limitations or are much slower than paid services. Check your site speed on Google PageSpeedInsights to make sure your site is loading fast enough (or visitors will leave!)

 
Screen Shot 2019-07-22 at 11.28.39 PM.jpg

To be completely honest, I don’t have good experiences with web hosting services—most of them are either bloated, convoluted, scummy nickel-and-dimers, or all three. However, if you’ve done your research and you know exactly what you need, then they’re much cheaper than paying for a site builder. Some popular web hosting services are GoDaddy, Hostgator, Bluehost, and Hostinger.

np_store_980053_000000.png

Running a store?

If you’re running a store, you will need an SSL certificate. And what the heck is that? Well, basically, it protects your customers and ups your website’s security. It’s a necessity for stores because people are entering financial information.

Depending on your web hosting services, SSL certificates can cost anywhere from free to $50 per year. Some awesome resources provide SSL certificates for free, like Let’s Encrypt from the Linux Foundation.

 

Step 3. Building your content

Your house is successfully built, and it’s time to furnish it! There’s a few ways to do this, so let’s take a look.

CompressedFiles1.png

Method 1: upload own files (html/css/js)

If you’re a coder or a web designer, chances are that you’re fine with uploading files coded yourself—either coded with HTML/CSS/JS, or coded in a framework like Bootstrap. Go ahead and write your files, test them, and upload them to your web host’s /public_html folder.

Best for: Full command and control over site appearance and function.
Recommended:
Extensive experience in web design and coding.

 
Screen Shot 2019-07-22 at 10.05.15 PM.jpg

METHOD 2: Buying a Template

There’s all sorts of website templates out there now, found on creative marketplaces like Creative Market and Envato Market. You can purchase a pre-coded template that you like, change the placeholders, and upload them to your web host.

Best for: Customized themes and appearances while keeping out of heavy coding.
Recommended:
Beginner experience in HTML and CSS.

 
Screen Shot 2019-07-22 at 10.08.14 PM.jpg

Method 3: Content management system

Ever heard of Wordpress? It’s one of the most popular CMS (Content Management System) out there. Basically, you can install a CMS on your website; it creates a user portal (a back-end interface) where you can easily edit the pages and content on your site. CMS also often come with themes, so you can easily theme your site without coding experience. They are free and open source, so you just have to download and install them on your web host and server.

Here are some popular CMS systems:

  1. Wordpress🌸 — A popular CMS that specializes in blogs, but can manage all kinds of websites, especially with powerful plugins like WooCommerce. Depending on the theme, it can bloat or be slow to load.

  2. Drupal — A popular CMS for developers and coders. Tinkering-friendly with advanced options.

  3. Grav🌸 — A flat-file CMS focused on speed, an intuitive interface, and easy modification.

  4. Joomla — A CMS that focuses on flexibility and ease of use.

  5. Ghost — An elegant CMS for blogs, magazines, and publishing platforms. Requires special server requirements like Node.js, so check your web hosting plan to make sure this is supported.

There’s countless CMS out there, so run a Google search and see which platform works best for you!

Best for: Updating content consistently (blogs, stores, etc) while keeping out of heavy coding.
Recommended: Beginner knowledge in how to install open-source software.

 

Tip! Content management systems take a bit of a learning curve, but once you know how to use one, you know how to use them all. Invest a little time to learn them, and you’ll find a very flexible system that can be modified to suit any of your needs.

 
 
Screen Shot 2019-07-22 at 6.09.38 PM.jpg

METHOD 4: Website Building SERVICE

I know I’m repeating myself a lot, but hey, I don’t know who actually reads through the whole article and who just skips to what sections they’re interested in, so I’ll talk about these again.

Full-fledged website builders like Squarespace, Weebly, and Wix are meant to take the complexity out of website making.

Here are some popular website builders that I personally recommend, although there are many out there:

  1. Squarespace— The leading all-in-one site builder with a variety of elegant and beautiful themes. Robust features and lots of content options, all in an easy drag-and-drop editor. Supports sites that need many different features like stores, blogs, portfolios, and more.

  2. Carrd.co📄 — An inexpensive site builder with beautiful themes, great for simple sites, resumes, or other one-page sites. Plans start from just $9/year.

  3. Big Cartel🛍 — A site builder aimed at online stores. Makes running an online store super simple and easy.

  4. Carbonmade📷 — A site builder aimed at portfolios. Gorgeous themes that show off your work as a professional. Plans start from $8/mo.

  5. Wordpress📝 — Wordpress isn’t just an open-source CMS; it offers hosted plans as a site builder, starting from $3/mo. Great for bloggers.

Best for: People who are tired. (Just kidding. Unless…?)
Actually best for: Easy ways to set up and maintain a beautiful website, blog, or shop.
Recommendations: No specific skills required.

 

Total cost breakdowns

  1. Domain name: $12/year or more

  2. Web hosting: $4/mo or more, OR $8/mo or more with site builder

  3. (For stores) SSL certificate: Free or more

If you’re paying significantly more than these costs, you’re probably paying for stuff you don’t need. Check the details of your payment packages to make sure that you’re using what you’re paying for.

 

Summary

Hopefully, this article didn’t drown you in a despair-inducing flood of overwhelming anxiety. Hopefully, it made the process of building a website a little more clear.

There’s a lot of different ways to create and maintain a website nowadays, and with each passing year, new technology is released to make things faster, cheaper, and easier! Maybe within five years, I can release another “how to build a website” article and it’ll only be one step. One can dream, right?


(Psst! I want to keep my site free of advertising so that it's easy to access and clean to read, and keep creating content that is useful and accessible to the public. If you enjoy my stuff, please consider pledging to my Patreon or buying me a Ko-fi to support the cause!)