Where to Start With Web Design

Where to Start

What You Need to Make a Web Site

To make a website, it helps to have a few tools on your computer. You don't need to buy anything or pay any money to learn how to make websites. You don't even need a good computer. Just about any computer will work.

You already have the two basic requirements on your computer to make a webpage:
a web browser and a text editor. You may be tempted to use a WYSIWYG editor like Dreamweaver or FrontPage. But learning HTML has many advantages over WYSIWYG programs, and learning HTML is not any more difficult than learning to use one of those editors. The best introductory HTML tutorials can be found at HTMLdog.com. You don't need anything else to get started right away. But a few extra tools will make things easier. The following toolkit will help you out and provide everything you need to create and publish your web site.

A Web Browser
You already have a web browser on your computer. I highly recommend Firefox, the best web browser for developing and viewing web sites. It has extensions that you can download that will help you with making web pages. Download the Web Developer Toolbar for Firefox. The advantage of this extension is that it gives you tools, such as the ability to edit the CSS of a web page in real time while viewing -- and that makes it a great way to learn CSS. That is just one of many things the Web Developer Extension can do.
A Text Editor
You already have one of these on your computer. On Windows it is Notepad. If you are using Linux, you probably have several text editors (try gedit or kate). You need a plain text editor, not a word processor. I recommend using a text editor that is able to highlight HTML code. If you are using Windows and want to use something better than Notepad download HTML Kit, a free HTML editor. If you already have a program like Dreamweaver you can use that. It does a good job of code highlighting but you can get free programs that will do the same thing. I recommend avoiding the WYSIWYG features of programs like Dreamweaver and Microsoft FrontPage. Note: Microsoft FrontPage is an especially bad program for making web pages because it generates terrible code. Dreamweaver generates better code than FrontPage but it often generates bad code also. Well-formed code can be important for good search engine rankings. It is not any more difficult to learn HTML than it is to learn how to use a program like Dreamweaver or FrontPage. Always code by hand as much as possible. Quanta Plus is a good program for Linux and is what I am using now. I don't have a Macintosh and don't know what text editors it comes with. You can get a free HTML/PHP editor for Mac called Taco. I haven't tried it, but it is an option. There is also a list of free HTML editors for various operating systems at thefreecountry.com.
A Graphics Editor
Adobe Photoshop or Macromedia Fireworks are good if you already have them. If you don't have them, try a free graphics editing program called the GIMP (GNU Image Manipulation Program). It is available for Linux, Windows and Mac. See the GIMP section on the Web Graphics page for tutorials and a free book that you can download. You can make professional web graphics with this program, and it's 100% free.
FTP Program
An FTP program allows you to transfer files from your computer to a remote server where your web site is hosted. For Windows, there is a great free FTP Program called FileZilla. For Linux you can use gFTP or KFTPgrabber. A list of free FTP programs that includes some for the Mac can be found at thefreecountry.com.
A Server to Host Your Site
Expect to pay about $60 to $100 per year for paid hosting with MySQL databases, email accounts, etc. No cheap hosting is perfect, but a good option is Site5 Web hosting. Site5 offers a money-back guarantee, as well as unlimited domain names, and free scripts. More details on the Web hosting comparison and reviews page.

After you have the basics of HTML and CSS down, I recommend looking into free PHP/MySQL content management systems. A content management system is a program that makes it easier to develop large, dynamic Web sites.

If you are using Linux, also check out the page about using Linux for Web design and development.