WordPress has pretty decent typography features in the core installation. But there are plenty of areas ripe for improvement. That’s where the plugins below come in.

Credit: Image background by fabianohikaru

Whether you just want more control over how the basic text on your site shows up or you want to do something a bit more advanced, there’s surely a plugin available to help. There are plugins to better handle things like hyphens and long URLS, plugins to replace text with images (whether in headlines or to avoid censorship), and plugins to let you add print-centric elements, like drop caps and pull quotes, to your posts.

Be sure to check out our previous post on Dynamic Image Replacement for more useful WordPress typography plugins and here are some WordPress related plugins we’ve previously published:

• WordPress Tricks & Hacks Part I, Part II, Part III
• Manage and Handle Multi-Author Blogs
• Great looking WordPress Themes

Full list after jump.

WordPress Plugins For Better Readability

• TTFTitles

  The TTFTitles plugin is another dynamic text replacement plugin that lets you replace your headers with images using any TrueType font you choose. It’s mostly a rework of the Image Headlines plugin. It has been tested with WP 1.5.2 up through 2.7.

  

• DRF2WP EN

  DRF2WP EN is a font replacement plugin that allows you to replace any font on your WP site with a dynamically generated image that uses any TrueType or OpenType font you want. The source code remains in-tact, which means your site won’t take a hit with search engines. The plugin works with WP 2.5 up to 2.8.4.

• Drop Caps

  The Drop Caps plugin lets you add a customized drop cap to each of your posts and pages (or even comments and other excerpts), similar to what’s commonly done in print publications. It can also be used to create other types of initials. The plugin has been tested with WP 2.3 up through 2.7.1.

  

• WP Typography

  The WP Typography plugin adds a number of typography features to your blog. It includes hyphenation, spacing control, forced internal wrapping of long URLs, intelligent character placement, smart handling of quotes and other characters, and CSS hooks for styling ampersands, acronyms, and other special characters. It works with WP 2.7 up through 2.8.4.

  

• Simple Pull Quote

  The Simple Pull Quote plugin lets you insert pull quotes into your blog posts to emphasize certain sentences or phrases using custom fields. Pull quotes can be styled by editing the included CSS file. It works with WP 2.7 or 2.8.

  

• jQuery Font Resizer

  jQuery Font Resizer is a plugin that improves the usability and accessibility of your blog. It adds three links to each page to allow visitors to resize the type on that particular page. It’s a great option to make your site more user-friendly to visitors who want a larger or smaller type than standard. It’s known to work with WP version 2.0.2 up through 2.7.

• WP-Syntax

  WP-Syntax is another syntax highlighter that uses GeSHi. It gives you the option to highlight with or without line numbers and maintains formatting when you copy snippets. WP-Syntax is compatible with WP 2.0 up through 2.8.

  

• Google Syntax Highlighter for WordPress

  The Google Syntax Highlighter for WordPress lets the original Google Syntax Highlighter that was developed by Alex Gorbatchev work within WP. It’s a completely client-side highlighter, supports multiple languages (including Ruby, Python, PHP, JavaScript, XML, HTML, Delphi, CSS, C++ and more), and is very lightweight. It’s known to be compatible with version 2.0.0 through 2.2.2.

  

• WP-Syntax Colorizer

  WP-Syntax Colorizer is a simple plugin for colorizing code snippets within your blog posts when run alongside WP-Syntax. WP-Syntax Colorizer has been tested with WP 2.0 up through 2.5.

  

• CodeColorer

  CodeColorer adds syntax highlighting to code snippets placed on your blog. It’s a great plugin to use if you frequently post code snippets, such as on a web design or development blog. It works with version 2.7 up through 2.8.4.

  

• TextImage

  The TextImage plugin replaces all the text in a post with a PNG image. It’s a good plugin to use if you wnat to block search engines from seeing your content or otherwise fly under the radar. It also gets around most automated filtering that certain countries use to censor internet content. It’s been tested with WP 2.1 up through 2.7.1.

• Censortive

  Censortive helps you get around automated censorship by replacing certain words with images of the word instead of text. You define which words you want to be replaced and Censortive does the rest. It’s a great plugin for getting around a lot of censorship without blocking your content from search engines. It’s been tested with WP 2.0.2 up through 2.3.

• Title Style

  Title Style gives you additional formatting options for your post titles. It can be used to wrap lowercase words or words like “the”, “a”, or “of” in em, span, or other elements. It’s compatible with WP 2.0.0 up through 2.8.4.

• PS Disable Auto Formatting

  PS Disable Auto Formatting prevents WordPress from applying its own auto formatting functions to your posts and pages. It prevents WP from stripping out tags when you’re editing in the HTML editor and has a positive impact on the way the visual editor formats your posts, too. It’s known to be compatible with WP 2.5 up through 2.8.3.

  

• Post Typographer

  Post Typographer plugin adds a number of typography improvements to your posts automatically. It changes dashes with spaces around them to em-dashes, transforms hyphens without spaces to n-dashes, and turns spaces after particular words into non-breaking spaces, among other features. It’s been tested with WP 2.5 up through 2.8.3.

• Author Intro for Post

  Author Intro for Post plugin adds an author intro to the beginning of each post based on the author’s name and bio information. It’s been tested with WP versions 2.0.2 through 2.7.

• WP-Footnotes

  WP-Footnotes makes it simple to add footnotes to your posts. Usage is incredibly easy and only requires you to use double-parentheses around your footnote. It does the rest. It’s compatible with WP versions 2.0 through 2.6.

  

Plugins for Admins

Here are a couple of admin plugins that can help you improve your site’s typography by giving you more editing options in the backend of your site.

• WP Super Edit

  WP Super Edit adds a host of WYSIWYG options to the standard WP visual editor. It adds two full rows of additional features to your visual editor toolbar, including options for applying specific styles and for adding and formatting tables. It’s known to work with version 2.8 and 2.8.1.

  

• Real WYSIWYG Plugin

  The Real WYSIWYG Plugin adds a WYSIWYG editor that actually shows you the page layout of your post within the visual editor. It makes it easier to see how your line breaks, images, and other elements will actually fit on your page.

  

• Text Control

  Text Control gives you additional options for formatting posts on your WP site according to a variety of different syntaxes and encoding options, including Textile 1, Textile 2, and Markdown. It’s compatible with WP 1.5 and higher.

  

Go to Source

Mozilla announced Tuesday that version 3.6 of Firefox, due by the end of the year, will support the new Web Open Font Format, or WOFF. Web authors will be able to include WOFF fonts in their page designs by linking to the font files in their code the same way they link to images and other downloadable files.

WOFF becomes the third downloadable font format supported by Firefox — version 3.5 included support for TrueType and OpenType font downloads.

But WOFF has two key advantages over TrueType and OpenType: WOFF fonts are compressed, so they download faster, and they include support for tags and other unencrypted metadata.

This is a significant step forward not only for the emerging open format, but also for type on the web in general, which is still stuck in a state of mild turmoil.

For years, designers have been limited to using only a set of five or six common fonts on the web. But thanks to new font rendering tools within the emerging HTML5 and CSS3 standards, web designers now have the ability to use newer, more visually interesting typefaces — and make that type appear more consistently across browsers, operating systems and screen resolutions.

Even with these new abilities, intervening forces like DRM, licensing restrictions and varying levels of support from the browser makers have stalled progress, forcing the modern designer to resort to a variety of workarounds and hacks if they want to use these new fonts. Some possible solutions have shown up, including the OpenType standard and a “middleman” licensing model proposed by the start-up Typekit, but haven’t yet gained traction. Earlier this month, popular website Boing Boing launched a redesign using CSS3’s @font-face rule, but ran into problems when things didn’t render correctly on older machines.

WOFF doesn’t promise to totally solve the problem of browser compatibility — it still uses the same paradigm within CSS3’s @font-face rule where users are served a preferred font choice first, but are then offered backup choices if their browser doesn’t support the first one. And there are still special considerations for IE 8 users, as Microsoft’s browser supports @font-face, but only if you use the .eot font format.

What it does do is improve workflows for those using downloadable fonts in their designs.

Mozilla contributor John Dagget outlines the compression and tagging advantages on the Mozilla Hacks blog:

First, compression is part of the WOFF format so web authors can optimize the size of fonts used on their pages. The compression format is lossless, the uncompressed font data will match that of the original OpenType or TrueType font, so the way the font renders will be the same as the original. Similar compression can be achieved using general HTTP compression but because compression is part of the WOFF format, it’s simpler for authors to use, especially in situations where access to server configuration is not possible.

Second, the format includes optional metadata so that a font vendor can tag their fonts with information related to font usage. This metadata doesn’t affect how fonts are loaded but tools can use this information to identify the source of a given font, so that those interested in the design of a given page can track down the fonts used on that page.

Dagget also notes that WOFF fonts aren’t “secure,” so the format shouldn’t be used by foundries wanting to regulate the use of their work. However, over 30 major type foundries — including House Industries, Hoefler & Frere-Jones and ITC — are already endorsing the format, and Mozilla’s support should help foster its popularity.

You can read more about how WOFF is used, plus see examples on the Mozilla Hacks blog. You can also check out WOFF support yourself by downloading the latest nightly builds of Firefox and giving it a whirl.

See Also:

• Boing Boing’s Redesign Uncovers the Dark Side of Web Fonts
• Typekit Hopes to Become the YouTube of Fonts
• Use @font-face Today With Free, Legal Fonts

Go to Source