Working with Invisible Elements

This tutorial will go over working with invisible elements in Dreamweaver CS5.

As you would expect, most of the content on pages is visible to users, and it is visible to you when you are designing and building your pages.

However, there are some elements on a page that are normally hidden, and we're going to look at the control of invisible elements in this section.

A paragraph of text on a page is an example of a visible element. However, there are various elements associated with this, such as the anchors that position that paragraph on the page or line breaks in the text, that you may not want or need the visitors to your pages to see.

Invisible Elements

To see some categories of invisible elements, select Preferences... from the Edit menu, then select the Invisible Elements category.

This page shows which of the available invisible elements will normally be shown when working on a page. For each of them the icon that represents that element is also shown. The settings shown here are pretty much the default ones with Dreamweaver.

Many of these terms may not yet mean much to you, but we'll be coming across most of them later.

Let's just look at one or two specific items now.

If Scripts is checked, Dreamweaver will display the icon shown to mark script, notably VBScript or JavaScript.

Towards the bottom of the list is a dropdown for Show Dynamic Text As.

This is used to mark dynamic text. As we saw earlier, it is possible to put dynamic text on a page,e.g. text from a database that may depend on the user, a particular situation or even something like the time of day.

Another important concept in Dreamweaver is the inclusion of content that has been provided by a web server, referred to as server-side includes. The bottom option on the page makes it possible to specify whether or not the content of server-side include files is shown.

Once these preferences are set, you can show or hide the selected invisible elements at any particular time using the fly-out menu from Visual Aids on the View menu. The bottom option on the fly-out lets you choose to show or hide the selected invisible elements at any time.

We'll be looking at the Visual Aids menu again later on.

More Dreamweaver CS5 Tutorials

All Dreamweaver CS5 Tutorials - Will be complete by Januay 2011.
Buy Dreamweaver CS5

Find this website useful?

To link to this page from your website, simply cut and paste the following code to your web page.

It will appear on your page as: Working with Invisible Elements in Dreamweaver CS5