Post image for 5 WordPress Typography Plugins To Improve Readability

5 WordPress Typography Plugins To Improve Readability

by Jason

in Tutorials

Content is King and Design is Queen.  As mar­keters we know this.  We spend time mak­ing sure our site looks good, and that we have great, rel­e­vant con­tent, but what some peo­ple for­get to think about is the actual design of the content.

What do I mean?  In this instance I’m talk­ing about the way the text flows on the screen.  The space between the let­ters and the lines, as well as read­abil­ity.

In this arti­cle I’m going to show you five Word­Press plu­g­ins that you can install (which all in total should take less than five min­utes to install and setup MAX), these plu­g­ins have been tested and used by me and count­less oth­ers.  These plu­g­ins will take your blog to the next level.

When you get through with this arti­cle your site will look more pro­fes­sional, your sites read­abil­ity will go up, you’ll lower your bounce rate, and most impor­tantly… your site will stand out.

If you don’t use these plu­g­ins and ideas I’m about to show you, your site will look like every­one elses, bland, bor­ing, and your bounce rate will stay the same… or go up!

This is part two of a three-part series, you should check­out part one “3 Sim­ple Typog­ra­phy Ideas To Improve Your Site Today” to get a bet­ter idea of design and what our end goal is (or just look how the text is pre­sented here).

WP-Typography

 

wp typography screenshot 5 WordPress Typography Plugins To Improve Readability

Screen­shot of WP-Typography

WP-Typography will improve your web typog­ra­phy inside Word­Press.  It offers con­trol of spac­ing, hyphen­ation and much much more.  (Look above and see how WP-Typography wraps the link with a hypen.)

Drop Caps

 

Example of What Drop Caps Are

Drop Caps as used on Enlight­ened WebMastery

The Drop Caps plu­gin adds the abil­ity to add drop caps to your posts.  Not sure what a drop cap is?  Check the top of this post, see that large let­ter?  That’s a drop cap.

The rea­son you want to use it (besides that it just looks cool) is that it shows that you’re at the start of some­thing, which is impor­tant if your site is text heavy.

PS Dis­able Auto Formatting

 

PS Disable Auto Formatting

This plu­gin stops Word­Press from doing it’s “auto for­mat­ting thing”, which amounts to Word­Press tak­ing out your tags, remov­ing spaces, and screw­ing up iframes.  Pretty much stops my biggest issue with WordPress.

The beau­ti­ful part about this plu­gin is, you’ll now be able to add br tags, p tags, and (wait for it…) line returns!  Mean­ing you can hit enter, and break up your text!  Cool huh?  Yea, can’t believe this is a fea­ture either… (it should be stock in WordPress).

Real WYSIWYG Plugin

 

Screen shot for the Real WYSIWYG Plugin

WYSIWYG means “What You See is What You Get”

This plu­gin is just really cool.  Basi­cally it takes up your css for­mat­ting (you need to paste it in) and dis­plays your con­tent the way it will actu­ally look on your blog.  Sweet right?  What do I mean?

If you use a cer­tain font, or have cer­tain styles (like your h1 or h2 tags), etc, and you try to design your mes­sage visu­ally, you’ll know that see­ing the text on Word­Press and on your blog there’s usu­ally a HUGE dif­fer­ence, this plu­gin stops that, and allows you to really see how it’ll look.

 

TinyMCE Advanced

 

Screenshot of TinyMCE Advanced Options

Screen­shot of How I Setup TinyMCE Advanced

TinyMCE Advanced adds so much to Word­Press.  It is with this tool that I can quickly and eas­ily for­mat my text how­ever I see fit.  TinyMCE Advanced adds over 15 dif­fer­ent fea­tures to your visual edi­tor.  This is a must have.

 

After The Deadline

 

After The Deadline Banner Showing Benefits

I’m eas­ily leav­ing the coolest to last, this plu­gin does advanced spell check­ing, style check­ing, gram­mar check­ing, you name it.  This thing does it all.  You really need this plugin…

This plu­gin won’t really improve your typog­ra­phy, but it will vastly improve your read­abil­ity (which is why I included it as a “bonus”).  :)   Use this before you post your posts.

 

Time To Take Action…

 

In this arti­cle I went over why you need to worry about your typog­ra­phy.  By improv­ing how your text reads (the whole rea­son peo­ple visit your site), you improve their abil­ity to read your site, decrease bounce rates, and get them to read your post and pos­si­bly even take action (and that’s the goal right)?

So if you want to get that pro­fes­sional look, stand out, and really improve your site almost overnight, I implore you to take action RIGHT NOW to make sure you get this done.

Spend 5 min­utes, load up Word­Press and start to install these plu­g­ins (here’s a quick guide on How To Install Word­Press Plu­g­ins if you’re unfa­mil­iar with the process).

Remem­ber, you want to install:

  1. After The Deadline
  2. Real WYSIWYG Plugin
  3. PS Dis­able Auto Formatting
  4. Drop Caps
  5. WP-Typography
  6. TinyMCE Advanced

So now is the time to take action, keep this page open and fol­low the direc­tions below, in less than five min­utes you’ll be done.

Here’s Your Action Steps (Do These Now)

  1. Open up a new tab
  2. Login to your Word­Press Dashboard
  3. Copy and paste the names above
  4. Install the plu­g­ins, and spend a few min­utes set­ting them up
  5. Go back through some of your older posts and start adjust­ing your text.

I rec­om­mend doing page one text first (e.g. when I did this on my blog I started with my lat­est five posts, as those are the ones which show up on the home page, then I did this to every arti­cle over the course of a few days.)

From here on out, this process will take just a few sec­onds to com­plete.  Big pay­off, small effort.

I hope you’ve enjoyed this arti­cle and I’d love to hear your com­ments, thoughts, opin­ions or what­ever on the topic.  Just leave a com­ment down below.  :)

Talk Soon

{ 1 comment… read it below or add one }

Daniel Rose
Twitter:
July 17, 2010 at 10:55 pm

WP-Typography is an excellent plugin. I’m going to check out the other plugins you mentioned now. Thanks for the post!

Leave a Comment

  Twitter ID (ID only. No links or "@" symbols)

Previous post: