Stripping Unwanted Tags
As you know by now, the <font> tag has become obsolete, but unlike the <b> and <i> tags, it has no easy counterpart with which you can replace it. The presentation details that the <font> tag was once used to specify are now handled with an entirely new technology: CSS. Thus, rather than a one-to-one fix as you did in the previous task, solving this problem requires two steps. First, you need to strip out all of the old tags. Second, you need to develop and apply CSS. You'll do the first of these two steps in this task. The second step forms the basis of Lesson 3.
Stripping out <font> tags might seem difficult. After all, given their many attributes, and the many possible values you can enter in the attributes, you can't just do a search for the <font> tag as you can with the <b> tag. You need to find a way to catch differences like the ones between <font color="#00FF00"> and <font size="+1">. Two workarounds to this issue spring to mind. You could search for the string "<font" without the closing ">," and then manually delete each instance. Alternatively, you could use regular expressions to construct a search for the font tag that includes any possible variation of attributes and their values.
NOTE
Regular expressions enable you to have the Find function look for patterns in text strings, rather than hard-coded strings. Regular expressions work by substituting wildcard characters for real characters and by providing other ways of describing patterns in strings. You can find a substantive introduction to regular expressions at the following URL: http://www.webreference.com/js/column5/. For the curious, the regular expression needed to find every instance of the <font> tag, in all of its variations, is as follows: <(font)[^>]*>
Dreamweaver makes what would otherwise be a difficult task an easy one. Its Strip Tag action does all the work of generating the right regular expression for you, invisibly, behind the scenes. When it is finished, it removes every instance of the <font> tag, regardless of its attributes and their values. At the same time, of course, it also removes the closing </font> tags.
Still in index.htm, open the Find and Replace dialog again, and verify that Entire Current Local Site is still selected in the Find In drop-down menu.
Once again, this step prepares you for the main work of this task.
With Specific Tag still selected in the Search For drop-down menu, select font in the HTML Tag List drop-down menu. If necessary, click the Remove Search Criterion (minus sign) button beneath the Search For drop-down menu.
As before, you are telling Dreamweaver what to look for, in this case all instances of the <font> and </font> tags.
In the Action drop-down menu, choose Strip Tag.
No other attributes appear, so you are ready to run the operation. First double-check to make sure your screen matches the screenshot. Mistakes made during Find and Replace operations can have painful consequences.
Click Replace All and then click Yes when the warning dialog appears.
As expected, the Results panel shows a fair amount of activity sitewide.
But the Results panel is not the only indication that the Find and Replace operation worked. Some of the text on index.htm changed. The Explore the Site heading at the top of the navigation bar is now smaller and is in a different font. The point to notice here is that this operation actually affects more than just the code; it changes the outward appearance of your page as seen in a browser (or Dreamweaver's Design view).
Save index.htm.
