HOME

Day 1

Day 2

Day 3

Day 4

Terms

LINKS

 

DAY 3
Build Your Own Web Page

I.  Tables (Guided Activity)

  • Inserting -- Click Table/Insert Table and choose the number of columns & rows you want.  In the Layout section, choose the position on the page where you want your table (left, right, or center).  Click OK.
    OR You can click the Insert Table icon on the toolbar and pick the number of rows/columns on the grid.  If you choose this option, you should go to Table/Table Properties and fix the Layout Alignment to left, right, or center.

  • Properties -- Click Table/Table Properties and you can customize the table background colors (or image background) and border colors. (Just choose border because it will change both the light and dark for you.  If you want more than one color, the light border goes toward the upper left, dark border goes towards the lower right)

    You can also tell the table how far across the page to span.  Click Table/Table Properties and click the Specify Width box in the Minimum Width section.   You can choose either pixels or percent measurements.
    TIP:  Remember that not everyone sets their browsers the same, so if you choose pixel measurements, think of what others might see on a 640 pixel-wide screen....on an 800 pixel wide screen...In other words, if you set you table pixels to be 700 pixels wide, it will look fine on an 800 pixel wide resolution, but will be off the page on a 640 pixel wide resolution...and your page visitor will have to scroll left and right (as well as up and down) to see your full page.

  • Cells, Rows, Columns -- Select a single cell, row, or column by putting your cursor in a cell of the row or column you want to change and clicking Table/Select Cell (or Select Row or Select Column).  This will highlight the area you want to change. THEN you can click on Table/Cell Properties and change the background and borders for JUST those cells!
    Shortcut to selecting columns/rows:  Place your mouse cursor at the top of a column or end of a row and look for the "fat" arrow to appear and then click.  It will select the whole column/row for you!

    You can also set the alignment vertically and horizontally.  (How the stuff you put in your cells lines up)  Click in the cell you want to adjust (and click Table/Select Row or Table/Select Column if you need to!).  Click Table/Cell Properties and then select Layout--Horizontal Alignment to choose left, right, or center.  In the Layout--Vertical Alignment you can select top, middle, or bottom.

    If you want a column to take up a particular amount of space across the table, select the column (either with Table/Select Column or the "fat" arrow).   Click Table/Cell Properties and check the Specify Width box in the Minimum Width area.  Type in the number value for pixels or percent like you did for the table properties.  If done in percent, the value will be a percentage of 100% of the TABLE width (not page width), so if your table goes 80% across the page, and you choose 25% on the cell width, you are getting 25% of the WHOLE TABLE (but how much of the page is that????   Math Test: 25% of 80% is 20%).
    If you choose to do the pixel measurements, remember that you total pixels cannot exceed the pixel width of your overall table measurement!

    Use your TAB key to go from cell to cell and add your content.  When you've used up your last cell on your table push the TAB key and you'll get a whole new row of cells!

  • View HTML -- <TABLE> </TABLE>
    <TR></TR>   rows
    <TD> </TD>  cells

  • But wait....there's more!
    Splitting (dividing) cells:  Click in a cell and then click Table/Split Cells.  Choose how many rows/columns you want to divide the cell into.  (Note:  You can only divide a cell to fit the measurement confines of the other cells in the column above it.  See the Example following.)

EXAMPLE

100% of table
33% 34% 33%

OR

450 pixels
150 pixels 300 pixels

Merging Cells:   In the case of the 150 and 300 pixel table divisions above, there were three 150-pixel cells under the long 450 pixels cell.  Click and drag across the cells you want to merge (combine), then click Table/Merge Cells and it will create a single cell from the multiple cells that you started with. You can sometimes fix problems by changing the cell properties of each individual cell in the table to "add up."

To get out of a table if you're at the end of the page:   Click Ctrl + Enter and your cursor will leave your table and go back onto the main page.

To move a table onto another part of the page You HAVE to click Table/Select Table before you try to click and drag the table to another part of the page.  If you just click and drag over the table cells, it ends up moving the cells to another column and other weird stuff like that.

  • "Invisible" Tables
    This is a very easy trick to make your pages look well-aligned.  It's also good for putting images into a "grid" pattern with a little space between them.  
    Click Table/Table Properties.  In the Layout section, change the border size to "0"  Click ok.  Go check out your table.  While you are editing, there will be little dotted lines to guide you on placement, etc.
    Another trick that invisible tables can be used for is if you have left-margin decorations on your background image (also called border backgrounds).   Set your whole page up in the right hand cell of the table and make the left cell be only as wide as the image border--then leave it blank!  Your content won't go spilling over on top of the pretty border!
    PREVIEWING THE PAGE:  Click on the magnifying glass Preview button at the bottom of the page or the magnifying glass over the web document icon on the toolbar at the top to see what your page will look like when published.

II.  Page Creation (Independent Activity)
     1.  Find clipart and graphics from free sites on the net and in FrontPage clipart.
     2.  Play.
     3.  SAVE!

III.  BREAK

IV.  Uploading (Guided Activity)

  • FrontPage Publish command
    FrontPage has a Publish command that allows you to directly load a page -- even the whole web file -- onto your domain's webspace.  Click on the stack of moving papers icon on the toolbar or File/Publish Web from the menu bar.  You will have to enter the address of the webspace where the files are going...make sure you know your password, too!

  • Free Host uploading methods
    Many free servers have their own uploading software/program that is built into their system.  Most of these are as simple as clicking an Upload button and then browsing for your files.  After that you just click OK or UPLOAD.  Some also have capabilities of supporting FrontPage's Publish command...but most of the time, you have to pay for their "premium" service to be able to use it.

  • FTP -- File Transfer Protocol
    If your server doesn't provide a method to upload automatically, you will probably need some FTP software.  There are a couple of free ones out there.  Basically you choose the files and provide the software with your user name and password so you can "manually" enter your files into the server.
    SmartFTP http://www.smartftp.com/download
    FTPCommander http://www.vista.ru/2inter.htm (Make sure you get scroll down to download COMMANDER, not NAVIGATOR -- Navigator's not free)
    FreeFTP http://members.aol.com/brandyware/freeftp.htm
    CuteFTP Trialware http://www.globalscape.com/download/cuteftp.asp This is a 30-day demo version of this software.  Too keep using it after that you will have to pay for it -- about $35.

  • ISP Web space
    If you have space available through your local ISP (TStar, 281, Zeecon, etc.), contact them about how to send your files to their servers.

MFISD Continuing Education Course

Instructor: Shelli Spruiell
sspruiell@marblefalls.txed.net