How do I make a website?

Back to AH | Back to FAQ | Adriennewolter.com

This is the all-time #1 question I get from people who visit my sites. I'm going to attempt to explain it. This section of my site will be changed as I see fit, giving new advice and whatnot.

Do not take this tutorial or any parts of it for your own site. If you wish to link to it, put this code in your page:

<a href="http://www.dickinson.edu/~woltera/hogwarts/faq-makesite.htm">How to build your own site</a>

I appreciate you linking this page if you used the tutorial yourself, and you can also link if you don't want to have to write out your own tutorial for your site.

1: Need to Know

Before you start your site, you need to make sure you are familar with some web design terms and some HTML, so that if you see something mentioned, you know at least a little bit about what it means. If you see FTP mentioned, for example, and make a questioning face, you're a bit behind in the website designing world.

Here is a brief list of terms and what they mean:

Anchor - a part of a page that you can get to by clicking a link somewhere else on a page; the numbered titles of sections on this page are made into anchors, so when you click the link for each one at the top, it takes you there.

Domain - the url of your site if it is a .net, .org, .com, .tk, .nu, .whatever address.

Download - to copy something off the internet.

FTP program - file transfer software, either by itself or web-based, that allows you to put things on your site or take stuff down.

'Goodie' - A free bit of a site that you can put on your own site (such as a counter, stats tracker, guestbook, quiz, etc.)

Host - a site/server that will keep your site on it.

HTML - Abbreviation of HyperText Markup Language, this is the 'language of the net'.

Subdomain - the url of your site if it's a secondary domain. An example would be http://somebody.adriennewolter.com/ ... the italicized bit is the subdomain.

Table - a group of cells that organize text on your page.

Upload - to add something to the web via FTP.

HTML is the language of the internet... that is, behind-the-scenes code that your computer reads and turns into colors, text, fonts, sizes, pictures, and pages. You should be familar with HTML before you begin building a site so that you know what you're doing.

Some simple, common HTML codes are....

TEXT - makes text italic

TEXT - makes text bold

<s>TEXT</s> - makes text ~~crossed-out~~ [strike-out]

TEXT - makes text underlined

TEXT - makes text larger or smaller (replace # with a number; I used 5 for the larger and 1 for the smaller)

- Line break

- single line break

<hr> - horizontal rule (a divider)

<a href="URL">LABEL</a> - A link.

<a href="URL" target="_blank">LABEL</a> - A link that opens in a new window.

<img scr="IMAGEURL"> - An image...

<img scr="IMAGEURL" width="#" height="#"> - An image with the size fixed.

<img scr="IMAGEURL" border="#"> - An image that will have a border based on the number you put. Zero puts no border, which works the best most of the time.
(no border) (with border of 10)

<table width="10" border="1"><tr><td>TEXT</td></tr></table> - Simple, one-celled table.

<a name="ACHORNAME">TEXT</a> - an anchor; put the name of the anchor between the quotes, and the text you want anchored where it says text. To make the link to the anchor, use a normal link html snippet and make the url "#ANCHORNAME".

TEXT - choose font; some examples are Arial, Verdana, Comic Sans MS, or Tahoma; keep in mind not all computers have the same fonts as you.

TEXT - Makes text different colors; some examples are red, blue, green, and yellow.

Keep in mind that these can be combined. If you want big, bold, red text in Arial, for example....
TEXT - TEXT
If you can identify the pieces of the HTML above, and know what they do, you're off to a good start.

2: Idea

Finally, we're at the start of your site. You know some HTML, you've fiddled with it, now what?

First thing's first, you need to decide what your site will be about, and start gathering ideas for some content. What is the purpose of your site? If you've never made a page before, I recommend starting with a homepage. A homepage just tells who you are and what you like. An example could be a four-page site; an index (main page), an about you page, a page with your pets, friends, and family, and a links page. You could gradually add pages once you become more familar with HTML... such as a favorite quotes page or a page about your recent school projects.

For your first page, you may want to use an editor available somewhere. I use a program called Macromedia Dreamweaver (it's maybe $350-400, still in "only one birthday present this year" range), but there are plenty of web-based ones out there. I know Geocities has one, although I don't know about how good it is. Most free homepage servers have them. If you are working professionally, however, you'll want to invest in a program for your computer; they can go from maybe $40 to a couple hundred; Macromedia Dreamweaver is the best I've seen and used, but that's my preference.

Once you become familar with HTML, you can build your own pages by hand (in a matter of speaking), regardless of whether you have an editor or not. If you see something you like on someone else's website, make it a habit to go to view > source in the menu of your browser. Do not copy, however - use what you learn to invent your own method.

When coming up with the purpose of your site, you need to keep several things in mind. How much time do you have to update it? Do you really want to spend hours a day staring at black and white text and making pages? Who is your audience? How familar are you with HTML? What will you put on your site? How will you keep visitors interested (if it's the type of site you want people revisiting)? What is the purpose of your site?

3: Construction

You first need to build the main page. Open some text editor (such as NotePad, which comes with Windows; if your page will be pretty long, you may want to use WordPad). So that the url's shorter, name it index.htm.

Start your page by copying the following into your text editor:

<html>
<head>
<title>TITLE</title>
</head>
<body bgcolor="#FFFFFF" text="#000000" link="#0000FF" vlink="#9900FF" alink="#FF0000">
TEXT
</body>
</html>

This is the basis of a page; every page you make needs this. I'll explain the pieces so that you are familar with them.

<html> indicates that the page is a webpage. </html> closes this.

<head> indicates where the browsing information is. Usually the only thing put here is the page title.

Between the <title> tags, put the name of your page. It will be on the line at the very top of your browser. This page's title is "Adrienne's Hogwarts - How to build your own site". HTML does not work in the title.

The <body bgcolor="#FFFFFF"....> tag tells the browser about what colors the page will be. the bgcolor="#FFFFFF" section tells the browser to make the background white (that's the color that #FFFFFF is; you could just type white in there too). Text="#000000" obviously means the text color is black. link is the color of normal links; vlink is visited links, that is, links that the viewer has already been to. Alink is active link, the color of the link between the time they click it and the time the next page loads.

Where I have put 'TEXT' is the only place you can put the stuff you want on your page. If you put it anywhere else, the page will mess up. HTML is allowed there. You can space it out while writing it so that you can find things easier, but keep in mind if you want a line break to show, you need p codes (scroll up a bit to see them).

Once you've made your first page, stop, and read on.

4: Hosting

There are a lot of sites out there which provide free hosting. Some are Geocities, Angelfire, Expage, and Tripod. Some are better than others, some have different systems for ads, some have more space than others, some have 'goodies' or 'freebies' along with them. You should look at each place's free account information before choosing which to host your site on. Also, do a Google search for other free hosts... there are tons out there!

Once you've decided on one, upload your page to test it. If it works, good job! If it doesn't, go back and find the mistake. Maybe you didn't close a tag, or put text where you didn't want it.

Once you've got that, go back and make your next page... maybe an 'about me' page or a page about your pets. Be original and creative!

5: Content

Content is the backbone of your site; what you have on your webpage determines whether or not people will enjoy your page or even come back to it at a later date.

What is content, exactly? Well, it's basically just what you provide for others to see on your site, such as information or a how-to. If you want repeat visitors, you'll want to add something that is updated at regular intervals, like a newsletter or a gallery of images you've made. If you provide your own content that was made by you and is interesting, people will often bookmark and revisit your site. Welcome suggestions and constructive critism; what you may think is 'cool' might really be annoying to others, and another opinion is very helpful.

Beginners often start by putting a page of their favorite images that they nicked off sites on the web. That's ok, if the images are public domain. Public domain is things that clearly aren't copyrighted to someone or that the creator of them says clearly that they are public domain. At the same time, public domain often consists of things people have seen a million times before, so you'll want to be original. Remember that putting something copyrighted on your page without permission and/or credit is illegal. You can be punished for what you put on the web.

So, what else can you do? Start off with just some things that interest you, to practice your HTML... such as an 'about me' page, or a favorite quotes section. Once you start getting visitors, the content they'd really like is up to you; no one can really tell you what people will like to see on your page. If you are original and update fairly frequently (once or twice a week is fine), you will get repeat visitors.

6: 'Goodies'

Goodies are pieces of sites that other sites offer to host for you. For example, a guestbook is a 'goodie'. There are a lot of different 'goodies', including weblogs, guestbooks, minipolls, and counters... but finding ones that work well is often hard to do.

As I can't really ramble this one out too much, let me put it as this: don't choose a host just because they have certain 'goodies' available. Often, sites which offer their own free guestbooks (for example, Geocities and Expage) have really primitive and in all means stupid services for them. Using sites that specialize in them is a good idea. (Just remember that 'goodies' will never make up all of the content, but they can be added to it.)

So, here are some free services I've found....

Guestbooks
Signmyguestbook

Counters/Stats Trackers
Nedstat Basic

Minipolls
Bravenet
Alxnet
Lycos Html Gear

Message Boards
Boards2go
EZboard
Proboards

Mailinglists
NotifyList

Weblogs/Journals
Pitas
Diaryland
Xanga

Password Protection
Bravenet
HostedScripts

Web Forms
Response-O-Matic
Bravenet
HostedScripts

7: Visitors

Done with your site and want some folks to see? Well, before you go and spam people about it, do a few things that will get your site noticed.

1) Make sure you have meta tags on your site. This is the easiest way for search engines to find you. Even if you submit to them, they'll only find you if you have meta tags. Search on Google for instructions.

2) Get out there! Look at others' sites and sign their guestbooks! Leave your link, but don't ask them to visit your site... many people find that annoying and won't visit.

3) Tell your buddies. If they think your site is cool, they may pass the word on.

4) Update your site constantly, or at least on a regular basis. People are more likely to return if they know that the site will change occasionally.

5) Get a mailinglist and don't spam with it. Mail people when you make major changes to your site.

6) Be friendly. If you act like a jerk while advertising your site, people will dislike you.

7) Make your site interesting! People will want to come back if they like your site.

8) Provide lots of original content, and give people an HTML snippet to link back with.

9) Make graphics or layouts and allow people to adopt or use them. If others like the things, they'll want one too.

10) Be patient! You won't be getting a few hundred visits a week when you first start out. It may take months for people to notice your site (the WWW is big, after all), but if people like it, that's great!

8: Resources

Here are some awesome web design resources....

Google (The king. Need I say more?)

Lissa Explains (All about HTML and other things for your site.)

Funky-Chickens (More HTML. Very good site.)

9: Example

One of the content suggestions for repeat visitors was a newsletter. Let's follow that idea....

Let's say this: I decide to publish a newsletter once a month, with a few pages worth of articles on anything and everything, from local activities, to highlights of things on the internet. Now, where to start? Well, I decide what I want in my newsletter first, and list it. Here's my list....
1 cover story
1 memoir-type thing
2 calendars
1 site review
1 mailbag page
1 page advertisements
1 'suggestions welcome' page

Yes. Short, simple, not very detailed. I didn't even have to have so much detail, but I jotted down my thoughts anyway.

Alrighty. I think I'll write the information first.

----

Ok, done. Wrote up the information. Am now making the pages... I think I'll have my layout in sections with tabs on the left (and color-coded sections).

----

Got that. It's all done now, and I am going to go promote it on Adriennewolter.com, hehe. The whole newsletter took about a week to make. I think I'll do it once a month. If yer interested in it, it's called the Monthly [In]Sanity Check. :D

It's hosted on my domain, Adriennewolter.com, but you could probably get by just as easily posting your own website on Geocities or one of the other hosts I mentioned. I didn't use any 'goodies' (nobody says you have to!), and I so have a minute amount of visual aid. It's a piece of content, and I'm [hopefully] getting visitors by posting the url in some various places.