RSS

Improved Text Appearance

Proper grammar as well as good choice of words lead to a better appearance of your overall text. Usually such html code is covered in WYSIWYG (what you see is what you get) editors with buttons, supplied in webscripts. Behind these buttons is the source code in html. Whether we want to change the color, make the text bold, insert an image or make a part of the text clickable, we only need to click on a button in such a wysiwyg editor and we’re done.You have them in blogger, forums, applications, basically nowadays you should have them included in every web applet or desktop program, but in some cases where the editor has missing buttons or is not present at all, it is beneficial if you have the knowledge of tags behind those buttons… This is how a WYSIWYG editor looks like:

Still, in some cases and WYSIWYG editor might not be enough or we don’t have a WYSIWYG editor, so we need to improve the quality more. For this we need some basic understanding of html code. Don’t get scared now! We will only cover those we need in text messages, emails, or posts and you will see how easy it is. If you don’t remember it all you can still bookmark this page, and use it as a reference whenever needed. In html we use a start for the code and an end which is represented by a slash /. These are called tags.

CHANGE COLOR OF TEXT

If you want to change the color of the text use the following code. If you would like other color then red, use one of the values below and put them in the quotes where “red” is now.

Code:

Output: Your Text Here

Color Values: AliceBlue, AntiqueWhite, Aqua, Aquamarine, Azure, Beige, Bisque, Black, BlanchedAlmond, Blue, BlueViolet, Brown, BurlyWood, CadetBlue, Chartreuse, Chocolate, Coral, CornflowerBlue, Cornsilk, Crimson, Cyan, DarkBlue, DarkCyan, DarkGoldenRod, DarkGray, DarkGrey, DarkGreen, DarkKhaki, DarkMagenta, DarkOliveGreen, Darkorange, DarkOrchid, DarkRed, DarkSalmon, DarkSeaGreen, DarkSlateBlue, DarkSlateGray, DarkSlateGrey, DarkTurquoise, DarkViolet, DeepPink, DeepSkyBlue, DimGray, DimGrey, DodgerBlue, FireBrick, FloralWhite, ForestGreen, Fuchsia, Gainsboro, GhostWhite, Gold, GoldenRod, Gray, Grey, Green, GreenYellow, HoneyDew, HotPink, IndianRed, Indigo, Ivory, Khaki, Lavender, LavenderBlush, LawnGreen, LemonChiffon, LightBlue, LightCoral, LightCyan, LightGoldenRodYellow, LightGray, LightGrey, LightGreen, LightPink, LightSalmon, LightSeaGreen, LightSkyBlue, LightSlateGray, LightSlateGrey, LightSteelBlue, LightYellow, Lime, LimeGreen, Linen, Magenta, Maroon, MediumAquaMarine, MediumBlue, MediumOrchid, MediumPurple, MediumSeaGreen, MediumSlateBlue, MediumSpringGreen, MediumTurquoise, MediumVioletRed, MidnightBlue, MintCream, MistyRose, Moccasin, NavajoWhite, Navy, OldLace, Olive, OliveDrab, Orange, OrangeRed, Orchid, PaleGoldenRod, PaleGreen, PaleTurquoise, PaleVioletRed, PapayaWhip, PeachPuff, Peru, Pink, Plum, PowderBlue, Purple, Red, RosyBrown, RoyalBlue, SaddleBrown, Salmon, SandyBrown, SeaGreen, SeaShell, Sienna, Silver, SkyBlue, SlateBlue, SlateGray, SlateGrey, Snow, SpringGreen, SteelBlue, Tan, Teal, Thistle, Tomato, Turquoise, Violet, Wheat, White, WhiteSmoke, Yellow, YellowGreen.

CHANGE FACE OF THE FONT

There are many types of fonts out there, but most are never used so I have composed a list of 20 most popular fonts. If you want to change the font face to something else than Comic Sans MS, just put another value into the “quotes”.

Code:

Output: Your Text Here

Face Values: Times New Roman, Arial, MS Sans Serif, Courier, Impact, Wingdings, Verdana, Comic Sans MS, Arial Black, Garamond, Arial Narrow, Tahoma, Georgia, Basset, Courier New, Century Gothic, Desdemona, Braggadocio, Algerian, Century Schoolbook.

CHANGE SIZE OF THE FONT

Code:

Output: Your Text Here

Size Values: From “-7″ to “7″.

MAKE YOUR TEXT BOLD

Code:

Output: Your Text Here

MAKE YOUR TEXT ITALIC

Code:

Output: Your Text Here

HORIZONTAL LINE ABOVE YOUR TEXT

Code:

Output:


Your Text Here

STRIKED TEXT

Code:

Output: Your Text Here

UNDERLINED TEXT

Code:

Output: Your Text Here

ALLTOGETHER EXAMPLE

In this example we changed font face, color and size. We made it bold and italic all in one go.

Code:

Output: Your Text Here

MAKE A LIST

If you’re counting items or making a list of words in your text, it is best to use the html list code. Lets look at an example. “ul” is the definition for an alphabetically unordered list and “li” for a listed item. If you would like and ordered list use “ol” instead of “ul”.

Code:

Output:

  • Ham
  • Milk
  • Cheese
  • Apple

INSERT A LINK

Sometimes you want to write a text and link that particular section to a website. In these example if you click on “My Web Site” you are forwarded to bustathief.com.

Code:

Output: My Web Site

INSERT AN IMAGE

If your image is not online yet, you need to upload it to one of the free image hosting websites. If however your image is already online and you want it to be displayed in your text, copy the direct link to your image and use this code.

Code:

Output:

  • www.imageshack.us (No Registration)
  • www.freeimagehosting.net (No Registration)
  • www.photobucket.com (Registration)

If you have just one image to share I would recommend imageshack, since you don’t have to register. If however you plan on sharing more images at the same time or at a future date, I recommend photobucket, since you have full control of all your images online! All services are free.

INSERT VIDEO OR MOVIE

The best way to do this is to go to a popular video website like youtube.com and upload your video for free than use the embeded code and post it with your article, text or email. You will see “embed” next to the video. You will have to register first. Also note that violent or adult videos will not be accepted into youtube. If you have questionable content which you would like to post you will have to search for another alternative to youtube which will accept this kind of content.

INSERT A TEXT BOX

A text box is usually needed when a text needs to be shown that otherwise could not be like on my examples above. If I were to write the code without a text box, the code would already do its job and take the effect it is supposed to. By inserting a text box we eleminate the effect, allowing to write the code. You can change the rows and cols value to suit your needs.

Code:

Output:

Bookmark and Share

Leave a Reply