WEFT for Newbies

NOTE: these instructions are based on WEFT2, WEFT3 is now out. The download link is to 3.

    Welcome. I think I need to state here that this is not the definitive page on Mircrosofts WEFT font embedding tool. What you will find here is just the basics to help you get started.
    First you need Microsoft's WEFT, if you don't have it yet download and install it as per Mircrosofts instructions. It should also be noted here that at this time only Microsoft browsers recognize embedded fonts, at least using this method.
    These instructions are on using the Wizard portion of WEFT. So once you have WEFT installed you need to start it and run the Wizard.
    Ok for the purposes of learning we are going to do a test file on our HD, so we are sure we have the process correct. So create a Temporary folder named weft on your C: drive, then create a basic HTML page and name it test.htm and put the following code into it:

save test.htm to the weft folder you just created on your C: drive.

(1) This {Fig 1}will be the first screen you see and will indicate that you indeed have the wizard running, Click Next.

(2) Here {Fig 2} you will enter your Full Name {Fig 2-1}and E-mail Address {Fig 2-2}, then if you intend to use the ftp feature of the product click Internet Access {Fig 2-3}, if you do not intend to use the ftp feature move on to step (4)

(3) Here {Fig 3} you will enter your ISP/Web Page Server User Account # {Fig 3-3} and password {Fig 3-4}

(4) Now in the URL field {Fig 4-1}enter file:///c:/weft/test.htm be sure and use 3 / after file: this indicates to WEFT that is should look for links from this page to other pages on your site. For now it doesn't matter but a good habit is never a bad thing. You can prevent the adding of linked pages by checking the Do not add linked pages option {Fig 4-4}.

(5) Press the Build page list button {Fig 4-2} This will start WEFT searching for your page. Once it has found the page you should see it listed in the main window {Fig 4-3} along with it's file path. If not double check the path you entered in step (4).

(6) Click Next {Fig 4-6}

(7) Now click Analyze pages {Fig 5-1} This starts WEFT to looking at what fonts you have used on the page, and which ones.

(8) WEFT returns with the fonts you have used in the document and tells you which ones can be embedded {Fig 6}
NOTE: I have included a couple of others here that were not on the page you created to point out a couple of other things.

(9) In the Font Subsettings choose 2: Per site subsettings {Fig 6-1} This allows you to use this set from any page on that site. If you want to learn more about the other options you can check the Microsoft site.

(10) Here you would choose the fonts you do not want to use and click on button {Fig 6-4} which if it were a font capable of being embedded would have the word yes to the far right {Fig 6-3} and the button would say Don't Embed before you clicked it and after you click there would be no word yes to the far right and the button would say Embed. For our purposes here it won't matter cause you will only have the Arial font showing.

(11) click Next {Fig 6-7}

(12) Here {Fig 7} things can get a little strange but with care no problem. In the first window {Fig 7-1} make sure the correct path to your file is shown or else WEFT will save the fonts to a default directory on your HD somewhere and they won't do you any good, be sure and use 3 / after file: do not include the file name, you are about to save the fonts to the directory, not the file, now in the second window {Fig 7-2} is where the little complicated part comes in, but easy to under stand once you figure it out : ). Here {Fig 7-2} you want to enter ALL the places you want this set of fonts to be able to work, your HD, any and all web sites you want to use them at etc. NOTE that in the window now it says file://c:\ not the same as the first window here you use only 2 / and the last is \ not / and no directory. This means that it this set of fonts can be used from anywhere on your C: drive
(13) Now click on Mirror sites... {Fig 7-2}

(14) Here {Fig 7a} is where you enter all the places you want this set of fonts to be able to work.
Just enter in the place in {Fig 7a-1} and click Add {Fig 7a-2}, as you do the URL will be added to the list below {Fig 7a-4} and you can add more. For the purpose of this test however you don't need to add any other than your C: drive. Now Click OK {Fig 7a-5}. You will notice that I am adding a URL at Geocities, a note here about Geocities, when I went to upload the fonts I had created in another project Geocities would not allow it. Please if you are going to use these fonts at Geocities or other server that won't allow the file extension see my special notes later on.

(15) Now were back to where we left off at at step 13, so click Create fonts {FIg 7-4}

(16) Now here is another sticky spot, if you just click Publish {Fig 8-3}at this point the fonts will be saved to the default directory {Fig 8-1} so instead click Advanced {Fig 8-2}

(17) Highlight your file {Fig 9-2} here is where the CSS is added to your page.

(18) Click Publish {Fig 9-3}

(19) Click Finish {Fig 10-2}

(20) Now open up your test.htm in NotePad or your favorite HTML source viewing editing program, the file should now look like this:

</HEAD>
<BODY> <FONT FACE=Arial SIZE=5> a b c d e f g </FONT> </BODY>
<HTML>

(21) Open it in your browser and see how it looks

(22) Now change the word Arial in NotePad to myfont like this:

</HEAD>
<BODY> <FONT FACE=myfont SIZE=5> a b c d e f g </FONT> </BODY>
<HTML>

(23) Save the file and refresh your browser, it should still look the same, if it doesn't you have missed a step or you have misentered something. Try again, Delete the ARIAL0.eot file and the test.htm files from your weft directory, and start all over again. If it still doesn't work for you go to the Microsoft page and try with there step by step, if still no good send them an email and the files ARIAL0.eot and test.htm.

SPECIAL NOTES:
(1) Geocities only allows the uploading of certain types of files *.eot, is not one of them. What I did was to change the extension to *.txt on the file and in my source codes. It uploaded fine and works great.

(2) If you want to satisfy your self for sure that you have infact gotten it right try changing only one word Arial in the file to myfont, then save and refresh, you should see a difference.

(3) Once you have it all together you can eliminate the full URL file://c:\weft\ARIAL.eot file to just the file name ARIAL.eot and it will work a little faster.

Good Luck and happy font embedding Return to Newbie Corners