First Steps to Building a Website

April 5, 2014 by Keilan

When the idea to start a website first pops into someone's head, the initial thought is that they have no idea how to even begin. I know, because that was me - about two weeks ago. So if you're reading this hoping for a step-by-step guide from a wise sage, hardened by years of battle against the storms of changing web standards and wielding a unix command line as a weapon so familiar it has become part of him, you should hit back and continue surfing the google results that brought you here, because I am not that sage. But I hope to offer something that sage can't - the perspective of a beginner. Many of the tutorials I looked at while making my site presented steps as if they were simple, when in reality there were dozens of steps needed to make them possible.

The reason I had so much trouble, is that I fell into the demographic of a tech-savvy individual who wanted to swim in the deep end, but had never even practiced wading through the kiddy pool. For many users, they don't want customizability, and if they never have to even think of things like PHP or JavaScript, they consider it a victory. If you are one of those users, then you should click here and give WordPress a shot - I kept a blog there for over a year and everything worked smoothly. But then I wanted something more than a blog - there are other more powerful tools for website creation such as Joomla or Drupal, and while those are valuable tools, they still didn't give me the control that I wanted.

So if you are like me, and want to get into the dirty work of web design, then I'm hoping this post can give you a bit of a head start. Now, I'm also going to abbreviate some of the steps - this is a road map, not an algorithm. But it will give you enough to dig in, and finish the day with JavaScript stains on your shirt and CSS under your fingernails (going back to my getting dirty metaphor). So here is my list of steps to take, and roughly what they mean.

1. Learn HTML - I used this tutorial. The advantage of HTML is that it is easy to play around with. Create a file called "mysite.html", use what you learn in the tutorial and open it with your browser. No hassle. HTML is used to display the content on your page (and not the way it looks! Color, alignment, general prettiness comes later). Don't worry about anything really complicated - just picture a simple site and work with HTML until you can build it - you can learn the complicated stuff later.
2. Now learn CSS - There is a good tutorial from the same site. CSS is used to control how your page looks. I've found it is best to keep HTML and CSS separate. So at the top of your HTML file, you have a line like <link href="styles.css" rel="stylesheet"> which specifies how things look. So remember, HTML tells the website what to display, and CSS tells it how it should look.
3. Register a domain. Once you have HTML and CSS you can make some simple pages. Start with a home page with no fancy graphics, just an explanation of what your site is. That is enough to get online. First you need to register a domain - that is the step where you get a web address (like scholtek.com) that only you can use. Registration is the part where I pay a fee (around $10 a year) to tell the world that an address is mine.
4. Find a host. This was one of the hardest steps for me - there are so many hosts and I find it hard to pick between them. I ended up choosing HostGator because of low prices and great reviews (so far I am happy with them). The host is the company that actually puts your website online. So they have some room on a server that you can put files on and a way to connect them to your domain name. So when you type scholtek.com, that points to a server owned by HostGator, which gives you the files that I write and upload. Connecting your address to your host is easy, but varies depending on which company you use, try googling for instructions.

That should be enough to get you started. In the future, I'll write a detailed posts on each of these 4 steps and hopefully talk about some more cool stuff like PHP and JavaScript. Happy building!