Creating and Editing Web Content

At the most basic level, the Web developer needs to create and edit Web content. FrontPage provides the tools and interface to make this approach as easy as possible.

The Different Views

Different elements of the Web design process require different ways of interfacing with your content and Web site. Instead of using a single interface that attempts to meet all needs, FrontPage 2003 provides a series of views that present the necessary data in a format advantageous to the specific instance:

• Design View The most basic of views as seen previously in Figure 2.1. Design view is the WYSIWYG (what you see is what you get) interface for FrontPage most similar to other Microsoft Office products. Most users will find that most of their work is done in Design view.

• Code View When you need to interface directly with the code behind your HTML pages, Code view provides an interface for doing just that.

• Split View A much requested feature new to FrontPage 2003 is a Split view that allows the user to see both the Design and Code views and how they interface with each other. Selecting elements in one panel will highlight the corresponding elements in the other pane, as shown in Figure 2.4.

  Figure 2.4. The Split View new to FrontPage 2003 gives the ability to see both the code and the Design view that the code will produce.

  

• Preview View During the development process, most users want to see how their product would be presented in a browser window. This is most often a request of users developing in Code view, but it is also often to test the functionality of page that can't be tested in Design view. Viewing the content in Preview is different from viewing the content in a browser because the content is rendered much quicker as it is part of the FrontPage 2003 interface.

  NOTE

  Preview view should never be used as a replacement for viewing site content in a browser. Preview view is a way to quickly see how your content is most likely to be presented in the version of Internet Explorer installed on your system.

  Because Preview view is contained in the FrontPage interface, it typically won't show you your site content in the proportions of the traditional Web browser. Viewing the content in a browser is the only way to get that perspective.

  Because the content is shown through Internet Explorer's engine, you will need to remember that same content might look considerably different in other browsers such as Netscape and Opera.

  
  

• Folder View When a user needs to see the entirety of his site content and how it is organized, Folder view (shown previously in Figure 2.2) provides a view of your site similar to the Windows Explorer interface. Like Windows Explorer, content can be moved from one folder to another through the familiar drag-and-drop interface.

• Navigation View If desired, you can maintain a site's navigation structure through FrontPage 2003. The Navigation view will provide an overview of your site in terms of site navigation.

• Reports View FrontPage provides numerous reports of site health and content in addition to traffic reporting (when made available through server extensions). The Reports view lets you examine such reports.

For more detailed information on FrontPage views, see "FrontPage's Views," p. 61.

Developing the Basic Page

There should be no hesitance when using FrontPage to design basic site content. The interface is easy, self-explanatory, and provides most of the tools needed to add most types of content to your Web site.

A basic Web page can quickly be developed through the Design view. The interface is familiar to most users enabling the quick entry of text, lists, and tables. In Figure 2.5, the user quickly developed some basic Web content with a hyperlink and basic formatting.

Figure 2.5. Design view makes it easy to design Web content.

For more on basic page and content development with FrontPage 2003, see "Developing the Basic Page: Text, Lists, and Hyperlinks," p. 77.

Advanced Find and Replace

Beginning Web masters are often surprised how quickly their site grows in size. What was a simple five page information site a few months back can explode to a site of hundreds of pages or more.

No developer should be expected to memorize and track every element of every page in an exhaustive Web site. In addition, the Advanced Search and Replace features in FrontPage 2003 make such a requirement pointless. As can be seen in Figure 2.6, a site-wide search for the smallest of terms can be made through a single interface.

Figure 2.6. The Find and Replace dialog box lets you search an entire site for a specific word or phrase and replace it with the content of your choice.

NOTE

If you were put off by the Find and Replace feature of previous versions of FrontPage, take another look. The tool in considerably more powerful this time.

The use of Find and Replace is not limited to site content. Source code and HTML tags can be run through the same tool to fix mistakes made on a site-wide basis. In Figure 2.7, the developer mistakenly referenced the wrong URL throughout his entire site and was able to fix it with a single click.

Figure 2.7. The Find and Replace dialog box enabled the site developer to change all references to a specific site.

NOTE

Frequently used queries can be saved through the Find and Replace interface for reuse later.

For more on FrontPage 2003's expanded search and replace feature, see "The Improved Find and Replace," p. 101.

Graphics and Multimedia

Obviously, a Web site needs more than text. The graphics and multimedia tools offered by FrontPage 2003 make the integration of such content quite easy.

Only a small percentage of FrontPage users realize that the purchase of FrontPage 2003 includes the ability to use an extensive online library of clip art and multimedia. The library continues to grow in size and is a considerable resource for those who use the feature. An example of an obscure search can be seen in Figure 2.8.

Figure 2.8. The online Microsoft Clip Art library contains more content than most people would guess.

In addition to the Clip Art library, is easy to add pictures from external sources as wide-ranging as other Web sites, other devices (you can pull a digital photo from a camera and place it directly on your Web page), or other content sources such as clip art CDs.

The addition of Flash content is much easier with FrontPage 2003 and no longer requires a plug-in or tool (or careful HTML manipulation) to accomplish. Video and audio can also be added quickly to your site.

For more on integrating graphics and multimedia with your site, see "Enhancing Pages with Graphics and Multimedia," p. 113.

Themes

Not everyone has the ability to design a great looking site out of the box. FrontPage provides the ability to give a site a uniform look and feel using themes. In Figure 2.9, the resume page created earlier in this chapter looks a lot better with the application of a FrontPage Theme.

Figure 2.9. The example page from Figure 2.5 looks a lot better with a FrontPage Theme applied to it. The total transformation happened in two seconds.

NOTE

The Themes process has not seen any major improvements since they were first introduced, and many prefer the use of FrontPage templates.

For more on using Themes with your site (as well as some of the potential problems of using this tool), see "Using Themes," p. 133.

Navigation Tools

As sites get bigger and bigger, the flow of a site becomes harder to manage and visualize. At the same time, the addition of content to a site navigational structure requires updating other pages in the site to reflect changes made. FrontPage 2003 comes with a set of navigational tools that can be used to both design the site navigation and manage corresponding links throughout the site as needed.

In Figure 2.10, the developer has linked his site pages together in a layout that makes design and navigational sense. This was done by moving the files from within the Navigation view.

Figure 2.10. Navigation view allows the developer to put together a site in a logical design and navigational fashion.

Once a site's navigation has been set, FrontPage navigational elements can be inserted that are dynamically updated as needed as new content is added to the site.

For more on using FrontPage's Navigation tools, see "FrontPage's Navigation Tools and Elements," p. 147.

Web Components

Web sites often require more complicated content than traditional HTML can provide. Although in some cases this requires special coding or scripting, in other cases FrontPage Web Components can be used to bring content to the site without the need for any additional programming. Web components are additions to FrontPage built for the specific purpose of integrating such code in to a FrontPage Web site without requiring additional programming.

Although Web components can be specifically built to meet specific needs, a number of Web components come built in to FrontPage 2003, including a component that integrates a map in to your Web site from Microsoft's Expedia Web Services. An example of this Web component can be seen in Figure 2.11.

Figure 2.11. The FrontPage Expedia static map plug-in lets you place a map from the Expedia Web Server in to your site without entering a single line of code.

Some of the most powerful Web components in FrontPage are the included content components that let you add additional HTML content to a Web page. This can be set to happen at a specific time, allowing you to update your site without having to be there. Another powerful implementation of this component comes from creating specific site elements such as headers and footers and using the included content components to insert these elements in to your site's pages. If done properly, a single header file could be updated, resulting in a new header information throughout your entire site.

For more on the Web components that come with FrontPage and their use in the Web design process, see "Using Web Components, Shared Borders, and Link Bars," p. 167.

For more on making your own FrontPage Web components, see "Making Your Own Web Components," p. 965.

Tables and Frames

Some of the more detailed HTML layout effects popular on the Internet are done with HTML Tables and Frames. FrontPage 2003 provides solid tools for integrating both of these in to your Web design process.

The table features in FrontPage 2003 have been considerably enhanced. In addition to the new Tables toolbar seen in Figure 2.12, a new Layout Tables and Cells task pane (seen in Figure 2.13) provides table layout options that can be added to your site with the click of a mouse.

Figure 2.12. The new Tables toolbar provides considerable options for table development within the Design view.

Figure 2.13. The New Layout Tables and Cells task pane provides additional options for table development within the Design view, including several predesign table layouts for easy insertion.

Although the use of Frames in Web design is a stylistically and functionally debated feature, FrontPage provides a solid toolset for working with frames, including a series of premade framesets that can be easily edited from within FrontPage.

For more on the new Table tools in FrontPage 2003 and the use of Tables in Web design, see "Using Tables," p. 189.

For more on the Frames tools provided by FrontPage 2003 and the examination of the problems they present, see "Enhancing Web Sites with Frames," p. 219.

Accessibility Features

The development of an accessible Web site is becoming an important legal and design issue for many. FrontPage 2003 introduces an Accessibility Checker, seen in Figure 2.14, that can compare your site with the latest accessibility standards and suggest areas of improvement.

Figure 2.14. The new FrontPage 2003 Accessibility Checker will quickly show you how your site rates in terms of current accessibility standards.

Now you can develop your site with accessibility standards in mind and make sure that your project meets industry standards.

For more on accessible Web design and using the FrontPage 2003 Accessibility Checker, see "FrontPage's Accessibility Features," p. 235.