Stop Using That Fancy Formatting Toolbar. Please


Not for Profits
Small Businesses
Stop using your formatting toolbar

You know that nice formatting toolbar at the top of the body text area in the form for creating a new blog post? The one where you can change the font family you are using, the font style, and the font color? Yeah, that one.

Stop using it.

I can never fully understand why, but when clients for whom I build a new website see that formatting toolbar and all the options, they can’t resist. They just love to apply all sorts of crazy formatting in that text area. So much so that I sometimes regret giving them a rich toolbar to begin with when I build the website.

In fact, I'd go so far as to say that my biggest battles with clients when it comes to managing the content on their websites revolves around their desire to suddenly become Peter Max when they want to format the text in that little text area (or maybe even Jackson Pollock). I've seen fonts of all colors, font families that I never knew existed. I tell them they should stop doing that. They become irate with me.

Here's why using your formatting toolbar like that is a bad idea.

Your Site Will Look Sloppy

You have presumably either hired a graphic designer to design your site because you want people not only to visit your website, but to also have a good user experience when visiting. In fact, you want them to have such a good user experience that they buy whatever it is you're selling.

And it’s good that you did that, because the graphic design is a critical element in engaging that visitor.

You probably paid that designer a lot of money to make those very carefully determined choices. Part of that designer’s choice was the font, its size, line height, It's color, and so forth and so on.

Unless you've had years of training in graphic design, and understand the psychology of design and how it can affect a buyer of a product or service, chances are you are not going to make it better by overriding your graphic designer’s choice of the font, its size, or its color. In fact, you’ll probably make it worse.

Do that to just one page and you affect that page. If you change the fonts and use a different font / color / size on every page, you will only serve to further disrupt the balance and harmony that your graphic designer worked hard to achieve, and increase the risk of driving that prospective customer away.

It’s Hard to Keep Track of All the Changes

If you decide you want a different font, font size, and/or color throughout the site, it is a lot of work to go through and do that for every page with a formatting toolbar, if you are a content manager and not a front end developer.

You presumably built your site with a content management system because you wanted to make the website easier to administer. By trying to change the fonts yourself, you just make it harder.

If you want a different font or font size or color throughout the site, consult with your graphic designer and your site’s developer, and let them change that in the site’s stylesheet.

It Might Negatively Affect SEO

In search engine optimization, there is a statistic called a text to code ratios. While reasonable minds differ on how much impact that ratio can have on search engine optimization, it’s always better to make sure your page has only the HTML and related code necessary to properly and elegantly display the page, and that the text-to-code ratio is as high as it can be.

Adding styling using the toolbar adds additional and unnecessary code to the page by inserting the style via the HTML style attribute. This adds more to teh “code” site of that ratio, thus lowering the text-to-code ratio, potentially affecting your search engine rankings.

It Will Change the Way the Text Appears on Mobile Devices

The favored technology for delivering a mobile friendly site today is known as responsive web design. Responsive web design controls how your website will look on a phone, on a tablet, on a desktop primarily through defining the font parameters for differing screen sizes in the site’s stylesheet.

A good graphic designer will spend time considering the right font size for each screen size where the site might be displayed, and pick a size and style that makes it easy to read for a particular device.

When you set the size of the font in the text area using your formatting toolbar, all that careful work is overridden, and the size you set with the toolbar will apply for all devices, potentially affecting the readability of your text on mobile devices. And the right size for a desktop

So What Can You Use Your Toolbar For?

I'm not suggesting that you abandon the toolbar completely. It is good to make text bold, to make it italicized or to add underscores. Creating unordered lists (also known as bullet lists) and ordered (numbered) lists is also fair game and can enhance the readability of the post.

The toolbar also provides a very valuable feature by allowing you to create links in a text to other internal pages on the site, to external websites to which you may wish to link, and even creating a link to a PDF in the text which you wish to make available to your visitors for download.

Maybe I Can Understand …

I am working a lot with baby boomers, and of course they all came of age with Microsoft Word, and its formatting toolbar, its availability of Comic Sans as a font, and other fine formatting tools. In its time, it represented a revolution in desktop publishing for individuals and small organizations. Suddenly you could make a flyer or newsletter or other document look as good or as bad as you wanted to. So it might be hard to relinquish that type of control when switching to websites.

But my message to all of you is: Stop using the toolbar. Let the graphic designer’s work take control. If you are using the website for any type of organizational or personal objective, be it getting more customers, more donations, or more readers. you’ll reach that objective quicker as a result.


Twitter icon
Facebook icon
Google icon
StumbleUpon icon icon
Digg icon
LinkedIn icon
MySpace icon
Newsvine icon
Pinterest icon
Reddit icon
Technorati icon
Yahoo! icon
e-mail icon