 |
 |
All Products | Support | Search | microsoft.com Home | |
 |
 |
||
|
|
|
|
 |
|||
| Microsoft Typography | ...on the Web | ...embedding | ...WEFT 2 | WEFT 2 tutorial |  |
||
 |
|||
|
For font objects to work properly the concept of 'allowed roots' also know as 'URL binding' needs to be understood. Have you ever created original GIFs and JPEGs for your site, only to discover weeks later that someone has been reusing them on their site without your permission? Have you ever thought how great it would be if your images could somehow be tied to your site's address so that they couldn't be reused in this way? Tying or 'binding' a GIF to a particular Web site URL isn't yet possible, but URL binding is a feature, and W3C mandated requirement, for font objects distributed over the Web. Misunderstanding or mistyping allowed roots is the main reason why font objects fail to work. This tutorial should help you avoid these problems.
Before starting make sure you have all of the necessary ingredients in place.
Make a note of the addresses that will be used to access your page once it's copied to your server. This list may include intranet test servers, Internet servers and local mapped drives that you use for testing. You don't need to note the full URL, just the first part, this will most likely be a Web server name, Intranet server name or drive letter. For a page posted on http://www.microsoft.com/typography/ the list may look like this.
http://www.microsoft.com/ - the main address
For your page the list may look something like this.
http://www.your_web_server.com/ - your server
Create a folder on your local C: drive called 'weft' and using Notepad create a file containing the following code. Save the file in the folder as 'test.htm'.
<HTML>
<HEAD>
<TITLE>Test Page</TITLE>
</HEAD>
<BODY>
<FONT FACE=ARIAL SIZE=5> a b c d e f g </FONT>
</BODY>
</HTML>
Launch WEFT 2 by clicking the 'Start' button, selecting 'Programs', 'OpenType Tools', 'Microsoft Weft'. WEFT 2 will automatically run the WEFT wizard, click next and you will be prompted to enter your name and e-mail address. Do so and click next. On the next screen you need to enter the location of the test page. Type 'c:\weft2\test.htm'. Then click 'Add' and after a few seconds you should see a screen similar to that shown in figure 2. Click 'next'.
Figure. The Add Web pages screen
Figure. WEFT's analysis of the test page
The 'Create Font Objects' screen should be displayed. The input field labeled, 'Enter the location where the fonts will be created' should contain 'file://c:\weft\'. This location is fine as we will copy the font objects to your Web server later.
 Figure. The location where the fonts will be created
WEFT 2 will populate this field automatically based on the location of the pages it's analyzed.
 Figure. The allowed root suggested by WEFT 2 You should keep this allowed root so that you can test the page before copying the page and the font objects to your Web server. To add the additional roots you listed in step 1 click the 'Mirror sites...' button.
 Figure. Additional allowed roots Enter the first address from your list. Ensure that the full root is entered, that the protocol is correctly selected and that any slashes '\' or '/' are in the right direction. When you have entered all of the allowed roots click 'okay'.
Note: The allowed root 'file://c:\weft\' is displayed as 'file:///c|/weft/' - this will not cause any problems.
The next screen lets you save a modified version of your page to its original location. This modified version of the page will contain the CSS code that links the font object you've just created to the page. Click 'publish pages' to start this process. On the final screen click 'Finish' to close the WEFT wizard.
Load the modified Web page into your favorite text editor. Change 'Arial' references to 'myfont'. This will make it easier to test that the font object has been successfully created. Also delete the file path to the embedded font object 'file:///c|/weft/'. This will make Internet Explorer access the font object when it's copied to your Web server.
<HTML>
<HEAD>
<TITLE>Test Page</TITLE>
<STYLE TYPE="text/css">
<!-- $WEFT -- Created by: () on 10/12/98 --
@font-face {
font-family: Arial;
font-style: normal;
font-weight: normal;
src: url(file:///c|/weft/ARIAL0.eot); }
-->
</STYLE>
</HEAD>
<BODY>
<FONT FACE=Arial SIZE=5> a b c d e f g </FONT>
</BODY>
</HTML>
The modified code should look like this.
<HTML>
<HEAD>
<TITLE>Test Page</TITLE>
<STYLE TYPE="text/css">
<!-- $WEFT -- Created by: () on 10/12/98 --
@font-face {
font-family: myfont;
font-style: normal;
font-weight: normal;
src: url(ARIAL0.eot); }
-->
</STYLE>
</HEAD>
<BODY>
<FONT FACE=myfont SIZE=5> a b c d e f g </FONT>
</BODY>
</HTML>
Using your favorite tools copy or upload the Web page and font object to your server. For the purpose of this tutorial the Web page and font object need to be in the directory or folder on the Web server.
Run Internet Explorer 4 and enter the page location into the address field.
Figure. Testing the page. If everything worked Internet Explorer will download the page and font object. Internet Explorer will confirm that one of the allowed roots in the font object; http://your_intranet_server/, file://c:\, http://www.your_web_server.com/ or http://your_web_server.com/ matches the first part of the address Internet Explorer used to access the page http://your_intranet_server/test.htm. If there is a match Internet explorer will temporarily and privately install the version of Arial contained in the font object and use it to display the contents of the test page.
If the text is displayed in a default font such as Times New Roman, then something went wrong.
|
|||
|
|||
| Microsoft Typography | ...on the Web | ...embedding | ...WEFT 2 | WEFT 2 tutorial | |
||
 |
|||
On the next screen click 'Analyze pages'. WEFT uses Internet Explorer to analyze the page's use of fonts. After a short while the 'Used fonts' screen should appear and contain the details shown in figure 3. Click 'next'.
Click 'Create fonts' to start the process of creating the font object and saving it to the 'weft' folder on drive C:.