WyzGuys Computer Tutors

 Computer Instruction. Web Design Instruction,  and Web Hosting 

 

Organizing Your Page with Tables

 

Site Navigation

Home
Student Registration
Class Resources

Day One

Introduction
Student Sites
Web Structure
Computer Settings
Site & Pages
Explore FrontPage
Web Site Wizard
Shared Borders
Web Page Themes
Page Header
Adding Text
Homework 1
Web Hosting 101
Web Site Design
Home Page Design

Day Two

Introduction
Your Home Page
Adding Pages
About Us Content
Add More Pages
Deleting Pages
Navigation
Link Bars
Custom Link Bars
Hyperlinks
Adding Hyperlinks
Hyperlink Exercise
Publishing
Copy Your Site
Homework 2

Day Three

Introduction
Bullet List
Numbered List
Tables
Table Uses
Create Tables
Graphics Intro
Image Sizing
Photo Editing
Adding Graphics
Photogalleries
Gallery Tool
Saving Images
Adding Music

Day Four

Form Wizard
Custom Form
Form Exercise
Form Properties
Web Components
Add a Map
Add Search Box
Marquee
Buttons
Hit Counter
Split & Code View
On-Line Sales
PayPal Buttons
Building Traffic
Meta Tags
Search Engines
Appendix & FAQs
Adv Techniques
Interactive Web
Conclusion
Evaluation

We use and recommend

for your on-line transactions

Keeping Information Together

As you may have noticed, FrontPage will dynamically resize a page based on the size and resolution of the computer monitor and browser window.  What this means is the end of a line of text will be different for different visitors.  You can see how this works yourself by clicking on the Restore Down button on your browser window with this web site, or by switching to Preview view in FrontPage, closing the Folder List, which expands the viewing area, and then Restoring Down to reduce the viewing area.

We discussed this concept briefly on the first day, when we designed a table header.  The same technique can be used in the body of your web page to keep text together with a related image or graphic.  I use this feature all the time, and examples abound in this web site.  They are not noticeable because I usually turn off the borders.

Lets look at a few examples.

One cell with text and a picture.

Since we will learn how to insert pictures in the next lesson, what you need to know is that the picture is inserted at the beginning of the paragraph, and in the Picture Properties dialog, we set the Float to Right, so that the words wrap around the image.  You will learn what these terms mean in a minute

Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here.  Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum.

Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here.  Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here.  Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here.  Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Dolorum Ipso Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum.

Two cells with text and a picture.

Another way to do this is to create a two cell table, with one cell for the text, and another for the image.  This will leave the image alone with some white space around it, like the example below.

Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here.  Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum.
Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here.  Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here.  Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here.  Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Page content goes here. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum. Ipso Dolorum Factum Ipsum.

Disappearing Borders

To make the borders disappear, simply highlight the table as shown below, then select No Border from the options under the Table Border button.  FYI, the two pictures below are in a two cell table, with the border hidden.


Back To Exercise Next

 

Curriculum developed by WyzGuys Computer Tutors

All Rights Reserved - updated 12/07/2006

Hosted by WyzHost.com

contact support@wyzhost.com