Menu

How To Spice Up Your Blog With Color and Texture

When people read books, they tend to read a little slower and pay more attention to each and every word. However, when they read online, they skip and scan, making huge jumps along the text. It’s hard to say why this is, but it’s been proven over and over again. You’re probably doing it right now.

But, you just saw that bit of bold text — and we know why that happened. It’s a simple trick of design. Things that are different, stronger, tend to catch our eye.

Today’s blogging tip is how to break up your text with color and texture to break up the text, fight scanning, and call attention to the things we feel the reader should see.

Add A Little Color And Texture To Your Posts!

Break Up The Page With Header Text

Long stretches of text are hard to read online. We naturally look to some kind of organization, something that gives our eye and mind a a visual cue for the separation of ideas. To do this, we separate a blog post into chunks, marking those chunks with a subtitle made from header text (just like I did above).

Most themes have a half dozen or so font sizes built into them for various levels of header text, generally shown as h1-h6, with h1 being the largest (usually reserved for Title text). You can access them using the post editor tool bar, or by manually entering it in the text editor using tags.

An Example of H1 text

An Example of H2 text

An Example of H3 text

An Example of H4 text

An Example of H5 text

An Example of H6 text

Using header text (we like h3) to break articles up into chunks makes it easier to read and greatly improves your chances of having the entire post be seen.

Draw the Eye with Color

the text above is contained in a color box, a pre-coded div that all ThirdScribe author sites have. There are six supported colors: red, blur, orange, yellow, purple, and green. At the top of this article is a purple box, a blue one is right above. Here is what the others look like:

A Red content box

A Yellow content box

A Green content box

An Orange content box

And here is the code you use to create a color box. Remember, whenever you code in some formatting, you must be in the Text editor, not the Visual editor, so make sure you toggle that button.

This code snippet is for a blue content box. To use a different color, just change “blue” to one of the other supported colors.

You can put anything you like in that color box — text, pictures, videos, even shortcodes like those for Enter Once or Gravity Forms.

Use Buttons to Get Some Action

We are naturally inclined to push buttons. It’s just how we’re wired as human beings. In addition to color boxes, ThirdScribe Author Sites has similar pre-canned codes for buttons in several colors: blue, skyblue, orange, green, purple, red, and yellow. Here’s what they look like:

Rob is the founder of ThirdScribe, a unique author services platform and social network. As a naval officer and diver, he spent a majority of his career doing a lot more than you would think with a lot less than you can imagine -- a skill that has proven extremely valuable in the start-up world. You can follow him on Facebook, Twitter or Google+.