FrontPage uses the tutorial's boilerplate theme

Source: Internet
Author: User
Tags border color character set

A boilerplate theme is used to define the background of a Web page and the page titles, bullets, horizontal dividers, and navigation buttons on the page, as well as the font and color of various text on the Web page.

Figure I

You can use the basic same interface in FrontPage's browser (explorer) and FrontPage Editor (Editor) to select your favorite boilerplate theme and apply it to your Web page, as shown in figure one.

In FrontPage Browser Application template Theme Select the "View" menu under the Model theme (Themes), showing the model theme menu, the menu is arranged on the left side of more than 50 kinds of Web site template theme name, the right is the preview window, you can click on the left side of the template theme of the name, On the right preview window to see the effect, select the favorite template theme, press the "Apply" button, your site will automatically have all the pages with you see in the preview window exactly the same color, font, pattern and other attributes.

In the editor of FrontPage, you can select subject (Theme) under the Format menu. The two approaches are basically the same, but the results are not the same: the template theme in the browser is for all pages of the current FrontPage Web site, while the template theme in the editor applies to only one page of the current edit and has no effect on other pages in the site.

There are three very important check boxes under the list of topics in the sample theme menu in Figure one:

With these three options, you can make a further definition of your selected boilerplate topic. In general, if your site's visitors have a lower browser version, or a slow network transfer, you should choose a simpler and more simple style of the page, as little as possible or not to choose these three options. Conversely, if you visit your site's browser version is higher (IE 4.0 and communicater more than 4.0), faster speed (especially for the local area network), you can take full advantage of these three combinations of options, design a dynamic, relaxed and lively web pages.

The properties of the navigation buttons on the Web page are specified in the navigation bar under the Insert menu in the FrontPage Editor, as shown in Figure Ii. To modify the properties of the navigation buttons that are already in the page, right-click and select FrontPage Component Properties.

Figure II

To remind beginners, the navigation Bar Properties menu does not modify the number of navigation buttons and the specific text on the button, which is arranged automatically according to the organization Chart of the Web site in FrontPage browser (Explorer), and each box in the org chart represents a page. The text in the box is the text that appears on the navigation buttons on the Web page, and the text on the button can only be modified in the FrontPage browser (Explorer) Web site organization chart, not the page that appears in the org chart, and there is no corresponding navigation button. See figure Three.

Figure Three

Template Theme properties in the use of the process can not be modified, although we can use the model theme easy to design the appearance of a professional level of the site, but if everyone from these 50 kinds of model theme to choose their own web site style, on the internet will have how many familiar faces AH?! Fortunately, the FrontPage CD-ROM. There is also a gadget for the unwilling mediocrity of the designer, FrontPage Theme Designer, use it you can easily design and modify only your own, the world's only unique theme style

 I. The composition of the model theme (theme)

Each Web site uses only a subset of the boilerplate topics when applying boilerplate topics, but a complete boilerplate theme must include the following sets of configurations:

1. Basic Configuration

Applies to the entire boilerplate theme settings.

The name of the boilerplate subject, the font fonts for the title and body, the pattern of the whole station navigation button, and the background pattern

2. Simple pattern

A boilerplate theme member that is used when the use more beautiful pattern (Active Graphics) check box is not selected.

a page title pattern; three levels of GIF bullets; a pattern of horizontal navigation buttons; a pattern of a vertical navigation button; A set of home, Next, Previous, and up navigation buttons.

3, lively pattern

Active Graphics The boilerplate theme members that are used when the use more beautiful pattern (active Graphics) check box is selected.

A page title pattern (optional animation); a pattern (optional animation) of a horizontal separator line; three-level GIF bullets (optional animation); Three patterns for horizontal navigation buttons to build "dynamic buttons" (normally, when changed, pressed), and three vertical navigation buttons to build a "dynamic button" (usually , change, press after); three groups of home, Next, Previous and up navigation buttons used to build "dynamic buttons" (usually, when changed, pressed after)

4. Basic color

A boilerplate theme member that is used when the use active color (Vivid Colors) check box is not selected.

Default text color-usually black or dark; three hyperlink colors (current, inaccessible, and accessed), three-dimensional table border color (usually Automatic/gray), Web page background color (usually light or white)

5, lively color

A boilerplate theme member that is used when the use active color (Vivid Colors) check box is selected.

Default text color, three hyperlink colors, three-dimensional table border color, Web page background color

It is essential to note that the pattern of the same category in all boilerplate topics should be consistent in size to ensure that the layout of the Web page does not change when various boilerplate themes are applied.

  Second, the design of Model theme (THEME) skills

1, the font settings

Unlike word processing software such as Microsoft Word, you cannot precisely define each font size in an HTML language, it provides only seven settings, and these seven settings are controlled by a Web browser rather than a Web page designer.

When choosing a font for a boilerplate theme, you must also consider the versatility of the font you use, if you have a "amber" font for the title of the boilerplate theme, it is likely that you will not have the desired effect on the Web page, as many users browsing your Web page will probably not have the fonts installed! If you use a less common font, in addition to a handful of Windows system fonts such as Arial, Times New Roman, Courier new, Arial, and bold, you must also prepare one or more alternative fonts for your chosen font. If your preferred font is not installed in the user's machine, you can use your second and third selected fonts.

2, design of the pattern

The appropriate pattern will add to your Web page, the title and the quality of the button directly affect the beauty of the Web page. When designing a pattern for a boilerplate theme, consider the following issues:

The Harmony of color

The versatility of a pattern

The fun of the animation

3, the arrangement of the text

In the sample theme of the pattern is generally no text, the title and button on the text is specifically applied to a website, according to the user's site organization chart to fill out. When designing a sample theme, we need to specify properties such as font, color, and so on for the caption and the text on the button.

When designing a pattern above which you want to arrange text, we need to describe these attributes of the text:

Font for text

The color of the text

Horizontal alignment

Vertical alignment

Patterns with text arranged above in the sample theme must be saved in GIF format.

4, the use of transparent pixels

The specific size of each pattern in the sample theme is fixed, and when you have a smaller pattern for the sample theme, you need to fill in the transparent pixels around it to ensure that the sample theme you are designing will not change the page layout and arrangement of the pages in a specific application.

All navigation buttons (top, horizontal, and vertical) are tightly aligned, and can be achieved by filling in some transparent pixels if you prefer a certain interval between them.

5, the use of dynamic effects

The dynamic effects on Web pages include two implementations: GIF animations and dynamic buttons. Applying dynamic effects properly can make your Web page more lively and angry, but it can also affect the speed of downloading pages because of the large file. Therefore, each sample theme of the page title, horizontal divider, the standard symbol of the best only one using GIF animation, the image using gif89a format.

When you configure a dynamic button, in addition to defining the corresponding text attributes and a button pattern for a button, just like configuring other normal buttons, you need to give it an additional two patterns, one that is used when the button is changed when the mouse pointer is over it, and another is the pattern that is pressed by 钮巳.

6. INF file for sample subject

Each sample topic is managed and controlled by two files with an inf extension. One is each sample subject-specific INF file. inf, this file's instructions only control this one sample topic, in addition, there is a top-level file themes.inf, its instructions control all the sample topics installed on the computer. The text fonts defined in the FrontPage sample topics are default to the windows-1252 character set, and should be described in the Themes.inf file if the page is saved in another character set.

Each sample topic has a specific INF file. inf.

For example, the contents of the Arcs.inf file are as follows:

[INFO]

Title=arcs Sample Topic Display Name

codepage=1252 The Windows code set used in this file

Version number of the VERSION=01.01 sample topic

Readonly=true whether to allow modifications

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.