Change Font Properties

Although you can create quite complicated and dramatic text effects through the use of CSS, you shouldn't discard the impact that simple tweeks to text property values can have on typography appearance. For example, take a paragraph in Times New Roman, styled with: 
p {
  font-family : 'Times New Roman'
  font-size: 18px;
  }

Here is a paragraph of text. It is not very interesting. In fact just looking at it I'm about to fall asleep…yes it's that boring.

With a little CSS (keep the font-family and font size but change the font color, word and letter spacing and transform to small caps), it can look very different: 
 p {
    color: #003347;
    word-spacing: -0.15em;
    letter-spacing: 2px;
    font-variant:small-caps;
 }

Here is a paragraph of text. Now it's much more interesting, in fact I'm compelled to read it, it looks that exciting. It's better than a cup of coffee.

There's a wonderful website www.typetester.org which will allow you to compare a block of text and change the font properties. When you're happy with the appearance you can then have it generate the CSS for your choices.

Highlight Text

Still staying simple, but powerful too, suppose you wanted to highlight a portion of text in a paragraph. You simply use the <strong> element to mark up the portions you want to highlight:
The <strong>distribution</strong> of messages from the selling of <strong>propaganda</strong> to the giving away of disinformation takes place at a <strong>blindingly fast pace</strong> thanks to the state of technology… <strong>This change in how fast information flows revolutionizes the culture.</strong>
and then code the CSS rule to set the highlighted text through the background-color property: 
strong {
   font-weight: normal;
   background-color: yellow;
   }

The distribution of messages from the selling of propaganda to the giving away of disinformation takes place at a blindingly fast pace thanks to the state of technology… This change in how fast information flows revolutionizes the culture.

Pretty effective eh? And easy too.

Previous Next