=> yujiri.xyz | Software

What goes into a website and how to make one

I generally encourage having personal websites. They have a lot of uses, and contrary to the widespread anti-self-promotion sentiment, I actually like it when people link themselves. It's a way for them to present a more complete and thought out perspective than they likely would if they were expected to type something from scratch every time they got into the same argument. And likewise just saves time.

=> Stop freaking out about self-promotion

So I thought I'd make a sorta guide on how to make them aimed at people with little technical knowledge. (This involves getting some technical knowledge, but not as much as you might think.)

Cookie-cutter solutions

First, there are a lot of "website builder" platforms or Content Management Systems out there, like Wordpress and Wix. These aren't what I'm on about. They're a quick path to putting up some content, but they don't give you full control over the website - you're limited to what the platform offers as far as post format and organization and can't use it to do things outside the box of what they're meant for. (You actually can self-host Wordpress; I'm just talking about the hosted service that gets advertised.)

=> Wix review

This guide is gonna be about "the real way" which has the following benefits:

• Flexibility. You can do anything with a server you control, not just things the platform supports. You can host downloads, run a Tor node or a Mumble server or your own email domain.

• Independence. If your website is built on a platform like the above, migrating off it can be difficult. You can probably export all your text content, but putting your website back up with a different solution would take a lot of manual work and it'd probably never be the same. If you manage your website yourself like I do, you could set it up on a new server in an hour. I even scripted my install process so I wouldn't have to do hardly anything. That's impossible with a hosted platform.

So what I'm getting at here is, the quick and easy path leads to the dark side :P

Components of a website

You will need:

• A domain name - the part like yujiri.xyz. Getting one of these costs money, but barely (I get mine for like $10/year).

=> Wonderful explanation of the Domain Name System

• A computer to act as a server. It's actually possible to just use a home computer for this, but not necessarily a good idea because it means your website goes down whenever your internet does, or whenever your computer is powered off, etc. It may also require messing with your home router, which you may not even be able to do if you live in a house you don't own. The easiest way to get a server that avoids these problems is to rent one from a service like Linode. This also costs very little (I get mine for $5/month). Note that these don't give you a Remote Desktop Connection-like interface to your server (although I'm sure there are ways to set up something like that), only SSH access. If you don't know what that is but aren't scared off by it, you can learn a lot about how to use it from the Ubuntu command-line tutorial - the server will usually be running Linux. Be aware that you can use SSH from Windows with PuTTY.

=> Ubuntu command-line tutorial | PuTTY

• A web server program to run on the serving computer. I use Nginx for this; its configuration is very simple (you can do with mostly default settings) yet flexible enough for almost any use case.

=> Nginx documentation

• Content.

Something that's not required but recommended is an HTTPS certificate, so users can connect to your site securely without seeing a scary warning message. (Sites without HTTPS support are also penalized in search results.) These used to be expensive, but nowadays you can get one for free using a tool like acme.sh.

=> HTTPS | acme.sh

Content

It's possible to just write a plain text file and have Nginx or another web server program serve it. That wouldn't be very interesting though, because plain text doesn't allow for any kind of markup such as headings, italics, and clickable links. For real web content, there are three core technologies involved:

• HTML (HyperText Markup Language) is what the actual content of web pages is written in. HTML is pretty easy to learn, especially since you only need to know a small subset of it.

=> HTMLDog tutorial

• CSS (Cascading Style Sheets) is how the style or appearance of a page is defined. CSS isn't something you write regularly though; for a blog you probably just need one CSS file that's used on every page. CSS is also not strictly necessary, it's just that the default styles for web pages are pretty ugly.

=> HTMLDog CSS tutorial

• Javascript is the programming language used to give pages dynamic behavior, like popup ads, animated scrolling that hijacks your control and gives you a bad day, or infinite scrolling feeds that addict you and refresh at random times making you lose your place. You don't need any Javascript unless you're making an interactive web application (and even then you might not need it). It's also just a terrible programming language; more full of confusing and tricky bits than almost any other. But if you insist on learning it, HTMLDog has a tutorial on it too.

That's all the ingredients to a website! If you're following this and get stuck, feel free to ask me.