HTML Suit Symbols

Can you see these: ♠ ♥ ♦ ♣?

I have recently changed many of my bridge articles to use the standard "Suit Symbols" in the Unicode character set, and their corresponding HTML entities, ♠, ♥, ♦, and ♣.

Some people with older operating systems (or browsers?) do not have support for these symbols. In some cases, this is fixable.

Fixing Your Fonts

If you have Windows '98 or earlier, the solution might be to download new fonts. One correspondent fixed the problem by getting the latest version of the "Times New Roman" font.

Unfortunately, these new fonts are not free. While it is possible to copy a font file from a new system to an older one - via floppy disk, network connection, or email - I'd never suggest that you do that because it would be illegal.

Why am I using Font Symbols?

Many sites use images for suit symbols. This works fine in simplest cases, but things become more complicated when you want different-sized suit symbols.

Font symbols let me vary the size of a suit symbol and use Cascading Style Sheets (CSS) to change the size of the symbols. If a user enlarges the size of the fonts in her browser, the font symbol is also enlarged. This can possibly be done with CSS and images, to some extent, but the resizing of images is not as attractive as font resizing, and it would add a level of complexity to your CSS writing.