happy little biz

Help, I need a website! Part 1: The Basics

So it's 2014, and you want to build a website for your business. No surprise there - a website is seen as a required part of advertising and communications these days. The vast majority of people will do a google search when looking for a product or service, even if they've received a personal recommendation from someone they know. So having a website is smart business.

But for those of us running a small business - the freelancers, contract workers, tradespeople, artists and local shop owners - this can be a rather tall order. But here's a little secret: it doesn't have to be! Anyone can learn the very basics of web design; enough to be able to understand what you're looking at and how to update your website's content to keep it fresh.

One of the things I do quite a bit of professionally is teach folks how their website works. I build them the site in a way that is simple to update, and then teach them how to make changes to the text, update their blog, or add pictures.

But before I get to that, let's talk a bit about the basics of a website (the simplified version). I think understanding the basic structure of a website is probably good background information for learning how to make changes to your own website.

Code?

Constructing a website = constructing a house

... well, sort of!

There are three basic parts to any website:

  • The structure
  • The style
  • The interactivity

Structure: HTML of a website = Frame of your house

The most basic building block of a website is the structure, which is formed with a type of code called HTML. You can think of it as being like the frame of your house. It has to have certain parts - foundation, support beams, studs, and so on - and these parts determine what the overall layout of the house will be when it is finished. HTML has certain parts as well, which determine how your website layout will look when the site is finished. Will it have a header? Footer? A few different places for text and images? Multiple pages?

Style: CSS of a website = Decorating your house

So now you have this nice sturdy frame, and you want to add your own personality to your house. Decorating includes choosing things like light fixtures and what type of flooring, but also things like paint, artwork, and so on. CSS does this for your website. It determines how all of those structural elements that were set with HTML are going to look in the finished product. Colors, shapes, sizes, fonts: all done with the CSS.

As a bit of an aside, CSS can do a lot of different styling, completely changing the look of a page without changing any of the HTML (structure). To see just how much flexibility there is, visit CSS Zen Garden, a fun website that showcases many different designs where the HTML file has not been changed - only the CSS has (really!). Click on any of the designs in the right sidebar to get a feel for how much you can do with CSS styling.

Interactivity: JavaScript (et al.) = features of your house

So now you have a house that's got a good solid frame and is decorated nicely. And and this point the house is completely liveable. But, maybe you want a nice gas stove. How about central vac? Air conditioning would be great for hot summer days, right?

On a website, you're not installing A/C or new appliances, but you could add features that make the website more appealing to the people who visit it. Maybe you want to have pulldown menus to organize your website better. Maybe a nice photo gallery that scrolls through your photos easily would be good. Or maybe you sell products and having an entire online store is exactly what you're looking for.

All of these sorts of features are built with various other programming languages - primarily JavaScript, but also PHP, Ruby, Python, or other languages. It's not important to know which language is being used for a particular thing (unless you want to become a web developer yourself!), but it's useful to understand that there are one or more languages that are used to add those functions to a website.

So how hard is it to learn these things?

For the complete beginner, learning to update their site's content by editing the HTML files is completely doable. In fact, you may not even need to learn how to write HTML at all; you'll simply need to learn which parts of the page are HTML and which are the text content of your site. It all depends on what kinds of updates you want to make.

Updating the styles (CSS) or interactivity (JavaScript or other languages) requires more knowledge. For the most part, I recommend leaving those items to your web designer/developer.

What about WordPress or other Content Management Systems?

Good question! Yes, WordPress and other CMS are a great way to manage your site, and generally speaking you don't need to know anything about code to use them. Most people, however, find that understanding just a bit about HTML does help when updating page content or writing a blog post.

In future posts, I'll cover some basic HTML, as well as go over some features in WordPress. Stay tuned!