Jeff Bridgforth :: Webcraftsman

Adventures in sIFR

July 8, 2008

CSS · My work · Tutorial / How-tos · Typography

I enjoy the chal­lenge of learn­ing how to do new things. Work­ing with the Web is a great fit because there are always things to learn. Over the past year, I have tried to incor­po­rate some­thing new into every Web design project that I do.

I am cur­rently work­ing on a new design for Cam­pus Crusade’s Sum­mer Mis­sion Projects site. It is an excit­ing project because it is the first to be a total pack­age. Our team is work­ing on the pro­mo­tional videos, print brochure, sticker and Web site. The video has been the lead player in deter­min­ing the com­mon design thread that will weave through all the pieces in the package.

For the Web site, I am using “real-life” ele­ments of a desk and it’s con­tents and com­bin­ing it with illus­tra­tions that cre­ate a fan­tasy world within the video.

As I have pro­gressed with the design, the head­ings typog­ra­phy was beg­ging to be a scripted style that fit into the theme of a sketch­book on a desk. Now I was faced with the prob­lem of how to cre­ate those head­ings in a scripted font. I decided to use image replace­ment for nav­i­ga­tional ele­ments. But as I thought about it, sIFR seemed to be a good solu­tion for the con­tent head­ings instead of image replacement.

I have never used sIFR before and this seemed like the per­fect oppor­tu­nity to give it a try. I found a tuto­r­ial, This is How I Got sIFR to Work. The author’s intent was to dis­till the “offi­cial” doc­u­men­ta­tion into a sim­plier form. I give him kudos on accom­plish­ing that intention.

I was very excited tonight when I finally got it to work. I had been work­ing with it for a cou­ple of hours last week but never had suc­cess. Now I am not always the best at fol­low­ing instruc­tions so tonight, I decided to go back and go through each step. (I never fol­low the owner’s man­ual of a new elec­tronic toy. I would rather play with it and fig­ure it out myself.)

One of the first things I found was the swf file I cre­ated last week did not work cor­rectly so I went back and cre­ated one accord­ing to the tuto­r­ial. Also the first time I was work­ing through the tuto­r­ial, I did not down­load the lat­est sIFR from the place the author sug­gested. So as I had worked through his tuto­r­ial, sev­eral things were not match­ing up. That had really been frus­trat­ing. It was so much eas­ier to have the right ver­sion and be see­ing the same things the tuto­r­ial was describing.

I am so glad I stuck with learn­ing. I think this is an appro­pri­ate and smart solu­tion. I will not have to cre­ate images for every head­ing and it was also cut the down­load time.