This article features a step-by-step guide to working with the Site Map to create the basic outline of the site so you can visually framework your site and the relationships between the pages. Also learn how Dreamweaver makes it simple to ease into server-side work. (This is from the book Dreamweaver MX 2004: A Beginner's Guide, McGraw-Hill, ISBN: 0-07-222996-9, by Tom Muck and Ray West.)
Planning the Site - Use Site-Wide Find/Replace (Page 7 of 7 )
Dreamweaver is a Web application development tool. When you use Dreamweaver, you will be working on one document at a time, but the whole site should be your focus. One feature that you may find very handy is the Find/Replace dialog box.
Find/Replace has become a standard feature in most computer programs, and one of the most often used features, as well. One thing you might not be aware of, however, is that in Dreamweaver you can do the searches on a site-wide basis. This makes it especially handy for changing something that is on every page in the site, such as a color.
The Find/Replace dialog box has several unique features that bear mentioning.
This drop-down list gives you several options for finding text and code within your site:
Current Document This is a standard search in the currently open document.
Entire Current Local Site This option allows you to do a site-wide search and replace.
Selected Files In Site This option allows you to select multiple files in the Site window and restricts your search to certain files.
Folder This option allows you to do searches on any folder on your hard drive. In effect, it turns Dreamweaver into a powerful search-and-replace tool that you can use outside of Dreamweaver.
This is a drop-down list that gives you four options for items you may want to search:
Source Code This option allows you to search throughout the source code of your page—scripting, server-side code, tags, and actual text all fall under this category. In short, if it’s in the document in any form, you can find it with this option.
Text This option narrows the search to the actual text that is viewable on the page. For instance, if you want to search for the word “color,” but you don’t want to match the instances of the word in the HTML, you could use the Text option.
Text (Advanced) This option allows you to refine your search to text that is contained within certain tags or outside of certain tags. Further refinements and several other options can be accessed by clicking the plus (+) button.
Specific Tag This option not only allows you to search for specific tags but also to search for attributes within those tags and even set the attributes for a tag site-wide. For example, if you want all <td> tags to have a mouseover attribute set to a certain function, you can do it here. Or, if you want all <font> tags with a size of 2 to have their size attribute changed to 3, you could do it with this feature.
The options for the Find/Replace dialog box are shown as check boxes and are as follows:
Match Case This allows you to match only those words that match the case exactly, so “font” wouldn’t match “Font.”
Match Whole Word This allows you to match only the entire word, so that a search for “rich” would not find “Richmond.”
Ignore Whitespace This allows you to do searches where spaces, line feeds, and tabs have no effect on the outcome of the search.
Use Regular Expression If you know how to use regular expressions, you can take advantage of the powerful RegExp features of the Search/ Replace dialog box. For example, to search for all instances of items contained within quotes, you could use the following RegExp, which searches for a quote and then finds all characters up to and including the next quote character that it finds:
If you were to search the source code of your document, and the document contained the tag
<table width"100%" border"1">
your search using the preceding regular expression would find two matches:
What to Take Away from This Module
You should now know a few things about creating navigation schemes. You learned some of the generally accepted principles of site design. The Site Map was used in a project to show you a method of developing a graphical representation of your site, while at the same time creating the links for the site navigation. Some of the collaboration techniques available in Dreamweaver were outlined, including the use of design notes. Finally, the Find/Replace dialog box was explained.
Module 6 Mastery Check
Will the Site Map feature of Dreamweaver work without a home page?
How are design notes stored in Dreamweaver?
Does Dreamweaver’s Find/Replace feature work outside the site you are currently working on?
Do all the files in your Site window show up in the Site Map?
What is a regular expression?
Name two site design no-nos.
What are some questions you need answered about your target audience?
What collaboration features help make sure that team members do not overwrite each other’s work?
Page load times should be limited to about ______________ on a 56K modem.
What is a translator?
This chapter is from Dreamweaver MX 2004: A Beginner's Guide, by Muck and West (McGraw-Hill/Osborne, 2004, ISBN: 0-07-222996-9). Check it out at your favorite bookstore today. Buy this book now.
DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware.