The importance of search engine optimization (SEO) is at an all time high, and the value of solid SEO is increasing daily.  A recent JupiterResearch and NPD Group “Blended Search Results Study” shows first page search-result-listings are vital for web traffic.

Almost 7 out of 10 individuals surveyed clicked on a first-page search result.  Only 8% of respondents were willing to click results beyond the third page.  This continues a recent trend of search engine users refusing to dig into deeper search-result pages.

Instead of progressing into deeper search results, most users (over 9/10) simply altered their search terms or switched search engines.

eMarketer forecasts these dramatic trends to influence SEO spending in the next few years.  Companies are not only realizing the importance of quality search engine rankings, but also the relative cost efficiency of SEO investment.  By 2011, they forecast SEO spending to total 23% of search-marketing spending. 

For more information on SEO, including how your company can benefit, please contact Soleer.

As we know, designers can never leave well enough alone.  The default css behavior is for bullets to be the same color as their associated list item <li>.  Although there are a number of solutions on the internet, this is the most simple, elegant, and universally compatible.

 Here is an example of what we’re looking to accomplish:

• Bullet-List Item 1
• Bullet-List Item 2
• Bullet-List Item 3
• Bullet-List Item 4
• Bullet-List Item 5

Note how the bullets are red and the list-item text is blue.  Now, let’s take a look at the code:

Standard code:

<ul id=”ex_list”>
      <li>Bullet-List Item 1</li>
      <li>Bullet-List Item 2</li>
      <li>Bullet-List Item 3</li>
      <li>Bullet-List Item 4</li>
      <li>Bullet-List Item 5</li>
</ul>

In order to style the bullets and text seperately, we must enclose the <li> text within <span> tags:

<ul id=”ex_list”>
      <li><span>Bullet-List Item 1</span></li>
      <li><span>Bullet-List Item 2</span></li>
      <li><span>Bullet-List Item 3</span></li>
      <li><span>Bullet-List Item 4</span></li>
      <li><span>Bullet-List Item 5</span></li>
</ul>

Now that we have the xhtml setup correctly, all we have to do is perform some minor CSS changes:

#ex_list li{
          color: blue;       /* The color you want the bullets to be */
}
#ex_list li span{
          color: red;      /* The color you want the bullets to be */
}