So you want to build a site

February 01, 2020

The first step to being good at something, is to suck at it.


Also known as Jenn goes down memory lane.

The early days of the web was filled with little one off sites dedicated to sports, tv shows, and just random things people liked. Everyone was trying out and inventing new things. Some of it worked, some of it didn't. But the only things you needed to start was a text editor, a browser, and a hosting service.

Nowdays it can feel like you need a massive toolchain of preprocessors, integration services, and compilers just to put a site online. It doesn't have to be that way. You still can get started with just a text editor.

What is a text editor

A text editor, edits text.

Not a helpful definition, but it is that simple. Most operating systems ship automatically with a text editor.

On Windows systems, look for Notepad. On Macs, look for TextEdit.

You do not want to use a word processor like Word. Word has some built in functions that automatically change some special characters into other print characters, e.g. turning dashes into em dashes and changing double quotes into smart quotes. This can cause rendering problems in the browser.

What is a browser

A browser is how you navigate and use the internet. You are using one right now to read this blog post.

There are a few main browsers:

  • Edge (the blue e)
  • Firefox
  • Chrome

Browsers connect to the web host.

What is a hosting service (aka web host)

A hosting service (web host) is how other people get to see your blog, project, or art piece. This is a server (dedicated computer) that is connected all the time to the internet that "hosts" your page.

There are many hosting services, I'd recommend paying for one as the free ones are more trouble than they are worth.

Your first page

  1. Open your text editor and create a new file.
  2. Type <h1>AWESOME!</h1>
  3. Save it as something like "awesome.html". The ending .html is the important part.
  4. Open this file in your browser.
  5. Congratulations! It should be a white page with the word awesome on it.

Browser window with the word "AWESOME!" written in black on it.

Check back tomorrow when I'll walk through the anatomy of a webpage and we will add more content.