Create Images of Text

What This is About

The heading for this page is in an image, while the text that you are reading now is not. You can verify that if you like by comparing
  • what the cursor looks like when it is over the text,
  • whether you can highlight the text by holding down the left mouse button and moving the cursor, which would allow you to copy the text, and
  • what options are shown when you right-click on the text.

OK, but what's the point of putting text in an image? So you can use a font with some personality. It is highly unlikely that any such font that you choose will be on the computer of nearly every visitor to your website, but if you put your text that uses that font in an image everyone will be able to see it in the font that you choose anyway.

sing fonts with personality is most appropriate for short pieces of text in relatively large font sizes, such as page headings, for which legibility is less of an issue. I have programmed the creation of images of such pieces of text, as you can see in the demo below. I have done so to make using images of text compatible with being able to change your text yourself. The first letter in this paragraph shows another potential use for this that I have given thought to but have not yet included in anyone's website.

There are. Specifically:
  • Virtually any font can be used anywhere in your website if your website, or at least that portion of your website, is built in Flash. This approach has been around for a long time. See the Portfolio > Flash page for more about websites built in Flash.
  • A newer approach that you may have heard about provides font flexibility comparable to Flash via enhancements to style sheet specifications and browser support for those specifications. For now there are issues with differences in implementation across browsers and with how many users are still using older browser versions that don't support this, so I continue to use images of text. This new approach will soon become the norm, however, and you can expect to see a huge increase in the use of diverse fonts in websites in the next few years as a result.

Try It Out!

Change the inputs below the image of text, then click on the Update Text Image button below the inputs.


Font:  Magneto    Salsa Mangos    Wide Latin

Background:  none (page heading)    unpressed button    pressed button