Techdude's
Claris Home Page
Tutorial

Return to Techdude's AMAZING links for budding web designers.

Introduction

When Claris Home Page 1.0 first appeared on the market in 1995 it was the most powerful tool of its kind for developing web pages without having to learn HTML code. Since that time, more powerful (and expensive) programs like GoLive Cyberstudio and Dreamwaver have appeared, but Claris Home Page remains the ideal choice for modest to advanced web development because of its price, intuitive interface and full range of features.

There are several main features of Claris Home Page that make it extremely powerful and easy to use.

Contextual Object Editor. Double clicking on any graphic, table or rule opens a dialogue box called the object editor which shows the attributes of the object which is selected. As other objects on the page are clicked on and are selected (graphics, tables or rules), the object editor displays the settings of each item as you click on it.

Verify Links and References can check all of the links on your pages for errors in the link relationships within your web pages.

The Link Editor allows you to set the attributes of a link and allows you to select local files for linking by browsing your hard disk. The Link Editor also keeps a list of recent files and urls you have linked to like a history.

Preview in Browser allows viewing exactly what your pages will look like on the web as you develop them. Is saves the current page and then opens the page in your web browser.

Consolidate Command: If you have selected graphics for your web pages from several places on your hard disk, the consolidate command can move copies of all of them to the main folder of your web preparation folder prior to uploading them to the web server.

Document Statistics keeps track of the size of the page you are working on and how many seconds it will take for a user to download it from the web server.

Drag and Drop pictures, text and files: On a Macintosh, you can drag and drop pictures and text onto your web page from any application that supports drag and drop. Examples of drag and drop applications include Clarisworks the Finder and the Scrapbook.

Picture Object Editor, which can interlace GIFs, make portions of a GIF image transparent, and create clickable image maps which can make specific areas of an image link to files or urls.

Libraries feature: keeps regularly used bits of formatted text, tables, html code, urls, graphics, animations, buttons etc. in a tabbed repository that functions much like the Mac Scrapbook. Drag and drop these items into your pages as needed.

Built in FTP Client: You can upload your files to the web server right from within Claris Home Page.

Setting up Claris Home Page For Your Work Environment

Always begin a web project by creating an outline of your ideas and possibly a flow chart if you plan to have more than a few pages in your project.

It is a good idea to create or choose a folder to hold all the web pages, graphics, etc. that will comprise your site before you actually begin building. In order for your web site to work perfectly on the net, you must first create and test it on your local hard drive. Keeping everything in one folder ensures that when you move your site to a web server, it will function exactly as it did on your hard drive.

To begin a web page, open Claris Home Page and if it does not open a new blank page, choose New Page from the file menu to open one.

Now that you have a blank page in front of you, the very first thing you should do is open the Preferences under the Edit menu and uncheck the box labeled "warn about unsafe filenames when saving files". Otherwise, you will get a warning box everytime you save a file with .html in the file name. Once you have done this close preferences by clicking on ok.

Note: Most web page file names on the internet end with the extension .html except the web pages which reside on NT and Windows web servers, which usually end with .htm instead. Ask your web server administrator which type of server you have.

Now do this; click on the little button in the button bar that looks like a blank sheet of paper, the Document Options button . A dialogue box will appear that will allow you to set the default options for your new page.

You can set colors for text, links, backround color and even choose an image to tile in the background from the Appearance tab of Document Options. In most cases it is best to leave the text and link settings as they are, which are the default settings for most pages on the internet. You don't need to change them unless you need them to somehow fit in better with your intended color scheme.

Next click on the Parameters tab of the Document Options box and enter a title for your new page.

 

The title is what will appear at the top of your page when it is displayed in a web browser. The rest of the options in the Document Options box are for advanced users, so you can now close document options by clicking OK and select save from the file menu to save your new blank page. If this is going to be the main page of your website, I suggest you name the file index.htm if the server you are uploading to is an NT machine and index.html if you will be uploading to a UNIX or Mac server.

This is because you can then shorten your url to just the name of the directory on the web server your files reside in eg: http://www.myserver.com/design instead of the longer http://www.myserver.com/design/mydesign.html. A web server is set so that when a browser references the design directory, it should automatically send the default file for the design directory: index.html

Note: On some web servers the default filename for a web directory is default.html or even home.html instead of index.html You web server administrator will be able to advise you which is correct for the web server you are using. 90% of the time the default file name will be index.html

Make sure you save your page to the folder you have already selected for your web pages(s). From now on whenever you save your web page it will be saved to this folder and also any images you drag and drop on to your page will also be automatically saved to this folder.

Next, it is a good idea to test the browser preview feature of Claris Home Page to make sure that you will be able to see exactly what your pages will look like on the web as you develop them. click on the Preview in Browser button and select your browser (Firefox or Explorer), if it is in the menu which appears.

If your browser is not in the drop down menu which appears, or your chosen browser does not open with a blank page, you must open Preferences under the Edit menu and use the browse feature to locate your web browser on your computers's hard disk.

 

Select one or more web browsers to preview your pages with and then select OK to close preferences and try the Browser Preview button again.

 

Note: Although both Mozilla, Firefox and Internet Explorer are supposed to adhere to published HTML standards, you will find that in some cases your pages will appear very differently in the these two browsers. It is a good idea to check your final pages in both browsers

This completes the setup of your Claris Home Page work environment. To continue, got to the second tutorial Formatting Text

Return to Techdude's AMAZING links for budding web designers.

 

For Quality Electric Scooter Batteries, please visit our sponsor scooterbatteries.net:

Our Newest Strategic Partners:

Tutor New Orleans

Buy a Portable Solar Array for Less

Live Music and Culture Streaming video from New Orleans

Free Graphics and Video Editing Software