We recommend you review what other designers created to give you ideas and inspire your design, if necessary. If you haven’t spent much time on the Web, this is a good time to get acquainted with how a Web site looks like. You’ll find a section at the back of this book containing a listing of various Web sites pertaining to Web site design and development. Also worth looking at is the book, “The Web Design Wow! Book” by Jack Davis and Susan Merritt. In this full-color book, you’ll find numerous Web sites and other media extensively reviewed and nicely categorized.

Some people might set their monitor resolutions below the 800×600 standard, which causes on-screen images to get larger. And if an image gets larger on screen and can’t fit in a window, you’ll have to scroll over until you can see the whole image.

The point being here is that incompatibility issues arise when designing your site, which should all be addressed. You should focus on creating a Web site that delivers Web pages compatible for all monitor resolutions and screen sizes.

Normally, designers design Web pages for a resolution containing 800×600 pixels and check the appearance of the page layout at the resolution containing 640×480 pixels. (This process can also be done vice-versa). Either way works fine and its up to you to decide which method is best for your purposes.

We recommend designing your Web pages to have a set width no larger than 600 pixels. This area is about where the checkbox icon resides on your taskbar. If you absolutely need more space, make use of percent measurements. If a Web browser needs more space, it will reduce the area for you without moving elements around too much.

A helpful program called “QRes” is designed for easily switching monitor screen resolutions, which is helpful in testing the compatibility of your Web pages on other monitors. Its available free of charge and can be downloaded at http://www.berend.com/qres.html. You might also want to look into a program called BrowserMaster from ApplyThis Software. A trial version is available at http://www.applythis.com/browsermaster.

If your project space is limited on your hard drive, you may want to consider checking the resolution manually using the Microsoft Windows Control Panel. To do this, simply click on “Start”, “Settings”, and “Control Panel”. Double-click on the “Display” icon and go to the “Settings” tab. Testing the compatibility of resolution differences should be relatively self-explanatory at this point.

You just need to slide the ruler appropriately to the named resolution in the “Screen area” section.

Side Note: Speaking of appearance differences, you might want to consider designing your Web pages for Netscape Navigator or Netscape Communicator. If your pages look good in a Netscape browser, odds are they look nice in Microsoft Internet Explorer. (Internet Explorer tens to be a little more lenient in terms of displaying Web pages more appropriately in terms of how the HTML programmer (or the WYSIWYG Web page development program) designed them to appear.

Let’s say you want to format a paragraph to have an indentation equal to 1 inch. To the right of the “Align Right” button, you will see another button grouping. Do another mouse-over to see how every button functions. To indent this paragraph at about 1″, select your paragraph and click on the button with an arrow pointing to the right, towards some lines of text. If you’re not sure where this button is located in the group, do another mouse-over until you come to a button reading “Increase Indent.” You can increase paragraph text more than once.

To create a numbered list, select a few lines of text and click on the button resembling a numbered list. If you do a mouse-over on this button, you should read “Numbered List”.

To create a bulleted list, select a few lines of text and click on the button resembling a bulleted list. If you do a mouse-over on this button, you should read “Bulleted List”.

Formatting basic text is also very easy and will be discussed in the next chapter.

With the first option (creating a table from the menu bar), a dialog box will appear, similar to the one shown below.

As you can see, you have a variety of options to choose from. The following breakdown of your choices will help you create a table you want:

• Rows are the horizontal groupings of cells. In a 4 by 3 table, for example, the number 4 is the amount of rows.
• Columns are vertical groupings of cells. In a 4 by 3 table, for example, the number 3 is the amount of columns.
• Alignment is where you want your table to appear on screen. You can select from left, center, or right alignments.
• Border size is the pixel area around your cells and is normally set to either 1 or 2 pixels.
• Cell spacing is the amount of pixels between cells. Usually 1 or 2 pixels will be fine for standard tables.
• Cell padding is the pixel space within cells. Again, 1 or 2 pixels will be fine for this option.
• Table width is the span in which your table will look in someone’s Web browser. You can either set an exact amount in pixels or a percent span.

Under special conditions, you may want to set a table’s height dimension. To do this, click on the “Extended…” button. From here, click on “Add…” and another dialog box will appear titled “Name/Value Pair”. In the name field, type in “height” and type in your table height dimension in the value field. Remember, to specify an exact pixel space amount, simply enter a number. To specify a percent, type in a number from 1-100 followed by the percent (%) sign.

Possibly the easiest method to create a table, if you just want to input a few rows and columns would be to draw one out. If you have a large number of rows and columns to input, it may be easier to go to the table dialog box and input the specific number of rows and columns you require.

You can always go back and change something by right-clicking on your table and selecting “Table Properties…”

Tables are generally used to organize large amounts of data or to align various page elements more precisely. Tables can also be used for more creative approaches, such as creating a 1 by 1 table to designate the span of paragraph text rather than allowing your text to span 100% across the screen. Although this can be the desired effect, some designers prefer a small margin between the left and right sides of the screen to present their information more attractively.

The HTML programming language also advances, but generally not as fast as Web page editors. So it’s useful to learn the programming language to enhance your page and make it look exactly the way you want it. In other words, HTML is an inexpensive approach to expanding the capabilities to any Web page editor. We have included an HTML reference section in the back of this book and teach you how to implement the codes. Learning HTML is very easy, actually—once you understand the logic behind it. Other programming languages such as JavaScript and PERL are also useful.