<% 'if pass didn't clear else, continue If Session("varSecurity") = False Then Response.Redirect "AFVBA_refuse.asp" End If %>

Word AutoForms and Beginning VBA eBook
Screen Reader - Web Edition - Free Lesson One

Author: Dian D. Chapman
MouseTrax Computing Solutions
Lesson One: Form Layout Choices

These links below will help you navigate through this lesson. The links above will take you to the next lesson.

Form Layout Choices Using Tables in Forms Let's Get Busy! Additional Comments
No Table Layouts Building Your Own Form Table Formatting  

Note! In order to show image details in this lesson, some images are large. If you need to print this lesson, adjust your browser PageSetup settings. If you can't lower your default margins enough to print the page properly, use the landscape print mode to ensure text is not cut off the page.


Lesson One: Form Layout Choices
There are several ways to layout a form in Word. Most of the time, it's best to use a table to help hold your structure together. But you can keep the form from looking too structured by not using table borders or by adding some formatting or shadow tricks. We'll look at some of the ways you can layout your form.

Click to go to the top.

No Tables Layouts
If your form will consist of a survey or letter, you obviously don't want to structure the document with a table to contain the text form fields. You'll want the newly entered text to flow with the document. Here are a few simple examples of when you would not want to use a table to constrain the form fields in a document.

If you were writing a form letter, using fields to enter information specific to an individual, you would want the text to flow within the context of the letter. Using form fields to create master letter templates is a great way to save time.

As you can see in the following sample letter image, you can add form fields in the address and salutation positions. But you can also add form fields throughout the letter where specific information needs to be added to customize the letter, such as account information.

Image of a letter with form fields for the recipient's name and address, as well as the salutation and account balance within the overdue sample letter.

In a document such as a Customer Survey, there may be several text fields where the customer is asked to add content in their own words, providing detailed explanations. Simple text form fields are placed wherever information is needed. The customer can then add as much text as needed to provide detail, with no concern for text alignment. Survey forms are also a great place to use checkbox form fields or drop downs, when you want the user to choose from a specified list of answers.

Image of a sample customer survey with a drop down requesting how the order was received, checkboxes for yes or no regarding the shipment condition and a text box asking for details if the shipment was damaged.

I'm sure you could think of several other types of forms that are simple to put together and need little structure. But, because these types of forms are so simple to toss together, we won't bother spending any more time on them here. Let's get busy thinking about those nasty forms that need a lot of alignment!

Click to go to the top.

Using Tables in Forms
Invoices are one of the most popular types of complex AutoForms. There are many others. I'm sure, at one time or another, you've had to fill out some type of expense form. And we can all relate to the complex layout of a tax form!

By using a table, you can place the form fields inside cells and then control the movement of the field by setting cell limits. You can also make the form look quite slick by adding shading and border tricks. In this course, we'll build an invoice AutoForm and experiment with various designs by changing table, shading, border and font options. For now, let's look at a couple more involved forms using tables.

Invoice No. 1 is a standard billing table. Form fields have been placed in each field for Shipping and Billingsections of the form. A checkbox has also been added above the Ship To section. This form is programmed so that if the user clicks the checkbox to confirm that the Billing address is the same as the Shipping address, the cursor will skip over all the fields in the Ship To section. This saves time. There's nothing more frustrating than having to tab through a bunch of fields when they don't apply. In this course, you'll learn how to use VBA code to control the flow of your form.

Image of a sample invoice.

Invoice No. 2 shows another invoice example. Both of these invoices are basically the same. However, Invoice 1 has a little heavier look, whereas Invoice 2 has a more delicate look. The differences in appearance were made by using bold text, darker lines and a little heavier shading in one. Whereas the other uses an italic font, lighter lines and lighter shading.

Image of another sample invoice.

Not every form you'll need to create will be an invoice. You may also be called upon to create other types of forms for your business. Below is a sample fax form that uses tables, TextBoxes and varied shading to create a nice look.

Image of a fax form with text fields in table cells for fax details.

Click to go to top.

Building Your Own Form
Ok, time to stop just reading and get busy working on your own form! Although I know invoices can be pretty boring, as I said, they do hold one of the bigger challenges when creating forms. An invoice has lots of opportunity for unusual cursor movements, as well as calculations and potential for Select Case statements to automatically enter data. So let's get started building one!

Note! You'll want to keep the form that you build handy, as we'll continue to enhance it as we move along in this course.

The first thing you'll want to do, before you start spending time at the computer, is to grab a pen and paper and start scribbling out ideas. Don't just sit there! Get your pen and paper out and start sketching out what you'd like your form to look like!

Here are some of the things you'll want to consider when you design your invoice:

  • Does each invoice need an invoice number?
  • You'll need to indicate a billing address, as well as a shipping address.
  • Be sure to include things like customer or account numbers, terms of the sale, maybe tax-exempt status or any other special notations.
  • Create a column for item number, how many of each item, individual cost, total cost and description of the products.
  • Then you may need a place for a sub total, tax, maybe shipping costs and a total.
  • Will your invoice need any approvals? Maybe it's a pre-sale agreement? Or a quote? In that case, you'll need room for approval signatures.
  • Should you leave room for special instructions?
  • How about the name, ID number, and/or dept of the sales person?
  • Are there any special accounting codes that need to be filled in, in conjunction with the item number?
  • And don't forget the company logo!

Take a little time to scribble yourself out a form. Think about how you want your form to look and how it should work when you're finished. Then we'll see how to go about designing it and programming it to work the way you want it to work.

If you pay attention, by the time you finish this course, your scribbled out draft idea will be a working form! So go wild and use your imagination. Even if you don't know how to do what you want, go for it anyway! That's why you're here. To learn. So don't feel limited by your current skills, because you're going to learn a bunch of new ones!

Here's mine! (See the following image.) Nothing fancy (obviously), just something to make you think before you leap! If you don't take time to sketch out your form, you'll probably end up taking much longer to put it together. Trust me! When you put your thoughts on paper, you have an opportunity to think about all the information you'll need. It's much easier to scribble around to make sure you have everything on the page now, than after you've started to format it on the computer.

Image of a hand scribbled invoice design.

If your form is being created for someone else, be sure to consult with them and discuss your draft, so you'll know what you're getting into before you begin. Make sure you understand how they plan to use it so you will program the form correctly.

Keep your drawing handy because you'll be designing your form to match your design. If you can't think of a design, feel free to use mine. In fact, it might be easier to follow along and create a form similar to mine. But if you have a design you need to get done, use that. Then you'll not only be learning how to create a form, you'll end up with a useful document when you're finished.

Click to go to top.

Let's Get Busy!
Time to get started putting together our basic form layout. Then we'll continue to work on the form throughout the course, enhancing and automating it.

Since our form will be a master layout that will be used over and over again, it needs to be saved as a Template. Then users will click File/New, locate and select your form template and click OK to use it. A new document will be created from your master form template.

If this is a form that will be used frequently, you might want to put a shortcut to the template on your desktop. In fact, when I'm working on a form, I prefer to keep it handy, so I use the desktop shortcut method. Then I can quickly find it. To work on the form, I right click the shortcut icon on my desktop and click Open. That will open the form in Word and allow me to work on it in its template version. When I want to run the form for testing, I right click the icon again, but this time I choose New. Then a new document will be created from the master template and I can see how it'll run. While we're working on your form during this course, you might want to use the desktop icon method to keep it handy.

Open a blank template in Word. Either use File/New and select the Template option, or save a blank page immediately as a template by clicking the drop down in the Save as input box and choose Template.

Note! For the majority of this course, I'll be using Word 2000, because it's my favorite version. However, under some circumstances, I may also use Word XP to show any significant differences.

Start at the beginning. We'll add a logo and company name. Click Insert/Picture and then choose the option you need to get or create your logo. I'm choosing From File to insert my logo. Since I love dogs, I've decided to work for Dalmatian Insurance. To align my text, I use a little expanding trick. I select my text and click Format/Font/Character Spacing/Spacing and change the character spacing until the text is expanded to align it across the page. Then I click Format/Borders And Shading/Borders and choose a top and bottom paragraph border to help balance my page.

Note! When adding a border to text, remember to hit Enter at least one time before you apply the bottom border or you'll go nuts trying to remember how to stop your border from traveling down the page. If you hit an extra return first, you can then jump the cursor down to the new line without a fight. But here's a tip, if you find your border following you down the page, hit Ctrl/Shift/N to apply the Normal style to break the cycle.

Here's the beginning of my form, with the company logo, name and tag line. Notice that the text on top is slightly expanded. And the text below is expanded wider to match up with the above text. Just a fun, little formatting trick you can use.

Image of invoice header, with a Dalmation mother dog standing and nursing a bunch of spotted pups, slightly expanded title text saying Dalmation Insurance and a wider expanded tag line saying planning for your future!

Click to go to top.

Table Formatting
Now we'll deal with setting up our tables for the billing and shipping information. You'll want to start with one table. The table will probably need at least four columns. One for the labels for both the billing and shipping sections and one each for the actual form fields to be placed where the user will enter data. Depending on how much information you plan to gather, you'll probably need about seven rows. Click Insert/Table and layout your basic table format.

Humm, not very exciting, eh?

Image of a very plain table with four columns and 7 rows in a simple, line grid format.

Ok, so it doesn't look like much, yet. But we'll add a little formatting, shading, a little text and see what we get.

To select a column, move your cursor just above the column until the cursor turns into a down arrow. Then you can apply whatever shading, borders or font formatting to that column.

Image of a column selected with a dark arrow above the column to select it.

In the image above, notice the square with cross-hairs in the upper, left corner. You'll notice this table handle showing up now and then while you're working on the table or when you hover your mouse within the table area. This is the table move handle. But if you click on it, you can quickly select the entire table.

You can select the table to quickly set overall formatting, such as font size for all the cells or border formatting. If you want to select the table with keystrokes, you can position your cursor anywhere within the table and hit Ctrl plus the number 5 key on your keypad. Be sure the NumLock is turned off.

Get busy! Format your table. Feel free to go back to my previous samples for ideas.

Tip! While you're working on your table formatting, realize that if you format one item, such as a cell or column, you can go select another item and hit the F4, repeat key, to have that last formatting repeated and applied to the new item. Great time saver!

How is yours turning out? Here's the opening to my form.

Image of my invoice shipping and billing area with italic time fonts and no lines in the fill in areas.

Doesn't look much like a table, does it. This view is from Print Preview, so you can't see my visual layout aids. But it is a table. Sure, it's hard to tell where to position the cursor to type in the necessary information. But that doesn't matter. Once I add the form fields, users won't need to concern themselves with where to type information. They'll simply tab their way through the form and enter the requested information at each location.

Or, I can even make the form slicker by creating a custom dialog box and have it pop up to request the necessary information. Then I can have the data they type in the dialog box inserted into the pertinent locations using VBA, without any user intervention on the form itself!

Notice on my form, however, that there's no way yet to recognize which information is for shipping (or in my form's case, Installation) and which is for billing. So I still need to add some text to indicate that. I can just insert my cursor on the top line of the table, click Table/Insert/Row Above, and another row will be inserted. This will give me a spot to add the column label information.

Note! Never try to format a document like this in Normal View. You'll only frustrate yourself! Use the WYSIWYG (What You See Is What You Get) mode of Print Layout (or Page Layout in pre-2000 versions). And be sure to go into Tools/Options/View and turn on many of the visual aids, such as Tabs, Paragraph Markers, Hidden Text and Text Borders, so you can see what you're doing. If you don't, you'll go nuts trying to align text properly!

In the following image, I'd originally added a thick white line to provide an invisible break between the segments. But then I decided to use a thick gray line to provide a little more structure to my table.

Image of the same billing and shipping area now showing lines.

Also notice how the Times Roman Italic font gives the page a lighter, more elegant look. If I used Italic Arial (or some other San Serif font), it would have a more crisp look, yet still would convey a lighter effect, because of the italic style. Using Normal or Bold, would give the page a more serious, harder look. Don't be afraid to play around with different text effects or cell shading and borders to see how it looks with various styles.

If you were creating a form for, say, a construction company, you might want it to have a harder, more serious look. If you're creating a form for florists, you might want a light, more elegant look.

Image of the same billing and shipping area now with reverse text and arial rather than times font.

Compare the image above with the previous one. Notice that with just a few modifications, I've taken the same table and given it a whole new feel!

All I did to change the feel of the table was to select the first label column and add darker shading and reverse text. Then I moved to the next label column, selected it and just hit F4 to repeat the last move. Bingo! Another column quickly formatted. While the second column was still selected, I hit Ctrl/B to add bold formatting to all the cells. Then I moved back to the other column, selected it and hit F4, again. Bingo! Instant bold in that column. Then I used the same routine to change to Arial.

I keep the Times and Arial fonts handy on a custom toolbar I've created. This way I can easily switch between these two common font styles—Serif and San Serif.

Note! Serif fonts have little serifs or feet on them. This aids the eye in reading because it creates an imaginary line under the text that helps the eye focus on each line and speed across the text. San Serif fonts do not have serifs. No feet. They are crisp, sharp fonts. Whereas an italic serif font looks fancier; almost like script.

If you want to learn more about typography, to make your documents look more professional, you might want to take my MS Word—Advanced Document Design class or puchase my eBook, where I cover typography, as well as technical aspects of putting complex documents together, such as books and newsletters.

Continue working on your form design and add all the elements you need to match your drawing with your actual document. Don't bother inserting any Text form fields into the cells, yet. We'll deal, in depth, with those, shortly. For now just worry about laying out your page the way you want it. However, if you need checkboxes, you can add those. (You'll find the Checkbox on the Forms Toolbar.)

Note! A great trick to get text to fit is to use the Ctrl/Shift/[ or ] (brackets) shortcuts for adjusting the font size up or down by one point. Or you can use the Ctrl/Shift/> shortcut to jump up or down by increments. If you type text on your form and realize that it's a little too large or small for the space allotted, highlight the text and use one of these shortcuts to make quick adjustments. Or if you have a blank paragraph marker to separate items on the page, select that blank marker and raise or lower the font size for that line to add more or less space between items. This is easier to control than adding excess returns.

As you can see in the following image, I have a return between the Installation Date and the order table. I decided to add more space between them. So rather than just entering more returns, I select the return (black rectangle) and hit Ctrl/Shift/> to increase the size and thereby add spacing. The typographically correct way to do this would be to add Space Before the table. That works great for paragraph text, but when dealing with tables in a form, I've found it easier to use a single return and adjust its font size as needed.

Image of a selected paragraph marker creating space between two tables.

Also note that you can use a decimal font size. If you need to squeeze in some text, you can change your 11pt font to 10.5pts to make it fit. In most cases, no one will notice the difference. You can also try using a little Character Spacing to slightly Expand or Condense the text.

In the image below, I have the billing checkbox text right aligned. But I wanted it to align with the vertical line. As Goldilocks would say, the 10pt font was too small; the 11pt font was too big; but the 10.5pt font was just right!

Image of invoice billing section with billing title and same as check box aligned over the section title.

Tip! Remember that you can split and merge cells to help you align text. And also use cell borders to control the structure. Here's my signature table in the raw.

Image of a table with grid lines, titles and empty cells for fill in.

After a little fancy footwork with Borders And Shading, here's my finished table.

Image of the same table, now with grid lines removed and only bottom borders left in areas where signatures will be entered on the finished print out.

A lot of people want lines under the text input locations in a form. If you use a form field and apply underlining to the form field, the lines will be different lengths, depending on the amount of text typed in each field. If you used the underscore to underline the space, that, too, will move with text input. But by applying border lines to cells, these lines will remain. Later when you add Text form fields, the field can expand, but you can control the cell sizing to keep the lines stable.

Also, if you're like me and use the Border And Shading dialog box a lot, you can create a hotkey shortcut, as I have, to quickly display this dialog box. If you need help customizing toolbars or menus, read this article: http://www.mousetrax.com/toolbars.html.

OK, so don't just sit there—finish designing your form! (Tapping her foot, impatiently!) Done yet?

Here's my form. If you compare this to the scribbled design I previously displayed, I think you'll agree that I followed my design idea fairly closely. How did you do?

Image of my finished invoice that matches my scribbled page.

And now that you've done all this work to carefully layout your form, you can appreciate how important it can be to work the layout on a piece of paper first. Now is not the time to discover you need to add another large table!

Click to go to top.

Additional Comments
Two final thoughts about layout that I want to make sure to cover here.

  • Frames vs TextBoxes
  • Scanned Forms

Frames vs TextBoxes: At some point, you may want to place form fields inside a box to set it off from the rest of the form. Although you can use a table, for various reasons, sometimes a table may just not do the trick and you'll need to use something else.

However, you can't use an image TextBox because form fields don't work inside of it. But, if you convert the TextBox to a Frame, then you can insert the form fields inside the frame.

Or you can also use the Insert Frame icon on the Forms Toolbar, which I'll discuss in depth, shortly.

Image of format text box formatting dialog showing Convert to Frame button on margin tab.

Notice the Convert To Frame button on the Format TextBox dialog box above. Add a little shading and you'll have the For Office Use Only box that we all know and love.

Image of a light green frame entitled For Office Use Only and a place for Record Data and Initials.

Scanned Forms: Another process folks ask about is how to create a form in conjunction with a preprinted form.

To do this, you'll first need to scan the form. Then insert the image onto a blank page and size it to the page. Now select the image and draw a Frame over the image. Be sure not to draw it out all the way to the edge of the image underneath or you'll have a very difficult time trying to select one over the other. By keeping the top image box smaller, you'll be able to move the mouse to the proper location to click and select.

Now you can insert form fields into the top frame and maneuver them into place over the input location on the form underneath, which you'll be able to see under the top frame, as long as you set the top Format Frame option to No Fill.

Or you can also insert the image in the Header as a Watermark. Then you can place the form fields where needed on the top document layer. Either way, you'll probably have to use a lot of the spacing tricks I showed you to get the form fields in just the right spot. It can be tricky! But once you do, you can then print only the data in the form fields onto a preprinted form waiting in your printer.

Then print just the data fields. Click Tools/Options/Print and select the Print data only for forms option, which you can see Rocky, my trusty assistant, is pointing out in the image below.

Image of Tools/Options/Print dialog box with Options for current document Only section checked for Print data nly for forms.

Click to go to top.

Well, that's it for this lesson. I hope you feel you learned something. Be sure to have your form ready before you venture into the next lesson. In Lesson Two, we'll look at the Form Field Options. You'll add the fields to your template, learn to set proper bookmarks, we'll dig into special data formatting options and you'll learn how to add Help fields to your form. We'll also discuss the wonders of the Entry and Exit macros.


Click to go to top.

Copyright (c) 2002, Dian D. Chapman, MouseTrax Computing Solutions (www.mousetrax.com), Chicago, IL