Artipot - Free Ezine Articles
 
Home » Internet » Web Development

Working With HTML text In Dreamweaver CS4

By Daniel Roberts
Oct 6, 2009
Although Adobe Dreamweaver is a visual editor it is not a word processor; and, therefore, the text it allows you to create is HTML text and HTML handles text in a different way to print-oriented environments such as word processors and DTP packages. Although adding text to your web pages feels kind of similar to working in any text editor, you will sometimes find a few quirks in the way that Dreamweaver handles text.

Firstly, there is the question of structure. Browsers assign a structural importance to text based on the HTML element which contains them. Text inside a heading element, such as h1 or h2, is given more prominence than text contained within a paragraph element. Dreamweaver uses the paragraph element as the default container for text; so, if you create a blank page in Dreamweaver and type some text, as soon as you press Return, your text will be placed inside a paragraph element.

The same result is achieved whenever you paste text from another environment. Dreamweaver will recognise returns and use them to split the text into paragraphs. It will also attempt to translate any formatting to its nearest HTML equivalent. Thus, if you copy some data from an Excel spreadsheet and paste it into an HTML page in Dreamweaver, you will end up with a table containing the Excel data. Similarly, if text from Word which has been formatted using Word styles such as "Heading 1", "Heading 2" and "Normal", Word will place all "Heading 1" text inside h1 elements, "Heading 2" text inside h2 and "Normal" text inside paragraph elements.

As they edit their text in Dreamweaver, users who are unfamiliar with HTML may be occasionally confused by the fact that Dreamweaver treats text as a separate entity to the element that contains it. Thus for example, in design view, if you triple-click on a heading to select it, what Dreamweaver actually selects is the text inside the heading. The heading element itself is not selected. Once users are familiar with HTML, this behaviour becomes less confusion.

Dreamweaver's tag selector feature is a great way of keeping tabs on the HTML elements you are generating and manipulating while working in Design view. The tag selector is the area on the left of the status bar at the bottom of the document window. It displays the tags representing the element which contains the currently highlighted item. These tags can also be used to select an element and its contents. Thus, to select a heading, ignore the text and just click on the tag representing the element which encloses it.

A lot of new users get seduced by Dreamweaver's split screen view where code and design views are each allocated half of the screen. Unless you creating something fairly intricate, like a complex form, split view is a bit wasteful. Just looking at the tag selector is usually enough to let you know what HTML elements you are working with.
About the Author
Please Rate:

Rating:

(Average: Not rated)
Views:40 
Print Article Email Article Reprint Article Comments (0)
More Articles from Web Development
Top Articles in Web Development