icubesire

revenuehits

Search in Desigs Guru

Thursday, March 11, 2010

Use a Web Page Editor to Build a Website

Use a Web Page Editor to Build a Website

What is a web page editor?

A web page editor is a program you use to build your web site, and put it on the internet. Using a web page editor gives you complete control over your website, but it takes more learning and work than using WordPress.

You will need any one of these four web page editors: (If you have Office, you may already have one of them.)

  • Microsoft Expression Web: A modern web page editor that comes with Microsoft Office 2007 or later.
  • Microsoft Frontpage: An old web page editor that comes with some earlier versions of Microsoft Office.
  • Adobe Dreamweaver: The best web page editor available. Get the 30-Day Trial Version (345MB) (Click the link. Hover over "Dreamweaver CS4", and click "Try". You'll then need to register.)
  • Trellian WebPage: The only decent free web page editor. Get it (7MB)

Setting up a website - Basic instructions

Load up your web page editor. Ignore any "introduction" screens that pop up and try to help you.

Creating a whole new site isn't easy, so I've made a "template" site for you. It's a simple pre-made website, that you can easily change. You can alter the design and layout of the site later, when you're more proficient with your web page editor.

Download the template unzip it to a folder on your computer.

To make a basic website, and publish it to the internet, all you need to do is follow these two basic steps, in this chart.


DREAMWEAVER EXPRESSION WEB / FRONTPAGE TRELLIAN

Open the template

Click Site > New Site.
Click the Advanced tab.
Site Name: Type any name here.
Local Root Folder: Click the little folder icon. Find the folder you unzipped the template to. (In some versions of Windows, you'll need to go into the folder, and choose the images folder instead. It's a bug.)
Click Select.
HTTP Address: Type your domain name in here (e.g. http://www.bobsbakery.com)

Click Remote Info.
Click Access, and choose FTP.

FTP Host: ftp.bobsbakery.com
Login/Password: You chose these when you paid. Type them in here.

Tick Use Passive FTP.
Click Test. If the test fails, click Live Chat on the FatCow website.
Click OK.

(In Frontpage, click View > Folders.)

Click File > Open Site ("Open Web" in Frontpage).

Find the folder you unzipped the template to, and click Open.

Click View > Site Explorer, to see a list of files. This is where the pages you make will appear. If Site Explorer doesn't work at first, just type a directory in the box at the top (like C:\ or D:\)

Look around in the Site Explorer, until you find the folder you unzipped the template to.

Put your website on the internet

(or update it with changes you've made.)

Go to Live Chat (on FatCow website), if something goes wrong.

In the Files window, click the "Site -" folder at the top (or just one file), and click the little "Put Files" arrow.

Click File > Publish Site.
Choose FTP.

Remote Website Location: type in ftp.yourdomain.com (e.g. ftp.bobsbakery.com)

Click OK.

Username, Password: You chose these when you paid. Type them in.

Click the Publish Website button.

Frontpage: File > Publish Web/Site. ftp://yourusernamehere.fatcow.com
OK. Type in your FatCow username and password. Publish, wait.

Click the big red X, then Publish.

Click Connect.

FTP site name: Type in "FatCow".
Hostname: ftp.yourdomain.com (e.g. ftp.bobsbakery.com)
Port: Leave blank.
Username, Password: You chose these when you paid. Type them in.
Tick "Use Passive Mode".
Click Connect.

Select one or more files in the left hand window, then click the little green arrow, to upload them.

Congratulations! Your site is now online. Use your browser to visit your site, at whateveryourdomainnameis.com

If you visit your site, and it doesn't work, then your domain name is probably still "propagating". Your internet company doesn't know it exists yet. Propagation will likely take a number of hours. In the meantime, you can visit your site at yourusername.fatcow.com (replace yourusername with the user name you chose when signing up with FatCow.)

Customise your website

So far, you've just uploaded the template site, without alterting it.

You can easily change the text on the pages of your website. Just double-click one of your site's files, to open it.

This second chart is a list of things you'll likely want to do.


DREAMWEAVER EXPRESSION WEB / FRONTPAGE TRELLIAN

Insert a picture

Resize images to the desired size (in any image editor) first.

Drag it in. Click Yes if it asks to copy the file in.
(Or click Insert > Image.)
Just drag it in.
(Or click Insert > Picture > From File.)
Click Insert > Image.

Make bigger text

Select some text.
In the Properties window, click the Format drop-down list, and choose Heading 1 or Heading 2. You should only use one Heading 1 per page.

Select some text.
Click the drop-down list that says "Paragraph" (in Frontpage it will say "Normal"), and choose Heading 1 or Heading 2. You should only use one Heading 1 per page.
Select some text.
Click Home, then click the drop-down list that says "Normal", and choose Heading 1 or Heading 2. You should only use one Heading 1 per page.

Make a link

Select some text. Right-click it, and click Make Link.
Choose a page to link to, or type in a website.
Select some text. Right-click it, and click Hyperlink.
Choose a page to link to, or type in a website.
Select some text. Right-click it, and click Create Link.
Type in a website address, or click "..." and choose a page of your site.

Add an email link

In the Insert window, click Email Link. Just type it in. Just type it in.

Open your site

(if it goes away.)
Click the little drop-down box at the top of the Files window, and choose your site. Click File > Recent Sites.
Then click on your site.
Double-click one of your site's files, in the Site Explorer window.

Create a new page

(The best way to do this is by duplicating an existing page.)

Click on a file in the Files window.

Press Ctrl+C. (Cut)

Press Ctrl V. (Paste)

In the Folder List, right-click a file.

Click Copy.

Right-click again.

Click Paste.

Open a page.

Click the big red X.

Click Save As.

Type in a different name, and press Save.

Rename a page

Don't rename index.html

First, close the page (if it's open), by clicking the little X at the top.

Click it twice, in the Files window.

First, close the page (if it's open), by clicking the little X at the top.

Click it twice, in the Folder List.

First, close the page (if it's open), by clicking the little X at the top.

In the Site Explorer, right-click the file. Click Rename.

Edit the title or menu

Open the layout.dwt file, in the Templates folder.

All your pages use this template. When you change it, every page will change accordingly. (This setup saves you having to make the same change on every page of your site.)

Open the layout.dwt file, in the Templates folder.

All your pages use this template. When you change it, every page will change accordingly. (This setup saves you having to make the same change on every page of your site.)

Open the layout.dwt file, in the Templates folder.

All your pages use this template. When you change it, every page will change accordingly. (This setup saves you having to make the same change on every page of your site.)

Change colours or layout

(This is optional.) All layout information is in the "CSS" file.

Double-click one of the styles in the CSS Styles window.

You can look in the css.css file to see or edit the CSS code if you like.

In the Apply Styles window, right-click one of the styles, and click Modify Style.

(Frontpage: Format > Style. Click the "List" box. Choose User-defined Styles. Click a style. Click Modify. Then click Format, then anything.)

You can look in the css.css file to see or edit the CSS code if you like.

Open the css.css file.

The End

You've reached the end of the two steps to getting a website onto the internet. However, there are lots of extra things you can do, to make your new website a success. Read about them in the

If you've just been reading through this guide, and you feel like you're now ready to start creating your own website, then to sign up for web hosting and a domain name. Then come back here.

No comments:

Post a Comment

Thanks

LinkWithin

Related Posts Plugin for WordPress, Blogger...