| Contents | Introduction | Updates | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | A | B | C | D | E | F | G | H | I | J | K | Glossary |
| Note: The Directory Manager must create the initial web page for you to edit (it is called editing even if you are entering information for the first time). |
The Page you want to edit should appear in the window of your web browser. Click the check mark (near the bottom of the web page) and enter the Manager Mode. In the Manager Mode box, click once on "Edit this Page" under the Page Manager Functions. A new screen will appear with the web page divided into blocks. You can add more sections as needed, edit information in any section, or delete sections.
The Page Window Title Block is divided into three sections. The upper left corner contains the block identifier. The upper right corner contains the phrase "Edit Page Window Title," which is a link to the Title Block Edit Screen. The bottom section shows the current Window Title.
To change the Window Title, click on "Edit Page Window Title." The Window Title Edit Screen will appear in the web browser. The Window Title in now editable. Delete the old information and type a new Title in the blank. Save the information by clicking on the "Save This New Title" button. The HCC Manager Mode then processes the information, and the web page appears in the browser displaying the new window title.
| Note: Whenever you make a change to the web page's content, the program returns you to the updated web page with the Manager Mode box at the bottom. Return to the main Edit Screen by clicking on the "Edit this Page" link under Page Manager Functions. |
Page Style helps make a web page distinctive by allowing the Page Manager to customize text and link colors as well as the background. These elements can attract the viewer's eye and add emphasis to the information you are trying to convey. If the Page Manager chooses not to set these elements, the web browser uses its own defaults.
The second edit block on the Main Edit Screen controls the Page Style. Click on "Edit Page Style" to bring up the new Page Style Edit Screen. The first element to choose is the background. Two options are available, a background image or a background color. To use a background image you need to enter the image URL in the blank (see Appendix B). You can access images in the HCC Graphics Archive by clicking on the button at the bottom of the Edit Screen (see Section 6.2). Just copy the image's URL in the blank. If you would like to use your own image, your Directory Manager can upload a background image for you, in which case, you can will need to get the image's URL from her.
| Note: Background images must end with the .gif or .jpg extension. |
In the remaining blanks, including the one for the background color, enter the names of your chosen colors. To see a list of the possible color choices, click on the "Color Names" button at the bottom of the Page Style Edit Screen (See Appendix A). Once you have entered all your selections, click the "Submit Changes" button.
| Note: When entering a color name, the capitalization does not matter, but do not insert spaces between the words. |
- Headings (Section 5.6)
- Headings have specific characteristics, namely they are bold and have a blank line after them. Headings come in six sizes, one being the largest and six the smallest.
- Text (Section 5.7)
- Much of the material on your web page will be in a text form. The text block allows you to enter a great deal of information in one section, but the ability to format that information is limited. Advanced users can insert their own HTML coding to create a desired effect not otherwise available in the HCC Manager (see Appendix E).
- Lists (Section 5.8)
- Items in a list appear on their own lines often with a bullet or a number in front of each item.
- Lines/Rules (Section 5.9)
- Often referred to as a horizontal rule, it is a thin line that functions as a divider between sections of a web page. The Line/Rule typically spans the width of the screen, but it may be set to span only a percentage. The width of the line can also be defined. A graphic rule is often used like a line/rule to divide the sections of a web page. Graphic rules differ from lines/rules because they are graphic images and have the same characteristics of other images. (See Section 5.10 for information about images).
- Images (Section 5.10)
- Images add character to you web page. They can range from colorful divider rules to an image of your group's logo to photos of staff members. Web browsers display only two types of images: .jpg and .gif (see Appendix F). The picture's placement on the page can be designated (left, center, or right).
- End Image Wrap (Section 5.11)
- This element allows web page designers to adjust the flow of text around a graphic. Normally text flows around a picture based on the viewers' screen settings. End Image Wrap forces text to begin on its own line after the graphic.
- Counter (Section 5.12)
- This element lets Managers add an odometer style counter to the web page. The counter is incremented each time the page is viewed.
It is more difficult to decide on the location and type of block to insert than it is to actually insert one. After the phrase "Insert A New Block Here" is a list of possible block types. Select the type of block from the menu and click on it. The main Edit Screen will reload inserting the new block. Insert New Block Menus will appear above and below the block so you can place new blocks of information where you need them. Click the "Edit this ____ Block" to make changes to the new block.
If you have chosen the wrong kind of element block or the information in a block is no longer valid, click on "Delete This ___" found in the upper right corner of the information block. Choosing this option will completely delete the information contained within the block.
| Warning: You will be unable to retrieve the information in a deleted block. |
When you insert a new heading, it produces the default text stating "New Heading." Click on "Edit This Heading" to bring up the Heading Edit Screen.
In the new screen, delete the old heading and insert the text you want as the new heading. You will also need to select the heading size and alignment from the choices given.
Heading Size 1Heading Size 2Heading Size 3Heading Size 4Heading Size 5Heading Size 6 |
There are also several options you can apply to the heading. After selecting your options, click on the "Submit Changes" button.
- Use my line breaks
- A web browser automatically wraps text lines unless given a command to do otherwise. To control when text is separated, use the return/enter key to insert a blank line.
- Turn xxLINKxx(URL,TEXT) into clickable links
- Links are one of the most important characteristics of the World Wide Web. Links allow people to connect to areas related to the web page they are currently viewing, navigate within a web page, and move to pages on other web sites. A clickable link can be either text or a graphic. Section 6.5 gives instructions for making a link using the xxLINKxx option.
- I am not inserting my own HTML
- Unless you are using HTML coding, select this option (it is a default selection). If you do insert HTML coding and leave this option selected, your code will appear as text on the web page. (see Appendix E
Click the "Edit Text Block" in the upper left corner of the block to bring up the Text Block Edit Screen. You can add as much information in the text blank as you want. The method you use to enter the information depends on the options you choose. The web browser will automatically wrap text unless it is given other instructions by one of the options below. When you have entered everything to your satisfaction, click on the "Submit Changes" button.
| Note: Blank lines between paragraphs make for easier reading on the screen. |
| Note: If some information changes frequently and other information remains constant, enter the information into two separate blocks to make updating easier. |
- Center the text
- Each individual line within the text block will be centered. This may create uneven margins, depending upon the amount of text on each line.
- Use my line breaks
- Prevents text from automatically wrapping. It uses the line breaks you introduce with the enter/return key. You should keep in mind that different viewers have different screen sizes.
- Use my alignment
- Choosing this option is like using a typewriter. You can add extra spaces between words, but you must also hit the enter/return key whenever you want the line to end. This options also changes the font to a monospace, typewriter-like font. Tabs will also introduce spaces, but tabs do not always produce the desired alignment of text. In most cases, spaces are more reliable than tabs.
- Turn my blank lines into paragraph breaks
- Ends paragraphs and inserts blank lines based on your formatting.
- Turn xxLINKxx(URL,TEXT) into clickable links
- Links are one of the most important characteristics of the Internet. They allow people to connect to areas related to the web page they are currently viewing, navigate within a web page, and move to other pages on other web sites. See Section 6.5 for information about how to create a link in the HCC Manager.
- I am not inserting my own HTML
- Unless you are using HTML coding, select this option (it is a default selection). If you do insert HTML coding and leave this option selected, your code will appear as text on the web page. (See Appendix E.)
- Tabs to indent left margin
- Entering a number in the blank shifts entire text block over. This option may be very useful when using left-edged background graphics because you can move text into white spaces so it is more readable. On most browsers, the text is indented on the right as well.
Lists come in three types: bulleted, numbered, and definition. Once you have selected the list type and entered the information, the HCC Manager automatically adds the characteristics specific for that type of list (e.g. bullets, numbers).
- Bulleted list
- A bullet appears before each item.
- Numbered list
- Arabic numbers are automatically added.
- Definition list
- Main text and secondary text appear on separate lines, and the secondary information is indented.
Example of Bulleted list
Example of Numbered list
Example of Definition list
|
After you have inserted a new list block, click on "Edit This List Block" to bring up the List Edit Screen. At the top of the screen, you are given the choice of list type. In the upper right corner of the screen, there are also several options you can apply to the items.
- Use my line breaks
- A web browser automatically wraps text lines unless given a command to do otherwise. To control when text is separated, use the return/enter key to insert a blank line or to indicate the end of the line.
- Make main text bold
- The information entered into the Main Text blank for each item will appear in bold. The secondary text will still appear as normal text.
- Turn xxLINKxx(URL,TEXT) into clickable links
- Links are one of the most important characteristics of the World Wide Web. See Section 6.5 for instructions for creating a link using the HCC Manager.
- I am not inserting my own HTML
- Unless you are using HTML coding, select this option (it is a default selection). If you do insert HTML coding and leave this option selected, your code will appear as text on the web page (See Appendix E).
The first time you edit the list block, you will only be able to enter information for one item on the list. If you click in the box for "Insert New Item Here," a new edit list blank is added after you click the "Submit Changes" button. Once again enter the List Block Edit Screen to make changes and add more items.
| Note: You cannot automatically designate the number of items you want to use in a list. You must use the "Insert New Item Here" boxes. To speed inserting several items, click as many boxes as you need and/or have available, then click on the "Submit Changes" button. Repeat this process until you have enough list item blanks. It is often easier to delete extra blanks than it is to generate blanks. You may want to delay actually entering your data until you have accumulated enough item blanks for your list. |
You may want to reposition a list item after the information has been added. You do not have to re-enter the list information, merely enter the new rank of the item in the "Reposition this item to number" blank. You do not have to renumber every item, just the one(s) you want to change.
If you need to remove a list item, simply click in the box next to "Delete this item" on the left side above the individual item blank.
| Note: Make sure you are on the correct List Edit Screen to remove the item and not on the main Edit Screen which will delete the entire list block. |
When you have finished entering and making changes to the list information, click on the "Submit Changes" button.
Choosing a new line block inserts a thin, solid line across the width of the web page. To change the characteristics of the line, click on "Edit this Rule Block." When the new Edit Screen appears, you can choose from several options to customize the Rule.
| Note: Graphic images are also used as dividers. The lines/rules described in this section are limited in color and shape. By contrast, the colors and shapes of image dividers are limited only by the creativity of the artist. For information about graphics, see Section 5.10. |
- Thickness
- Enter any number between 0 and 100. The usual range is between 0 and 20. The thicker the line, the more definitive the separation between two sections, but excessively thick lines lose their impact.
- Width Across Page
- This element is more easily set using percentages than pixels or points. If using a percentage, include the percent sign (%) after the number. 100% spans the web page. If you use pixels, the line width will stay the same without regard to the viewer's screen size. Percentage is always dependent on the viewer's screen size.
- Line Style
- 3d shaded--the line is the same color as the background, but a shaded edge makes it looks as if the line is carved out of the background.
- Solid line--a solid line which may be black on some browsers or the same color as the text on other browsers.
- Alignment
- Not of much concern if the line is spanning the screen, but if you use smaller line widths, you can indicated the line's position on the page.
When you have made your choices from the options available, click the "Submit Changes" button. Your web page will appear in the screen reflecting your changes.
|
Line Thickness 1, Width Across Page 50%, Line Style Solid, Alignment Center
Line Thickness 5, Width Across Page 50%, Line Style Solid, Alignment Left Line Thickness 5, Width Across Page 75%, Line Style 3d shaded, Alignment Center Line Thickness 15, Width Across Page 20%, Line Style 3d shaded, Alignment Right |
When you insert an image block, an American flag icon appears as the default image. To replace it with your own image, click on "Edit This Image Block" on the upper left corner of the block. The new Image Edit Screen appears with a blank for the new image's URL (delete the words "default.gif"). If you are using the Graphics Archive, just copy the image URL from the Archive or from the Graphics Tester (see Sections 6.2 and 6.3). The Directory Manager can also upload images for you, and she will give you the image's URL.
You will also need to indicated the image's position on the web page. These alignment options are explained on the Image Edit Screen. There are also some optional characteristics you can apply to the image. When you are finished, click the "Submit Changes" button.
- Hot Link Address (URL)
- Enter the URL of the web page link to make the image clickable.
- Alternate Text
- Some web page viewers choose not to automatically load images or sometimes images do not load correctly. The alternate text lets the viewer know what would appear if the image had loaded. If the image is clickable, the alternate text will be as well.
- Border Width
- Borders create a picture frame effect around an image. If the image is clickable, the border will appear in the link color. If it is not clickable, it will appear in the normal text color.
| Note: If you are making the image clickable, it is helpful to add a border it. |
This element requires no editing, just insertion. Select "End Image Wrap from the "Insert New Block" menu. This element allows web page designers to adjust the flow of text around a graphic. Normally text flows around a picture based on the viewers' screen settings. End Image Wrap forces text to begin on its own line after the graphic.
Inserting a counter block places an odometer style counter on the page. The counter appears centered on a line by itself and is initialized to zero. The counter is automatically incremented every time the server sends the page to a browser.
By clicking "Set counter value", a Manager may set the counter to any value she chooses. Simply enter the desired value and click on the button labeled "Set Counter To This Value".
