Tutorial

Getting Started

Setting up your web site...

Getting Started with Bella Mia is very easy. Determine the service level that's right for you. Visit the sign-up form, review our agreement and submit your form. We'll confirm the information with you, and set you up to serve your site right away. It's that easy!

What do you do now that your Bella Mia account is activated?

Your website folder

After you sign up and receive your Bella Mia account, a directory will be set up on our server. This directory is where your web site files will reside and be served from. The server software will serve up the file index.html if no file is specified by the browser. This means that a web browser requesting

http://www.your-company.com

will actually receive

http://www.your-company.com/index.html

Be sure to name your initial page in your web site (i.e. your "Home" page) index.html and only index.html.

Using FTP to upload your files

To put your files in your web site folder, you will need to FTP them there. FTP is an acronym for File Transfer Protocol. Popular FTP programs include: For Macintosh NetFinder, Anarchie and Fetch. For Windows CuteFTP. Some HTML authoring programs, such as PageSpinner, and Netscape have FTP capability built-in.

Point your FTP program to the domain where your web site is being hosted, i.e. ftp.mia.net, then enter your username and password in the provided boxes and click the OK button to connect.

Once you are connected you will see your web site directory.

You can now transfer files from your Mac or PC or whatever, to your web site directory.

Standard CGI applications and how to access them

Mia.Net has made available some standard CGI applications tha you can use with your web sites as well.

Page Hit Counter - Form to E-mail For Enhanced Web Hosting Customers

Counter

To place a counter add the following tag in your web page (make sure to replace "yourname" with your username):

<img src="http://www.mia.net/cgi-bin/counter/counter.acgi$main/your-page-name">

 

Standard counter:

 

To add leading zeros to the counter add the width option to the image tag:

<img src="counter.count$yourname/main/width=5">

Form to E-mail

Bella Mia is currently using the FlexMail plugin for form to e-mail capabilities. FlexMail is a very feature rich form processor. Each form points to a Flex configuration file. See the Flex file instructions on how to modify these files.

These examples show how you can use FlexMail to handle some common tasks. They are all relatively simple examples that you can easily edit for our own use.

Before using these examples, be sure to edit the hidden "To" fields in the HTML files to point to your own email address. You can use your favorite tool for editing the HTML files, but you must use a text editor such as BBEdit or SimpleText to edit the Flex files. Do not use an HTML editor to create or modify Flex files. HTML editors simply will not understand the Flex file format and will ruin them, causing FlexMail to malfunction.

Note: the Flex files have been appended with .txt to prevent the server from processing them. Remove the .txt suffix before using with your own forms.

Web Server Log Files

Bella Mia provides server log files for your web site on a monthly basis. Logs are generated using LogDoor and which allows you access to .log, .txt, and .html versions of your log. These log files are placed in the "stats" directory within your web site folder. By simply typing in: www.your-company.com/stats you will get a page with a pop up menu with your monthly statisics in a graphical form for easy viewing. Click here for an example.

 

Web Site Tips & Resources.

Tips for Creating HTML Pages

     
  1. Embed Copyright information and other comments in a <!-- comment tag --> on your pages for protection now and in the future.
  2. For a typeset look and feel, use "Spacer" tags which put vertical and horizontal spacing at a pixel dimension you specify.
    Ex: <SPACER Type=Horizontal Size="32"> The first line in this text will be indented by 32 pixels. <SPACER Type=Vertical Size="3"> Puts space between lines.
  3. Use Alpha to create and execute MacPerl scripts.
  4. Always specify <TABLE> borders. Netscape assumes a 1-pixel border, while Microsoft Internet Explorer assumes you don't want any border at all.
  5. Always close table cells and table rows. Not closing table cells with </TD> or table rows with </TR> can yield undesirable results.
  6. Put a custom message into the results of many search engines by including <META> tags. An example follows: 
    <HEAD>
<TITLE>Your Site Name</TITLE>
<meta name="keywords" content="Bella Mia, Macintosh hosting, macintosh web 
hosting, AppleHost, Apple Internet hosting, web hosting, internet service, 
macintosh, mia, MacHosting, machosting, mac web designers, mac 
internet, Apple graphic designers, lasso, filemaker pro, dynamic 
database-driven web pages, low cost, web server, webstar, quid pro quo, 
tango, free, domain name service, cgi scripts, macshowcase, mac showcase, 
apple hot products, macintosh web services, mac web designer, MacHost, 
machost, web traffic analysis, Mactivity, web out, chicago, illinois, IL, 
macworld, macweek, macintouch">
<meta name="description" content="Host your Mac-designed web site on 
high-performance Macintosh servers. Bella Mia. Friendly. Easy to Use. Just 
Like Your Mac."> 
</HEAD>
 

    <META> tags must be placed between the <HEAD> </HEAD> tags.

Useful Web Sites:

Tips for Handling Graphics

     
  1. Use HTML Grinder to automatically put image height and width tags on images to help pages load more quickly.
  2. Stay abreast of the emerging PNG graphics standard. Images will be compressed better, and will load more quickly.
  3. Debabelizer Toolbox has many features to save you time (and money!). Among its best features are batch processing of large numbers of images and automatic creation of the best color palettes for your images optimized for both Mac and Windows.
  4. Windows based computers have slightly darker "gamma" or brightness than Mac monitors, a factor you'll want to consider when developing your images for the web.
  5. Design for the "horizontal" compression of GIFs. The compression used in GIF graphics compresses only in the in horizontal direction, so images with horizontal designs are much smaller than similar images with vertical designs!
  6. What's special about "468"? 468 is the width (in pixels) of the 'content space' visible inside a new, default-size Netscape window. If your page designs are 468 pixels across or less, visitors will not have to resize their window. If your page design is wider than 468 pixels, it may appear cropped.

Useful Web Sites:

Tips for Web Site Maintenance

     
  1. Use BBEdit to perform Find/Replace on an entire web site, including embedded folders. The "magic" of BBEdit lets you perform revisions to all files in your web folder without opening and closing each one!
  2. Use HTML Grinder to check code on your HTML pages, to flag files that do not match certain criteria, and to print an entire site with one mouse-click!
  3. Visit the Doctor HTML site to confirm the integrity of your HTML files. The site will help you flag missing tags, poor syntax and other potential problems.
  4. Use Adobe SiteMill when re-naming/moving a file or image to have relevant pages automatically update links to the renamed file.
  5. Try Submit-it to easily register your web site with many search engines.

Useful Web Sites:

 

Tutorial Home