Web Design Tips, Tutorials & More!

Text applications that are different

Use of text in design can be exciting if you use your imagination. Not everything has to be in a straight line, although I admit it is easier when it is but you and I both know designers don’t go for easy. We like to engage are viewing public and make them think a little out side of the box. Thinking with text in a different way can be both a challenge and exciting. You can use this to pull your site visitors into the web page and get them to read further.


One thing you can do it utilize overlapping text. With overlapping text you can have the large text headline with the smaller insert to head them into the right direction. With this the use of this layout is extremely important to convey the effect you want.

Dependent on where you place the smaller text on top of the large text you will receive different reactions from viewers. Placing the small text dead centre will not create the lead effect. It’s more like a dead stop. To create a lead effect you would place the smaller text up top and to the left and use an alternate color. This placement pulls the subject into the idea, and the visitor is far more likely to follow through. If you had placed it down at the bottom, and to the left, you would have been saying stop right here. I know it sounds silly but try it. See the feel you get from the text. Your alignment has to be perfect to get the right effect.

The sizing of the text is very important as are the colors chosen. You are overlapping text but you want notice to be taken by both. The darker color should be at the back and usually applied to the larger text. The lighter color and smaller text will be the longer invitation to explore. Both need to be totally legible and complement each other so that they are presented to the viewer as part and parcel of each other. This is a very useful tool to use to bring attention to something special you want your visitors to view. Do not, however, overdo it. Doing it too often will defeat its purpose.

Properly weight text and careful use of the words you use it with are very important. You can’t use the first work of text and then continue the rest of the sentence with the smaller text by putting it up top. If you were to do that it would be read in the wrong order.  In this case, you would use the dark text as your intro and the lighter text down at the bottom as it would then be read second.

Using this principle, which is done in CSS using a code similar to the one below you, will be able to organize things the way you want them.  Obviously, the fonts and the sizes and the colors can be changed to suit you. The principal of the code will remain the same though.

Using this code and altering it to suite yourself, it will allow you to create the effects and by altering the sizes as well as the fonts and weights you can produce whatever effect you want. Play with it and have some fun.


Leave a Reply

Malcare WordPress Security