|
Most blogs and a few of the article directories allow you to jazz up your posts using special code known as
HTML, which is an acronym for Hyper Text Markup Language. It’s the type of code used to make Web site pages appear as you see them in your
browser. Even if you won’t be programming your own site, knowing just a little bit about a few simple code tags can make your posts pop off the page.
The great news is that HTML is a very intuitive code language. It uses simple tags to tell text content how to appear
on the page. For instance, the tag <b> is used to make text bold. Below we’ll cover the most common tags, what they do, and how to properly use them.
All HTML tags must be enclosed within these two symbols: < >. This alerts the browser that the characters inside the
symbols are code tags and not content. To end the effect of the tag, a slash mark is used inside the symbols, like this:
</ >
Bold Fonts
There are two tags that make font characters bold. They are <b> and <strong>.
Here’s an example of the content: This word is bold.
Here’s an example of the code: This <b>word</b> is bold.
Or you can use this code: This <strong>word</strong> is bold.
Any content between the <b> and </b> tags would appear in bold face.
Italics
There are two tags to make fonts appear in italics. They are and
<i> and <em>. You’ll want to use one of these tags for the title of your book.
Example of content: All Just the FAQs books help you create an online presence.
Example of code: All <i>Just the FAQS</i> books help you create an online presence.
Or you can use this code: All <em>Just the FAQS</em> books help you create an online presence.
Using multiple tags
You can make the title of your book appear in both bold and italics by using nested tags. They
are called nested due to the order of their placement. An easy way to remember this order is
FILO, which stands for First In, Last Out.
Example of content: My book,
Blogging for Riches, will be in print next year.
Example of code: My book, <b><i>Blogging for Riches</i></b>, will be in print next year.
Notice that the tags were closed in reverse order. The
<i> tags are nested within the<b> tags. Most
browsers will accept tags that are not closed in the proper order. But, to ensure that your content appears correctly in all browser types,
it’s a good idea to cultivate the habit of using nested tags properly. You can nest any number of tags together, not just bold and italic.
Line Breaks
There are two tags that cause a line break in HTML. They are
<br> for break, and <p> for new paragraph.
To simply add one line space, use the br tag.
Example of content:
This is line one.
This is line two.
Example of code:
<p>This is line one.<br>
This is line two.</p>
Using the <br> tag is a great way to control layout, especially if
you are formatting poetry. It guarantees that the lines will break where you intend.
To add two line breaks and begin a new paragraph, use the
<p> tag.
Example of content:
This is line one.
This is line two and a new paragraph.
Example of code:
<p>This is line one.</p>
<p>This is line two and a new paragraph.</p>
Notice that there is no extra line space between the lines of
code. You can put one in if you like, for clarity, but the browser will do it for you when the content appears online.
Color and HEX numbers
While creating your blog or Web site, you will likely be faced with choosing colors for
different elements. While many blogs offer a simple color chart from which to choose, you may want to match a specific
color of something, like your logo. To get exact colors, you’ll want to know the HEX code of the colors in your logo.
HEX is simply a format used to count in binary (1s and 0s) in computer language. A HEX color code looks like this:
#FFFFFF, which is the code for white. The HEX number #000000 is the color black. Notice that the # symbol always precedes the actual HEX code.
There are hundreds of sites on the Web that display full HEX color charts to help you choose the right colors
for your site. Simply search the terms “hex color” or “hex code”.
Using Widgets
At some point you may want to incorporate a third party widget into your blog. Widgets are special features,
like the book carousels offered by Shelfari and Amazon. These contain special code known as “scripts.” Sites that offer widgets often let
you customize them and then auto-produce the special script code, sometimes called a “snippet”, for you to copy and paste into your site
or blog. This code will have the tags <script> and </script> around it
Here’s a little keyboard shortcut for copying and pasting. Once you highlight the script code, hit the keys Cntl + C.
That will copy the code to your clipboard. After you select the place you want to place the code, hit the keys Cntl + V to paste it.
Good to Go
With just a few simple tags of HTML, you can jazz up your posts and make your text outstanding. If you want to
learn more about HTML tags, there are wonderful free tutorials all over the Internet.
|
