When you’re new to website building, web design can be a very intimidation process.

Heck, even if you’ve been around awhile it still can be intimidating if design is not your forté.

So here are some tips for getting off on the right track when designing your first site.

Tip 1 – Familiarize Yourself With a Web Editor

There are many different editors out there. They all have their pluses and minuses so it’s important to find what works best for you.

Just make sure you learn to use something. It will make your life easier, trust me.

If you’re on a budget, Nvu or CoffeeCup may be a good choice. Nvu is free and recommended by many newbie Webmasters.

CoffeeCup is not free ($50), but comes with some awesome templates. There’s even a free, 45-day trial.

If you don’t mind splurging on some really good software, I recommend Dreamweaver. I recently switched to this program after FrontPage started phasing out.

With a price tag of $400 I’m sure you’re wondering what it possibly does. My short answer to that is everything. And while I don’t use half of the features this powerful program provides, I like DW because it’s great for people of all levels.

If you’re a beginner and just want to learn the basics of creating a page, you can use DW for the basic HTML commands.

But if you want to take it to the next level and learn more about CSS (see Tip #2), XML and other Web languages, DW will support those too.

There are also a lot of customizable features in Dreamweaver, so you can set it up so your favorite commands are easily accessible.

Whatever editor you decide use, buy a book or use your favorite search engine to find a tutorial that will help you get familiar with the program.

You don’t have to learn every menu function or feature, but you do want to learn the basics such as creating links, bolding text, starting new paragraphs, etc. There are some great free online tutorials for almost every popular editor out there.

Tip 2 – Learn The Basics of CSS

CSS stands for Cascading Style Sheets, and it’s basically a sheet of attributes that assigns various styles to your website. Don’t let the acronym scare you. It’s pretty easy to learn and a very handy function if you just learn the basics.

One style sheet can govern how your entire site is designed while giving it a cohesive, consistent look.

For example, you can declare your sitewide font style, font size, hyperlink colors, background color, table design, etc. all with one file.

That means if you ever want to change the look of your site, you just edit the style sheet instead of opening every page and changing the HTML code directly. What a huge timesaver, especially if you have a large site.

The best way to learn CSS is to find a site template that already has a style sheet attached. For example, I bought my site’s template from dreamweaver-templates.net and there was a style sheet included.

I’ve learned a lot just by changing colors, sizes, etc. to see how they affect my site’s layout and design.

Dreamweaver also has a function called CSS Layouts that will help you learn more about CSS and apply it to your site.

You can also go to W3Schools if you want to learn the basic CSS attributes and creating a style sheet from scratch. There are some good tutorials there.

Tip 3 – Find a Design Template

As I just mentioned, I bought my template from dreamweaver-templates.net, but there are many other sites that offer templates, some even for free. FreeCSSTemplates.org has some free ones you can download.

I would highly recommend you choose a template that includes CSS, unless you plan to create your own style sheet from scratch. Again, if you use Dreamweaver then this is pretty easy to do.

Once you’ve found a template you’d like to use, open it up in the editor you’ve chosen. Always save a backup copy of the template in case you want to start over.

Most templates only come with the index page (the homepage) so if you want additional pages simply “Save As” from the homepage to create new pages.

I’ve created a basic 3 column CSS template you can download to learn how to design a web page.

Tip 4 – Learn Basic File Management

Websites are basically a series of files organized on a server. Whatever Web editor you use, you should organize your website files so they are easy to find and manage.

Don’t just throw all your files in one folder. Organize them into logical sub folders and always store your images in a separate folder.

So, if you have a site about cooking, you may have your main index file (your homepage) and then you’ll have a series of sub folders (i.e. baking, grilling, frying, etc.) And inside those sub folders will be pages that go in those categories.

When you start setting up your site, the sub folders could likely be navigation items on your site.

So before you use your web editor, you need to create a folder on your hard drive where your site will live.

Let’s say you create a folder called CookingWebsite and it resides at…

C:\Documents and Settings\User\CookingWebsite

If you downloaded a template, you want to store/save all the template files inside this folder. And if the template came with an images folder, put the images folder inside this same folder so the path to it would be…

C:\Documents and Settings\User\CoookingWebsite\images

Make sure you keep the template’s file structure the same as when you downloaded it.

So when you open up your Web editor and start a new site, most editors will ask where your site lives locally. You will navigate to this new folder you created and this is where you’ll go to update your site each time.

Keeping your file structure organized will help, especially if you’re using a Web editor. Not only is it easier to find files, but linking the pages and adding images is much easier when everything is organized into folders.

Tip 5 – Learn How to FTP

I know, I know. Another dag-blasted acronym. FTP just stands for file transfer protocol and it’s the process of transferring your files (web pages) from a local environment to your Web server (or your hosting account).

If you’re using a regular web host, you can setup an FTP account at your host’s control panel.

Most web editors will allow you to save your site directly to the web using your FTP username and password. So you simply choose the “Publish Site” command in your editor, and generally you’ll be prompted for your FTP information.

Voila! Your site is live and kickin’.

If you’re not using an editor or your editor does not have a publish feature, you can download a separate FTP program to publish your files to the Web. Filezilla is a good one and it’s free.

Or if you use Firefox, download the FireFTP plugin. You can access it from the Firefox Tools menu and you don’t even have to close your browser to use it.

Tip 6 – Find a Graphic/Image Editing Program

You don’t have to become a full-fledged graphic designer, but it does help to know how to resize and touch up graphics. Gimp is a free image manipulation program you can use to make minor graphic edits.

If you want to create images from scratch Paint Shop Pro and PhotoShop are two popular programs used for this.

I use PhotoShop for all my graphic needs. Yes, it’s pricey, but does everything under the sun (including animation) and I’ll never need to buy another program again.

___________________

So there you have it! Six tips to get you started with your first website. It’s really not that intimidating if you just do it. Becoming comfortable with a web editor and finding a template is half the battle.

Here’s to your first website! (Cheers)