Prof Al's Quill Pen Prof Al's Inkwell

W orking with color models: When you create a document in Fireworks, you have a wonderful diversity when it comes to color. In addition to using the default Web Safe 216 color palette, you can specify color using several other color models. In order to specify a color model, you must first open the Color Mixer, by choosing Window > Color Mixer.

The Color Mixer:The Color Mixer displays the color palette of the values of the active solid color, which you can also view in the Fill Color box or Stroke Color box on the Tools panel or on the Properties Inspector. You can edit color values to create new colors by changing the values for each color component of a color model.

Selecting Hexadecimal Colors: If you need to match colors used in a Web page document that exists, you can easily do so in the color mixer. Just specify that the Color Mixer uses Hexadecimal. The syntax for Hexadecimal (normal for the Web), is a pound symbol # first and then two numbers or letters for each of the three color groupings, Red, Green, and Blue. In the light palette, red, green, and blue combine to equal white light.

Hexadecimal is not like the normal decimal numbering system; it has 16 instead of 10 as the base. For example, it uses only single digits for counting, so it can’t even use 10, 11, 12, etc. so after it reaches the end of our 0 to 9 numbers it uses letters for 10, 11 and so on. This is the numbering string in Hexadecimal:
0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. And, here is something else to deal with, in Hex you start counting with the number zero 0, and if you do that you’ll see that when you get to the letter F it ends up being 16 in our base ten system.

In Hexadecimal, zero (0), equals no color or black, and F equals the maximum color available. The color Black would be #000000, or the total lack of color. The color White would be #FFFFFF, or the total amount of color combined.

The letters or numbers are three groupings of two, with the first two used for RED, the second two used for GREEN, and the last two used for BLUE. It’s always in that order too.
So, Red would equal #FF0000, all red, no green, and no blue.
And, Green would equal: #00FF00, no red, all green, and no blue.
And, Blue would equal: #0000FF, no red, no green, and all blue.

Well, you know now at least five colors in Hexadecimal, it’s a start, there are over 16.7million colors available from these combinations. WOW.

Here is a Tip Worth Knowing: The first letter or number in the grouping of two is much more powerful decider of color. Think of it this way, if we were talking about money, wouldn’t .90 be more money than .09? You make big adjustments to color with the first number or letter, and minor adjustments to color with the second number or letter. And lastly, to use letters and numbers to create only Web Safe colors use only these combinations: 0, 3, 6, 9, C, and F. Notice it is counting by threes in the base 10 system, with C being 12, and F being 15, if that helps you.

U sing Text: The Fireworks text features typical to most desktop publishing programs; however, you must first click the Text tool to see the options available to you in the Properties panel. All the features you found useful in Dreamweaver are exactly the same in Fireworks, so refer to the Dreamweaver Text page for a review if needed.

Attach Text to a Path:Working in a graphics program parts company from the Text Editors, such as Dreamweaver, when it comes time to create graphic images from the text. For example, attaching Text to a Path is quite easy to do. Your text being a vector object can be attached to a curved line which is also a vector object.  A path is an open or closed vector consisting of a series of anchor points. Anchor points join path segments whether a corner or a curve. To create a path, you use the Pen tool to define points in your document, and then attach the text to it. You can edit text after you’ve attached it to a path.

The line tools such as the Pen and Brush tools are not the only tools you can attach text to, the Basic Shape tool and the Auto Shapes tool work as well.

Please note for future activity, you can also edit the path, but it must be detached from the text first. After editing the path you can reattach it to the text as before.

Editing the Paths: To edit a path, you adjust the anchor points. To adjust the anchor points, select the path, select the Sub-Selection tool and then drag points to new locations on the path as desired. You are allowed to change the appearance of the text on a path by changing its alignment, orientation, and direction.

Convert Text to Editable Objects: You can also convert text to editable objects. When you convert a text object, you can use any of the drawing tools to edit the shape.  To convert the text object, select it with the Pointer tool and then choose Text > Convert to Paths.

Create a Text Mask: There might be an occasion when the text on your page would look cool if it was made up of images instead of a solid color or texture. Creating Masks is easy to do and there are several exercises in this section that give you a chance to try it for yourself. This is how you can create a Text Mask:

  1. Import a bitmap image into the document.
  2. Create a block of text, and then position it over the part of the image you want to show through the text.
  3. Select the text and choose Edit > Cut.
  4. Select the bitmap and choose Edit > Paste as Mask.

To Edit the Masked Bitmap, do the following:

  1. Select the Masked bitmap with the Pointer tool.
  2. Change the position of the bitmap relative to the Text Mask, click the blue dot in the center of the Masked Bitmap and drag it to reposition the bitmap within the Text Mask.

TOP

 

Valid CSS! | Valid XHTML 1.0 Transitional | Level Triple-A conformance icon, W3C-WAI Web Content Accessibility Guidelines 1.0 |

W3C Valid CSS |     W3C Valid XHTML 1.0 |     WAI AAA Conformance |

Site created by: Professor Al Fichera Contact: al.fichera@gmail.com Updated on: January 11, 2011