Using Dreamweaver
by Vivienne Trulock
Users of this site also found these sites useful
Dreamweaver MX Tutorial
Created and designed by Vivienne Trulock for ilikecake, 2005
Text properties
The first exercise will be to look at the text properties window. This is where we will set the properties of the text in our first web-page. Many beginners are happy to use these text properties, though more advanced users prefer to use style sheets for greater control and increased accessibility.
Open up Macromedia Dreamweaver (Start > Programs > Macromedia > Dreamweaver MX). A new page is created as you open the program. Open the Properties menu (Window > Properties) - this is where you set your text type, colour etc.
This is what the properties window looks like for text. This window will change depending on which element of the page is selected.
Text Formatting
The format option allows you to convert text to different default styles.
The level 1 header option should only be used at the top of a page. Subsequent
headers should occur in numerical order within each section. This is important
for accessibility. Screen readers used by the visually impaired use headers
as an aid to navigating the page.
Try out the different sizes of headers.
Changing Fonts
The default font option allows you to select the font face. The font face will only display accurately if the user has the same font face on their machine, hence several font face are in the same selection. If you select Arial, and the user doesn't have Arial installed on their machine, their computer will use Helvetica. If it has neither of these, a generic sans serif font will be chosen.
Sans serif fonts, such as Verdana or Arial, are thought to be the best
for online reading as they are 'cleaner' looking.
NOTE: The default font option as outlined above uses the <FONT> tag which has been deprecated. Therefore, it is not recommended to use this option. The style sheets method of formatting text is preferred.
Text Size
Size of text can be changed by selecting a number in the size window. You should first select the text you wish to change the size of.
NOTE: The text size option as outlined above uses the <FONT> tag which has been deprecated. Therefore, it is not recommended to use this option. the style sheets method of formatting text is preferred.
Text Colour
The colour of the text can be changed by selecting the text and either clicking on the box and selecting a colour from the palette, or by typing in a specific hexadecimal value in the text box.
The colours shown in the palette are all web-safe colours, meaning that all computers with 256 colours can display them accurately.
Non web-safe colours can be selected by clicking the colour wheel icon on the top right.
NOTE: The text colour option as outlined above uses the <FONT> tag which has been deprecated. Therefore, it is not recommended to use this option. the style sheets method of formatting text is preferred.
Other
Otherl text formatting like bold, italic, unordered lists and ordered lists can also be selected and applied to the text.
NOTE: the ALIGN button as shown in the image above uses the <p align=""> attribute. The align attribute used in the <p> tag has been deprecated. Therefore, it is not recommended to use this option. The style sheets method of formatting text is preferred.
NOTE: the indent and outdent buttons as shown in the image above use the <blockquote> tag. The <blockquote> tag should only be used to mark up quoted text. Its use as a text indent is incorrect. Therefore, it is not recommended to use this option to indent text. The style sheets method of formatting text is preferred.
