Web Design  »  Articoli  »  Web design 

Some of the readers of my english articles about Nifty Corners (see Articles: «More Nifty Corners») asked me if I was planning other translation/articles in English.

Well, between the about 50 I wrote it was quite difficult to choose. I decided to presents STR (SwishMAX Text Replacement). The original article and the technique were published in Italian on the 23rd of March 2005. Instead of just a translation, I'll present here a slightly improved version.

Before we start, perhaps you may want to have a look at the example I prepared for this article.

What is STR

STR is a way to embed your favourites fonts in a webpage using a combination of Flash, CSS and Javascript, leaving the markup semantical and minimal. Already heard about that? Yes, maybe you know sIFR.

STR is quite different from sIFR, starting from the medium. In STR, flash movies are in fact developed with SwishMax instead of Flash. Why this? Well, the main reason is that SwishMAX is really cheaper than Flash. SwishMax can produce fully compatible "swf" Flash movie, and it's capable of a scripting language called SwishScript very similar to ActionScript.

STR is not however a clone of sIFR, just as like SwishMAX is not a clone of Flash.

What you can do with STR

With STR you can replace headings, links, menus, quotes and whole paragraphs (but just with plain text inside). It support multilines text: however, font and movie size should be decided via SwishMAX. This means that you should choose how big is the replacing movie and how many lines it has.

The color for the replaced text could be decided via Javascript. In the case you're replacing links or elements that contain just links, you can also choose the color for the :hover state.

You can apply easily on replaced text one of the hundreds of effects available in SwishMax. But please, just don't exagerate: I suggest to use transition wisely to avoid really freaky or annoying effects. In my opinion, maximum one element per page should have a dynamic effect.

When use STR

I believe STR should be used when it brings a real advantage in terms of size over one of the image replacement techniques.

As is, if you're applying STR just on one element on a site (ie the logo) you should consider to use an image replacement technique. If you plan to use the same movie on at least 3-4 elements in your website, and perhaps the number will grow, then you could use STR. Applying STR will be definitevely faster and lighter than produce images and set up the CSS rules for image replacement. It's particulary indicated on large sites, blogs or site with frequents updates to provide text with a better typography.

The example we presented in the beginning of the article is just for demonstrational purposes. If the page was real, for the header and the footer would have been better use image replacement.

Altri articoli

Altre guide

Altre newsletter