|
Your resource center for web design
tips, css tutorials and many more! |
|
|
|
WEB
DESIGN - Whats Inside:
Basic Rules on Web Design
[ More
] |
|
|
HTML
- Whats Inside: Should You Bother
Learning HTML to Build Webpages? [
More ] |
|
|
CSS
- Whats Inside: CSS Web Site
Design Basics [
More
] |
|
|
|
|
|
|
CSS Tutorials - CSS in Flash
CSS in Flash - The Return of Crisp and Legible
Fonts
by: David Collado
A typical challenge faced by Flash developers like me is getting
fonts to look like you want then to. For any project choosing
the right font face and size is a process that requires both
you and ultimately the client to see eye to eye.
In Flash MX and earlier versions fonts were by default anti-aliased,
meaning that the edges of the text are smoothed. This is good
when dealing with large type but it causes small text to appear
blurry. Earlier versions of Flash also had other issues. For
instance if one were to realign textfields around other objects
fonts might come out of focus (because of positioning), and
getting it right could take several tries.
More recently with the advent of Flash MX 2004 came the "alias
text" option but, more importantly the TextField.StyleSheet()
class. What is the TexFiled.StyleSheet() class? I'll get to
that but first let me tell you about this new "alias text"
feature. The latter hides the anti-aliasing to make small text
sharper and more legible yada, yada, yada. However, most often
than not, fonts appear overly pixilated and cracked. In my opinion
"alias text " is nothing more than a little ransom
note generator making every character appear as if it had been
cut out of a magazine. Adding insult to injury if you are publishing
for the Flash 6 player or earlier versions on Flash MX 2004
the "alias text" feature does not work on dynamic
and or input textfields.
Moving forward with stylesheets. If you don't already know something
about CSS don't fret the small stuff. Get to your favorite search
engine and key in CSS (short for Cascading Style Sheets), and
in seconds flat you will find hundreds of articles on CSS benefits,
syntax, usage and whatnots. Very quickly, CSS is the language
of style on the web and as opposed to other languages CSS is
much easier to read and write. One of the reasons for this is
you can pretty much read everything just as you would plain
English, another is the ability to write everything in lowercase,
something you could never getaway with in JavaScript.
CSS in ActionScript is relatively simple. The first thing we
want to do is open the Action panel and create an empty style
sheet object. Basically the idea is to load our style sheet
information in there (font size, weigh, color etc.), and then
assign that information to some text. Not only will you have
more crisp and legible fonts but more importantly, this mean
you can change details about your font in an entire Flash site
by simply editing one file. Pretty powerful stuff huh? Very
handy when clients decided they don't like red anymore or call
to tell you that the font is too small. In the past such changes
could be very time consuming, requiring developers to go through
the whole movie editing textfield after texfield one at a time;
providing that the client was happy with the changes you'd might
get lucky and only need to run around that track once.
In my line of work I convert pre-designed web sites (web templates)
into a unique Internet project (web sites), in other words I
work with pre-made website templates. The whole basis for using
a website template is to develop fast and high-quality website
in half the time that it would normally take a regular design
studio to do the same. Utilizing style sheets with my Flash
templates enables me to keep my production time at a minimum
and ultimately the time I save will benefit my clients. For
detail instruction on how to create a style sheet object in
Flash MX 2004 simply open the help panel and search under the
keywords "cascading style sheets". In all fairness
I must mention something about Pixel fonts. Pixel what? Pixel
fonts are fonts specially designed so that every part of every
character falls exactly on the monitor's pixel. Pixel fonts
are incredible at getting fonts at small sizes looking crisp
and legible at any resolution. If you are wondering if Pixel
fonts would display correctly on the end user's computer or
some other platforms that does not have these fonts already
installed. The answer is yes, but Pixel fonts must be embedded
to ensure they are displayed correctly on every computer. The
downside here is that embedding these fonts means an increase
in file size which in turn causes an increase in bandwidth needless
to say bandwidth determines the rate at which information is
sent.
Nevertheless if you want to use fonts that look crisp even at
small sizes without the use of CSS, Pixel fonts are right for
you. To buy and or read more about Pixel fonts checkout these
website www.FontsForFlash.com and www.ductype.com.
In sum the choice is your, on smaller projects I would actually
prefer Pixel fonts over cascading style sheets, I mean why bring
a gun to the snipe hunt when all you need is my gunnysack. On
the other hand you can do without a lot of unnecessary frustration
going with CSS when working on larger projects.
About the Author
Dave Collado is a senior design consultant at www.Foamers.net.
Foamers.net offers quality website templates, template customization,
flash templates, phpnuke themes, phpbb themes, osCommerce templates,
SWiSH templates, icon sets, web design tutorials, and many other
web design and web hosting services. |
|
|
|