Business and Marketing Kavoir & Whatever

You never know what is right until you yourself try

A snippet from Kim Krause Berg:

It may not be intended for me, my gender, my age, my eyesight or my interests. It may be perfect for who it is designed for and it’s my job to inquire about that.

That’s the essence of the problem. Enough of so many self-crowned critics and experts think they know which is better and what should be done. Needless to say what we want – no, that’s what you want, not us nor everybody else, academics!

It’s even more brutally true with marketing. No one really knows how marketing works in the end. No one. Everyone has his own experiences and ways to get things done by a lot of trials and failures. As long as it generates positive results, it’s one of the right ways and all that is left is to keep refining your unique methodology for better yield, and possibly migrate it into other areas. This is what successful men do. They don’t assume but they sure have their own ways through personal practices.

Things change. People change. What holds true and dear today may very well fall behind, being regarded obsolete or even harmful. This is one of the main reasons why I don’t believe in any experts, especially in the business world.

Stock market is the perfect example to illustrate how accumulated random actions stack up as the real current economic expectations. No one outperforms the market in the long run no matter how the investors or opportunists strive to be ahead of the rest. It’s almost always in vain. So why not stop being so fussy about everything we do and just do what we want. Why not go with instincts and mend along the way instead of deliberately aiming to be correct and perfect in the first place.

You never know what is right until you yourself try. Rather than be told by some expert who think he can make everything right from the beginning simply by following the writings from another expert.

Give up, people who are spending their arms and legs to be outstanding. Those who turn out to be outstanding almost never started to be outstanding.

Internet Tools Programming Tips & Insights

Free Online Skills Test for Freelance Web Developers and Programmers: PHP, MySQL, (X)HTML, CSS, JavaScript and More

Hire The Best There are plenty of freelancing jobs sites and outsourcing interactive platforms between service providers and clients now. Elance is probably the most renowned online freelance jobs brokerage firm. Why? Google tells me. 😉

Elance has the largest bunch of backlinks according to Google via query “”, over 2,400 as of now, the most prominent in the industry with the second being less than 1,000.

All the free skills tests Elance offers

Elance decided to offer all of the tests on 245 different subjects and professions free for all registered members on Feb. 9. I spent a whole night doing all the tests, failing a few: did MySQL (SQL can be very professional and demanding with real problems) and got a 52; did Internet Security and got a 58 – sucks doesn’t it. The good part is that though I have never deemed myself as a Linux professional but got a 78 test score for it, I guess it’s just I have so many websites myself to maintain and practiced a hell lot on SSH. 🙂

Displayed below is my list of scores for the 5 skills I chose for exhibit to the clients, all about web development and internet marketing of course: XHTML 1.0, CSS 2.0, SEO, PHP5 and AJAX – currently hot technologies and skills in demand.

elance free skills test

Each of the test

Each of the knowledge or skill test consists of 40 multiple / single choices questions with 40 minutes for you to work them out. I spent 20 – 30 minutes on average on each of them. I think this may depend on how much you are familiar with or skilled in that area.

After signing up as a free member, you can take the skill tests as many times as you want but there’s a 14-day interval between retakes so choose your answers carefully.

Hire The Best
Complete list of available programming & web development skills tests

Active Directory
ADO.NET 2003
Adobe Flex Builder 2
Advanced Java
Advanced Php
Antispam and Antivirus
ASP 3.0
ASP.NET 2003
ASP.NET with SQL Server
Checkpoint Security
Cocoa programming for Mac OS X 10.5
ColdFusion MX 7
Computer Skills
Computer Technician
Data Modelling
Data Structures
Data Warehousing
DB2 Admin
DB2 Programming
Delphi 6
Developer 2000
Digital Signal Processing
Dot Net Fundamentals
Dot Net Nuke
Embedded System
Enterprise Java Beans (EJB) 2.0
Facebook Open Platform Development
Fiber Optics
Firewall Concepts
Game Programming Concepts
Google Android Programming
Internet Security
JDBC 2.1
JSharp 2003
JSP 2.0
Kernel Programming (Solaris 2.x internals)
Lean Certification
Mac OS X 10.5
Microsoft Access 2000
Microsoft Access 2003
Microsoft Access 2007
Microsoft Excel 2003
Microsoft Excel 2007
Microsoft Office Live Web Design
Microsoft OutLook 2007
Microsoft PowerPoint 2003
Microsoft PowerPoint 2007
Microsoft SharePoint Designer 2007
Microsoft SQL Server 2000
Microsoft SQL Server 2005
Microsoft Visio 2007
Microsoft Word 2003
Microsoft Word 2007
Networking Concepts
Networking Design Infrastructure (Win)
Networking Infrastructure (Win)
Networking Server 2003
Networking XP
OOPS Concepts
OpenGL Programming
Oracle 10g
Oracle 9i Administration
Oracle Database 10g
Oracle Forms 9i
Oracle PL/Sql 10g
Oracle PL/SQL 9i
Oracle SQL 9i
osCommerce v2.2
Paypal Integration
Perl 5
Power Builder
Programming with C
Programming with C#
Programming with C++
Python 2.x
QuickBooks Pro 2008
Redhat Linux 9.0 Admin
Redhat Linux 9.0 General
Ruby on Rails
SOAP 1.2
Software Testing
Solaris 10 U4
System Analysis
System Programming
Total Quality Management Certification
Unix Shell Script
VB.NET 2003
Virtual Private Network
Visual Basic 6
Visual Studio
Voice Over IP
Web Services
Wi Fi
Wimax Technology
Windows NT
Windows Vista Administration
Windows XP
Wireless Electronics
3ds Max 8.0
3ds Max 9
Adobe After Effects 7.0
Adobe Fireworks CS3
Adobe Flash CS3
Adobe FrameMaker 8
Adobe Illustrator CS3
Adobe InCopy CS3
Adobe InDesign CS3
Adobe Photoshop CS2
Adobe Photoshop CS3
Adobe Premiere
AutoCad 2007
Corel Ventura 10
CorelDraw X3
Digital Imaging
Dreamweaver CS3
FrontPage 2000
JavaScript 1.3
Joomla 1.5
Macromedia Director MX 2004
Macromedia FreeHand MX
Maya 7.0
PageMaker 7.0
Principles of Web Graphics Design
Quark XPress 7.0
Time Management

Hire The Best Like many others, as a web developer and marketer myself, I started by providing freelancing services while gradually building up my own online portfolio. Don’t need to rely on the work for a living now, but it doesn’t hurt to accept 1 or 2 freelance projects from time to time to know more people and to broaden your social network business wise upon a generous client.

Content / SEO Tips & Tutorials CSS & HTML Tips

The Ultimate On-page SEO Checklist – Better SEO, Semantics and Accessibility at The Same Time

Web Content Accessibility Guidelines (WCAG) 2.0 is the Bible of web developers who are responsible for HTML templating and independent content authors who are eager to reach the biggest audience possible. However, if you think that’s just for the sake of that, accessibility, think again.

WCAG is way more than just accessibility, it’s also the technical part of on-page SEO – leveraging the most out of HTML and make your web pages full of meaningful structures serving as containers of keywords.

Keywords alone don’t rule. Much attention should also be paid to how to combine and where to place them. Think about your competitors who are already writing rich HTML structures WCAG-wise such as by implementing the alt property / attribute of img tags. Yep, your explicit content is much better but in this case, without descriptive information for the images, you lost a combat in the search engine ranking war. Search engines just don’t know what the heck the image is about and you lost a good chance to tell them that it’s about the very niche you’ve been focusing on.


HTML is the language of the Web. Beginner webmasters who have just started a blog with WordPress may or may not know exactly what it is. Search engines read your content pages which is written in HTML to decide what your content is about and how relevant it is to a search phrase. Therefore, knowing how to write a rich structure HTML content page with as many HTML features as possible is crucial in winning the search engine war.

The most important tag or element of HTML in terms of SEO is undoubtedly <title></title>. It’s simply the first on-page factor that search engines look into to determine about your pages and what the content is. A page with a title will be significantly more successful than one without. A page with a fully descriptive title that is well optimized in keyword research will be much higher in search engine rankings than one with a poor title. It’s as simple as that.


WCAG is actually not the reason why I’m writing nor is it that for why you are reading this. Technically, it’s how we can make online content better to accommodate as much audience or terminals as possible by optimizing content structures. Accessibility and semantics is the meter and goal of it.

As search engines’ sophistication grows in analyzing large amount of online data, it’s now taking everything into consideration in rating web sites and their pages. HTML is the tool while WCAG is the perfect guideline for us to use that tool to extremes for our own as well as visitors’ sake.


SEO is the war to win search engine favors, thus visitors, ultimately buyers.

It’s where the money lies, baby.

Enough for the bullshit, now let’s get something done.

The On-page SEO Checklist

While you may have your own ideas to get things done in a certain way, below are a compilation of guidelines that may help you do them better in providing as much juicy keyword information to search engines as possible – in W3C‘s web standard way!

  1. Provide anchor text that describes the purpose of a link for anchor elements.
    <a href="routes.html">
      Current routes at Boulders Climbing Gym
    <a href="routes.html">
       <img src="topo.gif" alt="Current routes at Boulders Climbing Gym" />
  2. Combine ordinary text link with an adjacent image that’s relevant for the same destination. Add to the image an alternative text that’s different from the link anchor text.
     <a href="products.html">
       <img src="icon.gif" alt="product listings icon" />
       Products page

    For every image link, try adding a word or two of anchor text to it or at least make sure you have a descriptive alternative text for the image.

  3. Do provide text alternatives for the area elements of image maps.
    <img src="welcome.gif" usemap="#map1"
        alt="Areas in the library. Select an area for
    more information on that area." />
    <map id="map1" name="map1">
      <area shape="rect" coords="0,0,30,30"
        href="reference.html" alt="Reference" />
      <area shape="rect" coords="34,34,100,100"
        href="media.html" alt="Audio visual lab" />

    It helps the search engines as well as other web terminal devices understand the area and the linked resource better.

  4. Provide a descriptive title to every page you create.
    <html xmlns="">
          <title>On-page SEO Guidelines through WCAG 2.0 Techniques</title>

    A good title is worth a thousand dollars.

  5. Provide text and non-text alternatives for object.
    <object classid="java:Press.class" width="500" height="500">
      As temperature increases, the molecules in the balloon...
    <object classid="java:Press.class" width="500" height="500">
      <object data="Pressure.mpeg" type="video/mpeg">
        <object data="Pressure.gif" type="image/gif">
          As temperature increases, the molecules in the balloon...
  6. Provide definitions for abbreviations by the help of abbr elements.
    <p>Sugar is commonly sold in 5 <abbr title="pound">lb.<abbr> bags.</p>
    <p>Welcome to the <abbr title="World Wide Web">WWW</abbr>!</p>
    <p>Tasini <abbr title="and others">et al.</abbr> <abbr title="versus">v.</abbr>
    The New York Times <abbr title="and others">et al.</abbr> is the landmark lawsuit
    brought by members of the National Writers Union against ......</p>
  7. Provide definitions for acronyms by the help of acronym elements.
    <p>The use of <acronym title="Keep It Simple Stupid">KISS</acronym> became popular in ...</p>
    <p><acronym title="World Wide Web">WWW</acronym></p>
  8. Supplement a text link with the title attribute.
    <a href=""
       title="Read more about failed elephant evacuation">
       Evacuation Crumbles Under Jumbo load
  9. Provide alt attributes and title attributes on images used as submit buttons.
    <form action="" method="post">
      <input type="image" name="submit" src="button.gif" alt="Submit" title="Submit" />
  10. Use alt attributes on img elements.
    <img src="newsletter.gif" alt="Free newsletter.
       Get free recipes, news, and more. Learn more." />
  11. Use table markup to present tabular data and information.
        <td> </td>
        <td>Meet with Sam</td>
        <td> </td>
        <td> </td>
        <td> </td>
        <td> </td>
        <td> </td>
        <td> </td>
        <td>Doctor Williams</td>
        <td>Sam again</td>
        <td>Leave for San Antonio</td>
  12. Use caption elements to associate table captions with data tables.
    <caption>Schedule for the week of March 6</caption>
  13. Use summary attribute that describes the content of the table.
    <table summary="Schedule for Route 7 going downtown. Service begins
    at 4:00 AM and ends at midnight. Intersections are listed in the top row.
    Find the intersection closest to your starting point or destination, then read
    down that column to find out what time the bus leaves that intersection.">
        <th scope="col">State & First</th>
        <th scope="col">State & Sixth</th>
        <th scope="col">State & Fifteenth</th>
        <th scope="col">Fifteenth & Morrison</th>
  14. Use the scope attribute to associate header cells and data cells in data tables.
     <table border="1">
      <caption>Contact Information</caption>
        <td scope="col">Name</td>
        <td scope="col">Phone#</td>
        <td scope="col">Fax#</td>
        <td scope="col">City</td>
        <td scope="row">Joel Garner</td>
        <td scope="row">Clive Lloyd</td>
        <td scope="row">Gordon Greenidge</td>
  15. Use id and headers attributes to associate data cells with header cells in data tables.
         <th rowspan="2" id="h">Homework</th>
         <th colspan="3" id="e">Exams</th>
         <th colspan="3" id="p">Projects</th>
         <th id="e1" headers="e">1</th>
         <th id="e2" headers="e">2</th>
         <th id="ef" headers="e">Final</th>
         <th id="p1" headers="p">1</th>
         <th id="p2" headers="p">2</th>
         <th id="pf" headers="p">Final</th>
        <td headers="h">15%</td>
        <td headers="e e1">15%</td>
        <td headers="e e2">15%</td>
        <td headers="e ef">20%</td>
        <td headers="p p1">10%</td>
        <td headers="p p2">10%</td>
        <td headers="p pf">15%</td>
  16. Use ol, ul and dl elements for lists.
      <li>Mix eggs and milk in a bowl.</li>
      <li>Add salt and pepper.</li>
      <dd>turn on and off between .5 and 3 times per second
  17. Use definition lists for lists of terms and definitions.
    <dl title="Nautical terms">
        <p><em>Port</em> is the nautical term (used on
          boats and ships) that refers to the left side
          of a ship, as perceived by a person facing towards
          the bow (the front of the vessel).</p>
        <p><em>Starboard</em> is the nautical term (used
          on boats and ships) that refers to the right
          side of a vessel, as perceived by a person
          facing towards the bow (the front of the vessel).</p>
  18. Use h1, h2, h3, h4, h5, h6 to identify headings and different page sections.
     <title>Stock Market Up Today</title>
     <!-- left nav -->
     <div class="left-nav">
     <h2>Site Navigation</h2>
     <!-- content here -->
     <!-- main contents -->
     <div class="main">
     <h1>Stock Market up today</h1>
     <!-- article text here -->
     <!-- right panel -->
     <div class="left-nav">
     <h2>Related links</h2>
     <!-- content here -->
  19. Use label elements to associate text labels with form controls.
    <input type="checkbox" id="markuplang" name="computerskills" checked="checked">
    <label for="markuplang">HTML</label>
  20. Use longdesc attributes to further describe important non-text objects such as images.
    <p><img src="chart.gif" alt="a complex chart" longdesc="chartdesc.html"/></p>
  21. Use noembed element with embed element.
    <embed src="../movies/"
      height="60" width="144" autostart="false">
        <a href="../transcripts/transcript_history_rome.htm">Transcript of "The history of Rome"</a>
  22. Use semantic markup such as strong and em elements to mark emphasized or special text.
     ...What she <em>really</em> meant to say was, &quot;This is not ok,
     it is <strong>excellent</strong>&quot;!... 
  23. Use blockquote element for block quotations and q element for inline quotations.
    <p>The following is an excerpt from the <cite>The Story of my Life</cite> by Helen Keller</p>
       <p>Even in the days before my teacher came, I used to feel along the square stiff boxwood
       hedges, and, guided by the sense of smell, would find the first violets and lilies.
       There, too, after a fit of temper, I went to find comfort and to hide my hot face
       in the cool leaves and grass.</p>
     <p>Helen Keller said, "<q>Self-pity is our worst enemy and if we yield to it,
    we can never do anything good in the world.</q>"</p>
  24. Use the body of object elements.
     <object classid="">
      <p>Here is some text that describes the object and its operation.</p>
    <object classid="">
      <img src="staticlogo.gif" alt="Company Name" />
  25. Use the dfn element to identify the defining instance of a word.
    <p>The Web Content Accessibility Guidelines require that non-text content
    has a text alternative. <dfn>Non-text content</dfn> is content that is not a sequence
    of characters that can be programmatically determined or where the sequence is
    not expressing something in human language; this includes ASCII Art (which is a
    pattern of characters), emoticons, leetspeak (which is character substitution), and
    images representing text .</p> 
  26. Use the dir attribute on an inline element to resolve problems with nested directional runs.
    <p>The title says "<span lang="he"
    dir="rtl">פעילות הבינאום, W3C</span>" in Hebrew.</p> 

    rtl stands for right to left while ltr is left to right.

  27. Use the language attributes on the html element.
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    <html xmlns="" lang="fr" xml:lang="fr">
      <title>document écrit en français</title>
      <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    ...document écrit en français...
  28. Use lang attributes to identify specific changes in the human language.
    <blockquote xml:lang="de" lang="de">
        Da dachte der Herr daran, ihn aus dem Futter zu schaffen,
        aber der Esel merkte, daß kein guter Wind wehte, lief fort
        und machte sich auf den Weg nach Bremen: dort, meinte er,
        könnte er ja Stadtmusikant werden.
  29. Use the link element and navigation tools to designate page relationships.
    <link rel="Contents" href="Contents.html" title="Table of Contents"  />
    <link rel="Index" href="Index.html" title="Index" />
    <link rel="Prev" href="Chapter01.html" title="01. Why Volunteer?" />
    <link rel="Next" href="Chapter03.html" title="03. Who Volunteers?" />
  30. Use ruby element to provide information about the pronunciation and meaning of a run of text where meaning is determined by pronunciation.
  31. Use the title attribute of the frame and iframe elements.
    <html xmlns="">
        <title>A simple frameset document</title>
      <frameset cols="10%, 90%">
        <frame src="nav.html" title="Main menu" />
        <frame src="doc.html" title="Documents" />
            <a href="lib.html" title="Library link">Select to
            go to the electronic library</a>
  32. Use the title attribute to identify form controls when the label element cannot be used.
    <label for="searchTerm">Search for:</label>
    <input id="searchTerm" type="text" size="30" value="" name="searchTerm">
    <select title="Search in" id="scope">
  33. Use null alt text and no title attribute on img elements for images that user browsers or search engines should ignore.
    <img src="squiggle.gif" width="20" height="20" alt="" />
  34. Provide a description for groups of form controls using fieldset and legend elements.
    <form action="" method="post">
        <legend>Your preferred philosopher</legend>
        <input type="radio" name="philosopher" id="philosopher_socrates" value="socrates"/>
        <label for="philosopher_socrates">Socrates</label>
        <input type="radio" name="philosopher" id="philosopher_plato" value="plato"/>
        <label for="philosopher_plato">Plato</label>
        <input type="radio" name="philosopher" id="philosopher_aristotle" value="aristotle"/>
        <label for="philosopher_aristotle">Aristotle</label>
  35. Ensure that opening and closing tags are used according to specification.
  36. Ensure that Web pages are well-formed with respect to XML.
  37. Use optgroup to group option elements inside a select.
    <form action="" method="post">
        <label for="food">What is your favorite food?</label>
        <select id="food" name="food">
          <optgroup label="Fruits">
            <option value="1">Apples</option>
            <option value="3">Bananas</option>
            <option value="4">Peaches</option>
            <option value="5">...</option>
          <optgroup label="Vegetables">
            <option value="2">Carrots</option>
            <option value="6">Cucumbers</option>
           <option value="7">...</option>
         <optgroup label="Baked Goods">
           <option value="8">Apple Pie</option>
           <option value="9">Chocolate Cake</option>
           <option value="10">...</option>
  38. Use the title attribute to provide context-sensitive help.
    <label for="searchAddress">Address: </label>
    <input id="searchAddress" type="text" size="30" value="" name="searchAddress"
     title="Address example: 101 Collins St, Melbourne, Australia" />

What a list.

Make yourself familiar with each and every of these guidelines and your days as a HTML student is well over. It’s also a very good start for SEO courses.


CSS: Align Center – Center Align Texts or Images in HTML and CSS

There used to be an HTML way to center align things such as texts, images or other contained elements. For the sake of semantic markup, let’s forget about it from here.

CSS is the only correct way to align things such as texts and images center now. To center align a paragraph or an image, use the CSS rule text-align:

p {text-align:center;}

You need to change the selector p in this case to fit your own situation. For instance, to center align a poem or a lyric in a div with class="piece":

div.piece {text-align:center;}

With text-align:center, all things inside div.piece is center aligned including all texts, images or more div elements and things in them. It’s a automatically inherited CSS style rule.

Know how to left align or right align in CSS.


CSS: Align Right – Make text or image aligned right in HTML page

Yeah, well, I know, I just wrote a quick post for those who don’t know how to align text left in HTML. Silly. Now comes a redundant one for those who don’t know how to align text right in HTML and CSS.

[Someone from beyond the web page and monitor screen throws me a tomato: Hey, you really think people are as stupid as you can get?!]


Anyway, here’s the solution:

p {text-align:right;}

This would prescribe that the text inside all p element to be aligned right, generically of course, because it could be overridden later.

CSS text-align is the rule we should be using here. By default all texts in HTML web pages are left aligned, so apparently text-align:right would be much useful than text-align:left.

Know how to center align or left align in CSS.


CSS: Align Left – Make text or image aligned left with CSS

Believe it or not, though this is rather basic in CSS, someone just poked on Gtalk to ask how he could align a paragraph left in HTML as he could in Word.

Here goes a quick post for the solution:

p {text-align:left;} /* a generic styling rule for all p tags to align inner text left */

Just change ‘p’ to whatever selector you need.

There you go, CSS text-align is the rule to go! Other than that, you can also align text right by text-align:right or center by text-align:center.

Want to know how to right align or center align things in CSS?

Hilariously Funny or Creepy

Google penalizes

Yeah, well, Google employee, who’s made famous by his SEO blog, Matt Cutts said in twitter a few days back: PageRank is now ~5 instead of ~9. I expect that to remain for a while.

Or maybe they (Google) are just tired of insanely unachievable PageRanks of themselves and did this for a bit of fun?