|
CSS in Flash the return of crisp and legible fonts.
|
By David Collado
[Hits: 3949]
|
|
A typical challenge faced by Flash developers like me isgetting fonts to look like you want then to. For any projectchoosing the right font face and size is a process that requiresboth you and ultimately the client to see eye to eye.
In Flash MX and earlier versions fonts were by defaultanti-aliased, meaning that the edges of the text are smoothed.This is good when dealing with large type but it causes smalltext to appear blurry. Earlier versions of Flash also had otherissues. For instance if one were to realign textfields aroundother objects fonts might come out of focus (because ofpositioning), and getting it right could take several tries.
More recently with the advent of Flash MX 2004 came the ¡°aliastext¡± option but, more importantly the TextField.StyleSheet()class. What is the TexFiled.StyleSheet() class? I¡¯ll get to thatbut first let me tell you about this new ¡°alias text¡± feature.The latter hides the anti-aliasing to make small text sharperand more legible yada, yada, yada. However, most often than not,fonts appear overly pixilated and cracked. In my opinion ¡°aliastext ¡° is nothing more than a little ransom note generatormaking every character appear as if it had been cut out of amagazine. Adding insult to injury if you are publishing for theFlash 6 player or earlier versions on Flash MX 2004 the ¡°aliastext¡± feature does not work on dynamic and or input textfields.
Moving forward with stylesheets. If you don¡¯t already knowsomething about CSS don¡¯t fret the small stuff. Get to yourfavorite search engine and key in CSS (short for Cascading StyleSheets), and in seconds flat you will find hundreds of articleson CSS benefits, syntax, usage and whatnots. Very quickly, CSSis the language of style on the web and as opposed to otherlanguages CSS is much easier to read and write. One of thereasons for this is you can pretty much read everything just asyou would plain English, another is the ability to writeeverything in lowercase, something you could never getaway within JavaScript.
CSS in ActionScript is relatively simple. The first thing wewant to do is open the Action panel and create an empty stylesheet object. Basically the idea is to load our style sheetinformation in there (font size, weigh, color etc.), and thenassign that information to some text. Not only will you havemore crisp and legible fonts but more importantly, this mean youcan change details about your font in an entire Flash site bysimply editing one file. Pretty powerful stuff huh? Very handywhen clients decided they don¡¯t like red anymore or call to tellyou that the font is too small. In the past such changes couldbe very time consuming, requiring developers to go through thewhole movie editing textfield after texfield one at a time;providing that the client was happy with the changes you¡¯d mightget lucky and only need to run around that track once.
In my line of work I convert pre-designed web sites (webtemplates) into a unique Internet project (web sites), in otherwords I work with pre-made website templates. The whole basisfor using a website template is to develop fast and high-qualitywebsite in half the time that it would normally take a regulardesign studio to do the same. Utilizing style sheets with myFlash templates enables me to keep my production time at aminimum and ultimately the time I save will benefit my clients.For detail instruction on how to create a style sheet object inFlash MX 2004 simply open the help panel and search under thekeywords ¡°cascading style sheets¡±. In all fairness I mustmention something about Pixel fonts. Pixel what? Pixel fonts arefonts specially designed so that every part of every characterfalls exactly on the monitor¡¯s pixel. Pixel fonts are incredibleat getting fonts at small sizes looking crisp and legible at anyresolution. If you are wondering if Pixel fonts would displaycorrectly on the end user¡¯s computer or some other platformsthat does not have these fonts already installed. The answer isyes, but Pixel fonts must be embedded to ensure they aredisplayed correctly on every computer. The downside here is thatembedding these fonts means an increase in file size which inturn causes an increase in bandwidth needless to say bandwidthdetermines the rate at which information is sent.
Nevertheless if you want to use fonts that look crisp even atsmall sizes without the use of CSS, Pixel fonts are right foryou. To buy and or read more about Pixel fonts checkout thesewebsite www.FontsForFlash.com and www.ductype.com.
In sum the choice is your, on smaller projects I would actuallyprefer Pixel fonts over cascading style sheets, I mean why bringa gun to the snipe hunt when all you need is my gunnysack. Onthe other hand you can do without a lot of unnecessaryfrustration going with CSS when working on larger projects.
|
|
|
|
|
|
