How to Make a Website

So you want to know how to make a website. Where do you begin? This article walks you through the basic steps:

1. Making your Web pages
2. Designing your website, and
3. Getting your website online.

Making your Web pages

Your website will probably contain several Web pages, linked together. A Web page is similar to a printed page, in that it can contain text and images. However there are some important differences between a Web page and a printed page.

For one thing, a Web page can be of any length, from just a few words to several screenfuls of content. To view a long Web page, you simply scroll down in your browser.

A Web page can also contain links to other Web pages and websites. This ability to link to other content really makes the Web useful.

So how do you make Web pages? Read on…

Understanding HTML

Web pages are created using a language called HTML. HTML is easy to learn. An HTML Web page consists of the page’s text surrounded by various tags for structuring and formatting the page. For example, to create a paragraph of text you surround the text with <p> and </p> tags:

<p>Here is a paragraph of text.</p>

You can create your HTML Web pages using any plain text editor, such as the free WordPad on Windows (Start menu > All Programs > Accessories > WordPad) and TextEdit on Mac (Applications > TextEdit). Just open up the editor, type your text and HTML tags, then save the file with a .html extension (for example, mypage.html). You can then double-click the file to view the resulting page in your Web browser.

If you’re new to HTML then start with our basic HTML tutorial.

What if you don’t want to learn HTML?

HTML is fairly simple, and it’s a good idea to learn at least a few basic tags. However if you don’t fancy building your Web pages by typing HTML by hand then there are some good alternatives:

• You can use a WYSIWYG (What You See Is What You Get) Web page editor. This is software that you run on your computer. It lets you create Web pages by entering or pasting text and inserting images, much like using a word processor. There are many WYSIWYG editors available. At the high end there are applications such as Adobe Dreamweaver and Microsoft Expression Web. RapidWeaver and iWeb are also options if you use a Mac. Good free editors include KompoZer and Amaya.
• You can use a content management system (CMS). Many Web hosting packages come with a CMS that lets you enter your Web page content via your Web browser. Typically this involves using a browser-based rich text editor (which works like a simple word processor).
• You can create a blog. Blogs are specialised content management systems that are very easy to use. Find out more in How to Start a Blog.

Designing your website

At some point you’ll probably want to add graphical elements to your website, whether it’s a few holiday snaps, a logo, or a complete page design. To do this, you’ll need a graphics editor to create the graphics, and ideally some knowledge of CSS to style your pages.

Creating Web graphics

To create graphics and manipulate photos you need to use an image editor of some sort. These let you open or create images, adjust them as much as you like, then save them out in a format suitable for including in your website.

Popular image editors include:

• Adobe Photoshop (and the more affordable Photoshop Elements)
• Adobe Fireworks
• GIMP (free — strange name but it does a good job!)
• Various free browser-based editors such as Splashup and Aviary.

Once you’ve created your images you can insert them into your Web pages — either using your chosen WYSIWYG editor, or by adding HTML img tags (find out more on working with images and HTML).

Using CSS to style your pages

As well as adding images to your website, you can style your Web pages using CSS (Cascading Style Sheets). Like HTML, CSS is an easy-to-learn language. You can use CSS to lay out pages; style images and text; build navigation menus, and so on.

If you’re coding your HTML by hand then you can easily add CSS to style your pages. Typically you do this by creating a separate .css file to store your styles.

If you’re making a website using a WYSIWYG editor then it will handle much of the CSS styling for you. However, for best results it helps to learn at least a little CSS.

To find out more about using CSS, start with our CSS introduction, then have a look at our other CSS articles.

Getting your website online

Once you’ve made your website, you’ll want to put it on the Web so that others can see it. This involves signing up with a Web hosting company, then uploading your Web pages and other files to the company’s Web server.

Finding a Web hosting service

There are thousands of Web hosting companies out there. How do you choose the right one for you? Try reading our Choosing a Web Hosting Service article to help you decide.

If you want to have a domain name for your website — such as www.example.com — then take a look at How to Set Up Your Own Domain Name.

Uploading your website

Once you’ve signed up for a Web hosting account it’s time to upload your website’s files. Find out how to get going with your hosting service, as well as how to upload files, in Getting Started with Your Web Hosting Service.

Now you’ve made your website, and put it on the Web for all to see. Congratulations!