Travis Langley & Associates Website Design


Newest Feature for Perceptive OBP - InContext Editing

Travis Langley - Tuesday, April 20, 2010
Our newest feature - InContext Editing - is now available in the Administration area and ready for use. It's a next generation tool that gives business owners greater control over their websites. You can now make changes more easily without compromising the overall design of your website. Some of the main benefits include:
  • The ability to set editable regions within any web page to limit scope of change and preserve design quality
  • Content editing is more intuitive - you edit "InContext" on the page rather than having an editor pop-up as was the case with Sitewalk
  • The new InContext content editor is much more robust compared with the Sitewalk text editor
Please note that InContext Editing will be in Beta for the next 12 weeks during which Sitewalk will continue to remain available. When the Beta period ends, Sitewalk will reach end-of-life and will be removed from the Administration area. During the Beta period for InContext Editing we will continue to make small improvements.

Close to Home - Local Search, hCards and Microformats [ Part 2 ]

Travis Langley - Sunday, March 21, 2010

Earlier, I explained how to GeoTag your site to reach local clients and customers.  Another way to reach your local market is through the hCard Microformat.

At its simplest, the hCard is a 1:1 XHTML representation of the vCard, which has long been the standard in electronic business cards.  The hCard takes electronic business card contact information and formats it for any HTML, Atom, RSS, or XML file.  Your hCard can be formatted so that it is invisible to your site's visitors, but the contact information is collected by search engine spiders.

A simple hCard format, providing just your name and URL, would look something like this:

[ code ] <div class="vcard">
   <a class="url fn" href="http://www.travislangley.com/">
      Travis Langley
   </a>
</div>

Of course, by adding classes, you can add detail to your contact information, as in the following example:

[ code ] <div class="vcard">
   <span class="n">
      <span class="given-name">Travis</span>
      <span class="family-name">Langley</span>
   </span>
   <div class="org">Travis Langley & Associates</div>
   <a href="mailto:travis@travislangley.com">
      travis@travislangley.com
   </a>
   <div class="adr">
      <span class="locality">Edmond</span>
      <abbr class="region" title="Oklahoma">OK</abbr>
      <span class="country-name">United States</span>
   </div>
   <div>+1.405.923.5810</div>
</div>

For help creating an hCard for your site, you can use the hCard generator from Microformats.org.  You can learn how to hide your hCard in your website in the article "Everything About the hCard Microformat" at Qreative Zone.

The hCard is only one of the many microformats that add information to your site and make that data available for searching.  Microformats can also help you perform tasks quickly and easily:

  • Use XFN to link to friends and contacts.
  • hCalendar allows you to add events to your site.
  • With hReview, you can review books, movies, and products.
Microformats.org has tools and creators for all of the above microformats to help you with coding microformats for your site

The Work From Home Experiment

Travis Langley - Sunday, February 07, 2010
Here's a little plug for my sister, who is an aspiring work-at-home mom.  She'll be documenting her journey to go from employee to self-employed while trying to balance all the issues that go along with that.  You can follow the progress on her blog at nix9to5.com.  Should be quite an adventure... or at least an interesting read.

To WWW or Not WWW : Canonicalization, SEO and the .htaccess Fix

Travis Langley - Tuesday, February 02, 2010
It's been awhile since my last post, and that means business has been good.  I have a series of great new client projects to work, and that has kept me pretty busy.  However, I needed a break from the layout and coding, so I thought I would add a new entry to the blog - actually, this is a recycled post from my old site..  This one deals with the use, or lack of use, of www on your sites URL, how it can affect your search engine rankings, and what you can do to correct the issue.

First, what really is the issue with using www or not you might ask.  For one, it's an issue of what is the best URL to serve for a given web page, otherwise referred to as canonicalization.  Most of us would consider the following to be the same thing:

grademyshades.com
www.grademyshades.com
www.grademyshades.com/index.htm

Actually, the  list could be a lot longer, and in this case these all point to the same page... but they don't have to.  Each of these URLs could actually represent a different page, and that's how the search engines see it, as different pages.  Just check out the following image for reference:



Notice above how Google has listed both grademyshades.com and www.grademyshades.com as two separate listings.  So what's the big deal?  The deal is two-fold.  First, search engines don't like duplicate content and will very often hand out penalties because of it.  This is exactly how the search engines see this - as duplicate content - two different pages with identical information and this is something you should definitely avoid. Second, search engines place a lot of weight on links from other sites to your pages.  Let's say that some of those links include the www in the url, and some do not.  You are essentially splitting those links up between what the search engine sees as two different pages, and neither version of your page will rank as well as if all those links were pointed to the same page.

Good news, there is a simple fix that essentially makes the non-www version non existent.  Just add the following bit of code to your .htaccess file (place in the root directory of your website - and replace domain.com with your domain) :
RewriteCond %{HTTP_HOST} !^www\.domain\.com [NC]
RewriteRule ^(.*)$ http://www.domain.com/$1 [L,R=301]

What this does is redirect any requests for the non-www version of you site to use the www version.  It also issues a 301 permanent redirect code, so that the search engines will know to only index the www version.  And there you have it - 2 simple lines of code to prevent or help correct what could be a big problem for your search engine optimization efforts.

Want more information on the subject?  Here's a good link from an industry insider on the subject of canonical urls (primarily from a google point of view) that should help answer more questions.

Don't Like the New Facebook? Then Change it Back.

Travis Langley - Wednesday, October 28, 2009
I've seen a lot of complaints about the new look of Facebook.  There's even 3 large Facebook Groups against the new layout with almost 5 million members between them (could be some duplicate members - I didn't check).  If you visit any of these groups, almost everyone is demanding that Facebook change it back.  Well, the good news is that, for the most part, you can change it back yourself.  If you want to get away from the confusing News Feeds and get back to your beloved Status Updates, check out this very short video - this is pretty simple :



So to sum it up, go to your Facebook Home page, click "more" at the bottom of the left menu, drag "status updates" to the top of the list, and then click "status updates".  Now things are pretty much back to the way they were and you can enjoy Facebook like you did before.



UPDATED:

After some input, it turns out the solution above may not be the best.  If Status Updates is the default, you don't see links, images and video.  Therefore, it might be best to make Live Feeds your default.  The problem with the feeds is that they limit the number of friends they show posts for by default.  The good news is that you can change this as well.  Again, here's a video to show how this is done:



To recap,
  1. click more on the left menu
  2. drag "news feeds" to the top (if it's not already)
  3. click "live feed" above your content if "news feed" is currently the default
  4. scroll to the bottom of the page and click edit option
  5. replace the number of friends with 5000 (the maximum allowed)
  6. click save. 
This should be more like the Facebook most of you are used to.

FTC Endorsement Guide - Disclosure Requirements for Bloggers and Social Media

Travis Langley - Friday, October 09, 2009
The FTC just released its Guides Concerning the Use of Endorsements and Testimonials in Advertising, and if you blog or are involved in social media and ever make product review or testimonial, this is guide is must read for you.  The guidelines go into effect December 1, 2009 and outline disclosure requirements when you post about a product or service.

The Guide provides a large list of examples of scenarious in which you would or would not be required to disclose relationships with product or service provides.  Even in cases where you provide honest endorsement in which the product or service provider has no control over your content, you may still be required to disclose.   Failure to include proper disclosure can result in fines up to $11,000 per instance, so the rule here is, don't take chances.  Be sure to read the Guide and understand your responsibilities.  It's just 81 pages and could be well worth your time.

I believe disclosure when making endorsements is the ethical thing to do and support the intent of the Guide.  My personal feeling is that some of the requirements are subjective, so it's best to err on the side of caution.  Also, the Guide fails to tell how you should make your disclosure - it just tells when you should make a disclosure.  Another issue with the Guide is that it doesn't directly address your requirements for existing endorsements - are you required to check your entire history of reviews and testimonials to ensure the relationships have been properly disclosed?  For these reasons, a site-wide Disclosure Policy (similar to your site's privacy policy or terms of use) might be a good idea.  A good resource is DisclosurePolicy.org, which has a free policy generator, a great blog on the subject and additional information about blog disclosure -  (DISCLOSURE : I do not have any relationship with DisclosurePolicy.org, nor did I receive any compensation for making this endorsement). 

As of this posting, I don't have a disclosure policy, but it is definitely in my To Do list.

Also, if you've read the FTC Guide on Endorsements, I would love to hear your opinion.

Close to Home - Local Search, GeoTags, hCards and Microformats

Travis Langley - Thursday, October 08, 2009
The web is global and has really expanded the reach of many businesses, and search engines are a great tool to give them exposure in the world marketplace.  However, a lot of folks don't realize that these same engines are an excellent way to reach those customers and clients that are just around the corner.  It's also a lot easier to achieve visibility locally than to compete for good search engine placement against business worldwide.  Even if you provide your products and services worldwide, don't forget to reach out to those a little more close to home.  Here's some tips to help you succeed with local search.
  • Get Listed

    The big search engines all provide tools to allow you to submit your business details to be included in their local search indexes with plenty of detail.  In addition to your just your website and business name, you can include your address and phone (obviously) as well as business category, hours of operation, accepted forms of payment, an image of your business, if free or paid parking is available and other relevant information.  After providing your business details, you will generally be required to verify that you are the owner (or a representative of the business).  This may be done by mail, email or phone, and varies depending on the search engine.  You should start by submitting your site to the following local search services:

    www.google.com/local/add
    listings.local.yahoo.com/csubmit
    ssl.bing.com/listings/BusinessSearch.aspx
    biz.yelp.com/signup

    Also, google shows listings from other local search services (like yahoo, yelp and others as shown below), so if you want to try to increase your market share, it helps to list your business in a variety of sources.



  • GeoTag Your Site

    In your HTML, you can place some tags in the header to help the search engines know where your site is located.  This is done by setting up Geotags, and it's a pretty simple process.  GeoTags look something like this:

    [ code ] <meta name="geo.position" content="35.644707, -97.545419">
    <meta name="geo.placename" content="Travis Langley & Associates, Edmond, Oklahoma, United States">
    <meta name="geo.region" content="US-OK">

    If you need to convert and address to lattitude and longitude for the geo.position tag, try mygeoposition.com.
Up Next - hCards and Microformats.
Check back soon for part 2 of this article.  It's late -  I'm off to bed...

Website Traffic - The Meaningless Metric

Travis Langley - Tuesday, August 18, 2009
If you have a website, it's important that you have a good analytics (web stats) so that you can monitor the performance of your site.  This is especially true if you run a business or ecommerce website, but can apply to personal and informational sites as well.

The biggest problem most individuals have when collecting stats related to their site is that they focus on the wrong numbers.  For a long time and in the not so distant past, the defacto standard metric was the hit counter, which basically told how many times a page was viewed.   With today's powerful analytics, people are still often concerned with the number of page views or how many visitors, which really isn't a vast improvement over the hit counter of days past.  There are so many more vital metrics that could be monitored to give an accurate picture of your site's performance.

First, let me just qualify why I say the number of visitors or the amount of traffic your site receives is a meaningless metric.  I do understand that without traffic to your site, there's really not much point to having a site other than for your own personal satisfaction.  But just the sheer quantity of visitors doesn't indicate any real level of success if those visitors don't take some sort of action.  For example, I have a site that receives quite a bit of traffic for it's niche, in the order of a few unique visitors ever minute or so (well over 1500 visitors a day).  However, almost 40% of that traffic comes from Canada, and only a small portion of the products available on that site are available for shipping to Canada.  That's why I can't base success on just the amount of traffic alone.

Good analytics will track visitor actions that are important to your business.  Why is your site reaching out to those visitors?  This is the kind of information you should be monitoring and you should have some clear goals so that you can determine if your site is performing like you need it too.  Some examples of the metrics you might consider monitoring include:
  • Number of New Customer Leads
    If your site has a contact form or phone number, how many people are contacting you through the website?  Do you have a target for the number of leads you need to generate through your site for it to be worthwhile for you to maintain?   Your goal could be to generate 5 new customer leads a weak through your website.
  • Dollar Amount of Sales
    Got a product to sell?  You should be tracking the dollar amount your site is generating.  Are you generating a profit, or does your website maintenance and online marketing costs exceed your website revenue?  You might have a goal to generate $2500 in sales weekly, or to maintain a ROI (return on investment) of 120%.
  • Growth of Your Marketing Database
    Do you offer a newsletter or maintain a distribution list?  Perhaps you should monitor and set goals related to the size of your list.  Your strategy might include setting a goal of 10,000 subscribers to your list by the end of the year.
The metrics you track should be directly related to your business goals, and these are almost always related to leads, revenue and cost.  Your web developer and marketing professional should be able to help you work out a plan and systems to achieve those goals and accurately monitor your websites performance.

If you are not already maintaining business oriented metrics, let me offer a couple of good resources:

One resource to consider is Perceptive, our Online Business Platform.  In addition to content management (CMS) and customer relation management (CRM), Perceptive offers built in analytics that give quick insight related to sales and lead generation and historical performance.  If you are running, or plan to run, and online business, you should investigate the Perceptive Online Business Platform to understand the power in can bring to your online venture.

Another great solution and one of the best values on the web today, for sites not hosted on Perceptive, would be Google Analytics.  Google Analytics offers a powerful set of enterprise-class website statistics that rivals some of the best systems currently available, and for a price that's hard to beat (it's Free). 

Online Invoicing Done Right

Travis Langley - Wednesday, August 12, 2009
From time to time I'm going to review products and services I use in running my own business.  This is the first of those posts.  One of the simplest, most affordable and invaluable tools I am currently using is an online invoicing service by FreshBooks.

FreshBooks let's you easily manage your clients, track time, and send invoices by email or post.  It will automatically send reminders to your clients when they get behind in payments.  You can also set up automatic billing for recurring payments.  You can create accounts for different staff members and set unique hourly rates per staff member or project.  One of the features I really like is that other FreshBook users can invoice me and those invoices that I receive also show up in my account.  And it makes all this very simple.  It has a very intuitive interface, with well placed help dialogs.  It really couldn't be easier.

FreshBook allows you to brand the interface, invoices and emails that your clients see with your colors and logos.  The system helps you maintain a professional appearance, helps you invoice more quickly, and helps you get paid faster.

There's quite a few more features that I haven't touched on, like estimates, tracking expenses, data security and multiple payment gateways.  You'll have to visit FreshBooks and take the tour to really understand what all this can do to help you streamline your invoicing.

Best of all, it's free to try out.  This is not some scaled down trial, but the full blown service (you're only limited by the number of active clients and staff your allowed in  your account - they don't even limit the number of days you can try out the service).

If you are still sending paper invoices or not completely happy with your current invoicing system, I would highly recommend you give FreshBooks a try.

As a FreshBooks customer, I will receive a subscription discount if you sign up for the service using the link above.  This endorsement is made not for the purpose of receiving that discount, but because I truly believe this is a great service.


How To : CSS Bottom Centered Div

Travis Langley - Sunday, August 09, 2009
Over the next few weeks, I'm going to be moving over some of the posts from the blog on my old site.  This is the first of those.  Anyway, here is something I had to work through recently and didn't want to have to hunt down again in the future. I also felt it might be useful to other folks as well - surely I'm not the only one that has tried to do this. After spending too much time trying to find a good way to position a footer centered at the bottom of a browser window, I finally decided I would have to develop my own solution. What I wanted was something that would essentially dock itself to the bottom of the browser but not cover any of the content on the rest of the page. If the page had a lot of content, this wasn't a hard thing to do. But if the page was short, I didn't want the footer to appear just below the bottom of the content, leaving a gap between the bottom of the footer and the bottom of the browser window. The solutions I was finding either left the gap, or some would cause the footer to cover any content that required the page to scroll (it fixed the footer to the bottom of the browser and not to the bottom of the content). I came up with this fairly simple solution that appears to work in IE, Firefox and Chrome.

<html lang="en">
  <head>
    <style>
      body, html {
        height:100%;
      }
      body {
        margin:0px;
        padding: 0px;
        font-family:"Lucida Sans", Verdana, Tahoma, Helvetica, sans-serif;
      }
      #wrapper {
        text-align:center;
        width:100%;
        margin:0px;
        padding:0px;
        min-height:100%;
      }
      #content {
        height:100px;
        width:500px;
        background-color:#CCCCCC;
        color:#333333;
        margin:0px auto;
        text-align:center;
      }
      #footer_container {
        position:relative;
        height:100px;
        width:100%;
        margin:-100px auto 0 auto;
        text-align:center;
      }
      #footer_content {
        height:100px;
        width:500px;
        margin:auto;
        background-color:#333333;
        color:#CCCCCC;
      }
    </style>
  </head>
  <body>
    <div id='wrapper' style='{IE only rules follow:} height:100%;'>
      <div id='content'>
        <br> Content Area
      </div>
      <div id='pad' style="height:100px">
        <!--// //-->
      </div>
    </div>
    <div id='footer_container'>
      <div id='footer_content'>
        <br> Footer
      </div>
    </div>
  </body>
</html>
In the CSS above, the font and color definitions are optional (just to make things clear in the demo below), but almost everything else is required to make this work. Here are some explanations:
  • The footer_container is placed below the wrapper and the top margin is set to minus the height of the footer
  • The pad div is required to prevent the footer from covering content in the wrapper. This should be an empty div
  • The height of the footer, the height of the pad, and the negative margin of the footer_container must all be the same value.
  • Don't forget to include the conditional style in the wrapper div - IE doesn't recognize min-height and height must be explicity set.
Check out the Bottom Centered Div Demo to see this in action.