Do you want more visitors to your blogsite? Your most probable answer would be yes. It is unlikely that you created your blogsite to simply let it stagnate or left it unread and unappreciated. It is safe to assume that you created your blogsite to communicate your thoughts to other people – not unless you are too introverted that you simply want yourself to be the sole reader of your blogs. Well, this is quite possible. Some people simply want to have a private online journal much similar to a paper-based diary that is kept under lock and key. On the other hand, when it comes to blogging, most people want to be noticed. Nonetheless, it is not as easy as it may seem. There are literary billions of web pages existing on the internet, including your own blogsite. The internet is pretty much a crowded place. It is hard to get noticed if your blogsite is simply idling by.
There are several ways whereby you can generate traffic to your blogsite. These methods are collectively known as web optimization. Sometimes, it is also generically called search engine optimization or SEO. SEO is an industry of its own. In fact, there are many companies that specialize on SEO as a primary web marketing tool. For the sake of simplicity and brevity, I will only discuss five basic ways whereby you can improve web traffic for your blogsite.
Here is a brief list of the five basic methods of optimizing your site:
I. Join Blog Social Networking Sites
II. Use Search Engines
III. Register Your Site to Directories
IV. Visit Other Blogsites and Post Comments
V. Write Interesting Posts
I. Join Blog Social Networking Sites
By joining blog networking sites such as MyBlogLog and BlogCatalog, you can generate regular visitors for your sites. In this manner, you may also buil contacts with other blogers that share your interests. Hence, it is advisable that you specialize on a particular blog genre such as movie reviews. It is not a very good idea to have a blogsite that has widely diversified and unrelated topics. Well, that is if you intend to atract specific types of readers. For instance, I have this blogsite: Much Ado About Nothing that focuses on atheism. Specializing on a particular genre will make you well-versed on that particular genre.
Blog networking sites allow you to join web communities, add contacts, and join group discussions or forums. Blog Networking sites also feature useful widgets that you can embed on your site.
II. Use Search Engines
Another way of increasing web traffic for your site is to register your URL to search engines such as Google, Yahoo, Yehey, and MSN. Most peole search the internet using search engines. However, you should be particular about keywords and tags that are related to your site. For instance, if your site discuss about, movies, you should always include tags and keywords that are related to movies. Greater volume of keywords and tags may increase your ranking on search engines. Registering to RSS feeds such as FeedBurner may also help in optimizing your site.
III. Register Your Site to Directories
By registering your site to blog directories such as found on this site (located under heading Blog Listing), you can optimize your blogsite. Basically, registering your site to online directories will create links to your site. This will enable search engine robot crawlers to easily find your site. To prove this point, click this link Philippine Affairs. As you can see, from my hit statistics, I already have several thousand of unique page views. This is fascinating for me simply beacause these hits were just recently generated (barely a month ago). Although my Philippine Afairs blog is more than one year old, I only had few hundreds of unique page views for the past one year. This was before I tried optimizing my Philippine Affairs blog.
IV. Visit Other Blogsites and Post Comments
By far, this method is the best method for generating high-quality, targeted traffic for your site. The other methods may generate page views and good page ranking but they do not directly atract the specific readers that you want for your site. However, this method requires more efort simply because this entails regular updating of your blog. It is advisable that you visit blogsites that share your interests. You may also ask the blog authors to exchange links with you. In this manner, your web presence will be boosted.
V. Write Interesting Posts
This method is the most enjoyable method simply because you would be writing about topics that are ineresting to you and to your readers. As I have mentioned before, you do not need to be an expert on certain fields to write interesting and informative articles. Writing blogs is also a learning process. However, if you want to maintain quality, post original contents. You can paraphrase from other sources but avoid copy-pasting contents. Search engines tend to ignore cloned contents.
Finally, optimizing your blogsite will give you more leverage to earn. If you want to learn how to monetize your blogs, read my post on this topic: Earn Through Blogging.
2007-10-31
Directing Web Traffic to Your Blog
HOME||CONTENTS
2007-10-30
EarnThrough Blogging
HOME||CONTENTS
Your blog is a money-maker; you can actually earn by simply writing about the things you like. Nonetheless, do not be misled. Earning through blogging is not as easy as it may seem. There are several factors to be considered such as the web traffic of your blog, the layout of your blog, your skills, and, of course, the content of your blog. The most important of all of these factors is the content of your blog. If the content of your blog is interesting, you will always have a captured market of readers as well as advertisers. Hence, it is first important to find your own niche. It is not advisable that you simply plagiarize from other contents. The content of your blog should be unique. Otherwise, your page ranking in search engines will be terribly affected.
There are actually several ways whereby you can earn through blogging. However, for the sake of simplicity, I will only discuss the two basic and most popular ways. First is through Google AdSense and second is through Pay Per Post.
GOOGLE ADSENSE
If you are new to blogging, the easiest way to earn residual income through blogging is by subscribing to Google Adsense. It is advisable that you use Blogger as platform for your blogsite. Other blog hosts do not permit Google Adsense. There are actually three types of Google AdSense that you can embed on you blogsite, namely, AdSense for Content, AdSense for Search, and AdSense for Referrals.
The revenue that will be generated from Google Adsense is only residual. Do not expect instant high amount of income. It may take a month or even a year before you can generate substantial income from Google AdSense. However, there are instances wherein readers of your blogsite may subscribe to the referral ads. Depending on the amount paid, you will have certain commission for that. I have actually earned $36 in just one day from one referral advertisement. Typically, your total earnings should be at least $100 before Google Adsense send you the check. If you want to put Google AdSense in your blogsite, simply register and follow the instructions.
PAY PER POST
Another better way to generate revenue from your blogs is to subscribe to Pay Per Post. Simply follow the link graphic below and fillup the form to subscribe:
Your blogsite first has to be approved before you can be paid for your articles. Typically, advertisers will post writing opportunities. You have to choose the most appropriate topic you are comfortable writing about. Depending on the length, technical details and paying capacity of the advertiser, you can earn from five dollars to several hundreds of dollars per article. Generally, article length or word count specifications vary, but the average word count requirement for an article is about three hundred words. Just make sure that your content is not plagiarized. Otherwise, it will be rejected. Subscribing to Pay Per Post is a good way to earn extra income. However, do not be surprised if some of your submitted articles will be rejected.
2007-10-28
Linking To Email
HOME||CONTENTSIf you want to create a text link to your email or multiple email addresses on your Blogger blogsite side bar, you can use these basic anchor tags: <a href="mailto: email address"> EMAIL </a> to create the link. Simply choose the "add text" option of the "Choose a New Page Element" tab, as shown below:
On the other hand, if you want to use an image link, you should enclose <img src="image.jpeg"> tags inside the abovementioned anchor tags, instead of the "EMAIL" text. You can actually choose any appropriate image you like. It could be JPEG image or a GIF image such as the one I have chosen. Simply specify the URL of the image that you prefer. You can use Google image search to find the appropriate image that you prefer.
The codes for the above image link are these:
You can simply replace the email addresses shown above with the email address or addresses that you intend to link. If you have multiple email addresses, use commas to separate each email address. If you click the above image, the MS-Outlook program will automatically open. This is a very convenient way for your readers to send you emails.
2007-10-24
Fluid, Three-Column Layout
HOME||CONTENTSIn terms of adjustability, there are actually two basic types of web layouts. The first type is the fixed layout. Most blogsites have this type of layout. While the second type of layout is the fluid layout. In both types of layouts, there are corresponding advantages and disadvantages. The specific type of layout can be determined or identified by the behavior of the texts and elements of a particular web page. If you horizontally adjust the size of the web browser, the texts and page elements may or may not shift their respective positions. If the texts and elements do not change their respective positions, the layout of that particular page you are viewing is fixed. Conversely, if the texts and elements of the page shift positions to fit the size of the window browser, the particular page that you are viewing has a fluid layout.
First, we will change the standard two-column layout of your Blogger blogsite template. It is advisable that you first switch to minima template. This is the easiest Blogger template to edit.
NOTE: If you find it hard to directly edit the HTML template of your blog, you can use Notepad or Word to do the editing. Copy-paste the entire template onto a separate Notepad or Word document. Simply use the CTRL+F command to find the specific sections that are enumerated here. After you have done all the editing, you can again copy-paste the edited template codes onto the template editor box of your blogsite.
I. Change to Three-Column Layout:
Step1: Backup your template by copy-pasting the template codes onto Notepad and saving the file. Make sure that you checked the "expand widget" box.
Step2: Find these sections in your HTML template:
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
Change the above codes into these:
<div id='right-sidebar-wrapper'>
<b:section class='sidebar' id='right-sidebar' preferred='yes'>
Step3:In the style sheet portion of your blog template, change this element: "#sidebar-wrapper" into this: "#right-sidebar-wrapper"
Step4: Find this section: <div id='content-wrapper'>
Add these codes below it:
<div id='left-sidebar-wrapper'>
<b:section class='sidebar' id='left-sidebar' preferred='yes'/>
</div>
Step5: Add these codes to your style sheet:
#left-sidebar-wrapper {
width: 220px;
float: left;
word-wrap: break-word;
overflow: hidden;
}
Step 6. Change outer-wrapper and header-wrapper width. In your CSS-style sheet look for the #header-wrapper and #outer-wrapper definitions, and change the width definitions from 660 to 860.
NOTE: Always save your template every time you make changes.
The layout that you have just created is a fixed layout. You can change this layout into fluid layout by adjusting the wrapper elements.
II. Change to Fluid Layout:
Step1: Locate these element wrappers or CSS definitions in your style sheet:
HEADER
#header-wrapper {
width:950px;
background:#000000;
margin:0 auto 10px;
border:4px outset $bordercolor;
}
OUTER
#outer-wrapper {
width: 950px;
margin:0 auto;
padding:15px;
text-align:left;
font: $bodyfont;
}
#main-wrapper {
width: 450px;
border:4px outset $bordercolor;
background:#C9BE62;
padding:10px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
RIGHT SIDEBAR
#right-sidebar-wrapper {
text-align:center;
width: 200px;
background:#EAC117;
border:2px solid $bordercolor;
padding:0px 5px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
LEFT SIDEBAR
#left-sidebar-wrapper {
text-align:left;
width: 190px;
padding-left:50px;
float: right;
word-wrap: break-word;
overflow: hidden;
}
Step2: Change the width definitions from pixels (px) into percentage (%). An ideal percentage proportion would be: 100% for the header and outer wrappers; 60% for the main wrapper; and 20% for both the sidebar wrappers. You can experiment on this to see the best result that you prefer.
2007-10-19
Adding a Menu Bar
HOME||CONTENTSThere are actually several methods of adding a horizontal menu bar in your blogsite. However, the method that I have used in this blogsite is quite straightforward and does not involve any modification of the style sheet of the template. A menu bar is actually just a horizontal link list found on the header area. For instance, the menu bar may contain links to a profile page or to an interactive page for games or embedded chat rooms such as found in this blogsite. These pages could be separate posts within your site or external links. Remember, every blog post that you make has its own unique page URL. Simply click the title of the specific post you want to link to display the URL address.
Here are the simple steps you can follow to create a menu bar above the blog header:
STEP1. Open the HTML template editor of your blogsite and check the box that says "expand widget."
STEP2. Copy and paste the entire template onto Notepad or Word. Save the document as backup template. You may also use this document to edit the HTML codes of your template.
STEP3. Locate this section in the HTML template of your blog:
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
STEP4. Change the maxwidgets to "2" and also change the showaddelement to "yes". Save your template and view the Page Elements tab of the template. You will notice that an additional Page Element box appear above the Header box.
STEP5. Click the "Add a Page Element" on the new Page Element box above the Header box. Select the add text option.
STEP6. Type the names of links that you want to appear on your menu bar. Type these names as one line with verical separators. For instance, you may type the following:
HOME|ABOUT ME|CHAT|PICTURES
STEP7. Now comes the tricky part. You must link each link name to a particular post on your blogsite. First, go to that particular post page by clicking the title of the post. For instance, if you have a post about a short autobiographical profile, copy the URL address of this particular link. You will use this URL address to create a link for the "ABOUT ME".
STEP8. Here are the codes that you should use to link each link name on your menu bar: <a href="url address"> and </a>. You have to enclose each link name inside these codes to create specific links. You simply have to specify the url address.
There is another method of creating a menu bar. But this requires the modification of the style sheet. I will make a post about this later. For now, the method that I have explained in this post will suffice for your basic need.
2007-10-15
Linking Graphics
HOME||CONTENTSYou can easily insert pictures or graphics in your blog post using the upload picture button. You may upload directly from your computer or from an internet source. You may also easily link the picture or graphics to any web address you prefer by simply highlighting the picture and clicking the link icon/button of the tool options available on the menu bar of the rich-text editor box of your blog post.
However, linking a graphic or picture is not straightforward when it comes to the widgets of your side bars. Hence, a simple knowledge of HTML tags would be helpful.
The basic HTML tag used for displaying a graphic is this <img src="url address">. This HTML tag will insert the graphic of the URL address that you specified. It it is advisable that you use jpeg images.
On the other hand, to link the said image to a particular web address, you simply have to enclose the above codes inside these codes: <a href="web address"> and </a>.
Save your post and view your blog. As you hover, the mouse arrow over the image, you will notice, that it will change into hand, indicating that the image is a linked image. The aformentioned HTML codes will give you flexibility in inserting images and linking those images whenever the text editor does not provide easy clickable options such as in the case of sidebar picture and text widgets.
For instance, the codes used for the image shown below are the following:
<a href="http://homar.wordpress.com/" target="new">
<img src="http://homar.files.wordpress.com/2007/09/rizalman.jpg"></a>
2007-10-11
Dropcaps Effect
HOME||CONTENTSHave you noticed the styles of most magazines and some books? The first letter of each article is typically exaggerated in size. The rest of the paragraph wraps around the overly-sized capital letter as if it is a picture or graphic. This style is primarily for aesthetic purposes. However, it is also intended to give emphasis to the start of the article. This style is called drop caps.
You can actually imitate this style in your web articles such as blogs, provided that you have access to the template style sheet of your blogsite. When it comes to flexibility in style, Blogger is the best free blog host. Other blog hosts do not allow access to the template style sheet.
To display the drop caps effect, you must first open the HTML-CSS template of your blogsite. Then, insert the codes listed below into the style sheet of your template. The style sheet is the collection of CSS codes found between the <head> and </head>tags of your template.
As you can see, the first letters of my posts are all displayed as drop caps. These do not involve the mere resizing of the texts in the blog post template. Drop caps involve the modification of the style sheet. Below are the codes that I have used.
.dropcaps
{
float:left;
color: $#C68E17;
font-size:100px;
line-height:80px;
padding-top:1px;
padding-right:5px;
}
After inserting the above codes in the style sheet of your template, save the template and view your blog. You will notice that no change has occured. This is because you still need to enclose each first letter of your posts inside these codes: <span class="dropcaps"> and </span>.
After enclosing the first letter of your post save your blog and view the result. You always have to enclose the first letter of your post to display the drop caps effect.
I still do not know how to automate this style (if it can really be automated at all). If someone reading this post knows the solution to this, please post a comment. I will be trully grateful for the information.
2007-10-04
Creating Table
HOME||CONTENTSCreating a table using HTML tags is not as straightforward as you would probably achieve it using special softwares such as MS-FrontPage or MS-Word. Yes, you can actually create web pages using word processor programs such as MS-Word to easily create customized web pages. You simply have to save the Word document as HTML and the tags will automatically be generated. It is very convenient. However, it is still helpful to know the basic structure of an HTML table, especially if you want to trouble shoot a basic web document such as blogs.
There are instances wherein you may need to create a table for your blogs. A table may contain texts, links, and graphics. There are three basic sets of HTML tags used in creating tables for a web document. These tags are shown below. The sample table that you see here uses the displayed HTML tags. However, you should note that when it comes to Blogger, table tags should be written as continous one line. Pressing the enter key several times would create too much white spaces above the table. This is especially true if the table has a lot of data contents. Click this link to see an example of a table with too much white spaces above it: HTML Tags.
SAMPLE TABLE:
| data1 | data2 |
| data3 | data4 |
Codes Used:
<table border="2">
<tr>
<td>data1</td> <td>data2</td>
</tr>
<tr>
<td>data3</td> <td>data4</td>
</tr>
</table>
Definitions:
- <table> --used to delineate the boundaries of the table
- <tr> --used to delineate rows
- <td> --used to delineate cells where table data are located
- border="number" --used to set the border lines
2007-10-02
The Body Tag Attributes
HOME||CONTENTS
For instance, to set the background color of the document, you simply have to enter this format: <body bgcolor="color">. The "color" declaration can either be words or hexadecimal HTML tags. For example, you may write "red" or "FF0000" to display red background. There are other color specifications you may use.
On the other hand, to setup the background image, you simply have to enter this format: <body background=''image location">. The "image location" should be hosted by a server. Hence, you may use this image location: "http://www.libcoop.net/mcl/j0382584.jpg" to display the image above. However, any specified background image will be tiled. The image background that you specified will be appplied to the whole document.