| Tutorial Introduction | Getting Started | Page Properties | Text | Tables |
| Images | Links | Publishing | Templates | Collaborating | Dreamweaver Resources |

Dreamweaver Tutorial: Text

| Properties Window | Cascading Style Sheets | Checking Spelling |

As you work with Dreamweaver, you'll probably notice it's similar in many ways to the programs you've worked with in the past, such as Microsoft Word. There are many options and features that indeed work in very similar ways to these other programs. Some of these most basic features are working with text, and formatting that text.

To begin adding text to your web page in Dreamweaver, use your cursor to click on the background of the page and simply type.

Properties Window

Editing text with Macromedia Dreamweaver is not very different from editing with a word processor. The only difference is that in Dreamweaver, text format and other properties are not controlled in the main menu at the top of the screen, but in a window called "Properties." If you don't see the Properties window, go to the menu at the top of the page, choose "Window," and click "Properties" to make sure the Properties window is available to help you edit text.

It is recommended that you close all other windows other than the Properties window to keep your desktop from getting cluttered. The Properties window looks like the image seen below:

You will use the Properties window to format and edit most of your content on your web page. Please note that the Properties window does change appearance depending on what sort of content you are working with. For example, editing text makes the Properties window appear one way, while editing a table makes the window appear in a different way. We'll get back to the different states of the Properties window when we talk about tables in the next section.

Right now, let's take a look at the different features of the Properties window. The numbered list below corresponds with the numbers on the image of the Properties window. Use this image to aid you in learning the different features of the window.

1. "X" - closes the Properties window
2. Format - allows you to set paragraph formats to text (such as heading text, or paragraph text)
3. Font - allows you to change the font style of selected text (such as Arial or Times New Roman)
4. Size - allows you to change the size of selected text
5. Text Color - the square on the left lets you change text color by selecting a color with a color palette. The rectangle on the right allows you to change the color of text by entering its hexadecimal value
6. Bold - allows you to make selected text bold
7. Italics - allows you to make selected text italic
8. Align Justification - allows you to align text. You can align left, center, or right
9. Link - by entering a URL (website address), you can turn selected text into a hyperlink
10. Lists - allow you to create text lists. You have a choice between using an unordered (bulleted) list, or a numbered list
11. Text Outdent/Text Indent - allows you to shift the alignment of text by outdenting or indenting it
12. Window collapse - this triangle collapses the Properties window, either increasing or decreasing the number of tools it shows

As you can see, the Properties window has similar functions used in word processing programs.

Return to Top >>

Cascading Style Sheets

The "Text" menu on the top toolbar of Dreamweaver has many of the same functions as the Properties window, such as allowing you to format your text, align it, etc. There are also two more options available to you in the text menu, however.

As you have learned, a "style" is a specific format applied to either a small or large sample of text, over the range of one or many documents. You can use (or even create) a "style" that you can apply throughout your document (or documents!) to any variety of text to keep a common look and feel throughout your pages. These are called "Cascading Style Sheets." The power of CSS is that you can format text with a style sheet, change the format of the style sheet, and all text that has that specific style sheet applied to it will automatically be updated to the new style. This is the perfect solution for those working with large amounts of pages they would like to keep consistent in style.

To view the available style sheets, use the "Text" menu, and go to "CSS Styles." The following window should appear:

You are free to apply, as necessary and appropriate, styles to your document. However, it is in no way necessary if you are creating small pages that are easy to format on their own. This is more of an advanced feature, but should be learned in order to be applied in possible future projects.

Return to Top >>

Checking Spelling

Possibly one of the more overlooked features of any program is the ability to check your spelling. This is essential for a website. Think about it: if CNN or MSNBC were to make a large amount of spelling errors on their news sites, would they be taken seriously? Of course not. You want to portray yourself in an intelligent manner on the Internet. Be sure to use the spell checker. You can access it by using the "Text" menu, and clicking on "Check Spelling" at the very bottom. The keyboard shortcut is "Shift+F7." See image below:

Return to Top >>

Next Step --> Tables