cabecera-conocimiento
 

Vender por Internet... De verdad

PDF  Imprimir  Enviar

4 sesiones de formación en Marketing e Internet, como parte del Programa EMPRESA de Mejora Competitiva del Instituto Aragonés de Fomento.

Fechas: Zaragoza, 12, 19, 26 de enero y 2 de febrero de 2012.

Descripción del curso

Cuando en muchos sectores se evidencia que Internet es de los pocos mecanismos efectivos para dar visibilidad a la empresa y captar negocio, se hace indispensable conocer y dominar las técnicas que permiten hacerlo con rentabilidad

En este taller mostraremos de forma muy práctica como orientar la estrategia web de una empresa a la captación de contactos, la manera de gestionar con eficacia y rentabilidad el posicionamiento en buscadores, las campañas de publicidad contextual en buscadores y el email marketing, así como a medir con precisión el ROI de cada una de estas acciones.

Objetivos

  • Conocer las nuevas tendencias en el uso de internet.
  • Saber qué esperar de Internet para mis negocios.
  • Saber cómo enfocar la web corporativa para captar negocio.
  • Conocer técnicas de visibilidad como el posicionamiento en buscadores y la publicidad contextual.
  • Aprender a gestionar las campañas de email marketing.
  • Uso de las redes sociales para la generación de comunidad alrededor de mi marca.
  • Dominar Google Analytics como herramienta de analítica web.

 

 

Marketing online

Best Web Metrics / KPIs for a Small, Medium or Large Sized Business

sunshine We have access to more data than God wants anyone to have. Thus it is not surprising that we feel overwhelmed, and rather than being data driven we just get paralyzed. Life does not have to be that scary. In fact a data driven life is sexiest digital life you can imagine.

In this blog post we are going to bring the sexyback. I am going to attempt to significantly simply your life by recommending the critical few metrics you should use to analyze performance of your digital marketing campaigns and website. You'll be able to quickly go from "omg what can I do!" to "omg what am I going to do with all the money and fame I'm earning!"

The approach I'm going to use is to 1. Use my Acquisition, Behavior and Outcomes framework to ensure an end-to-end view of important activity and 2. Recommend metrics / KPIs you can use based on the size of your company.

Each recommendation comes with hints on what analysis to perform once you have the data, and what changes you could make to your campaigns, content and overall digital strategy. [A summary in pictorial format is at the end of this post.]

Excited? Let's do this!

Best Metrics / KPIs for Small Business Websites

Small business websites are a very fragile ecosystem. People working hard to do the best they can on the smallest possible budgets. But not to worry. They have to start with just four simple metrics to start rocking!

Acquisition:

Clicks? Visits? Backlinks? Impressions? No. We have something magnificent.

Cost Per Acquisition.

Obsess about this metric. You have very little money. You need to know, obsessively, what you get for it. This metric delivers that insight. Oh, and everything has a CPA (not just your paid search or display/banner ads). If you are doing SEO then you are likely paying for someone. That's the cost.

cost per acquisition 3

Kill things that don't have an optimum CPA. Invest more in ones that do. Simple enough, right?

Tip: Remember this is just cost, not profit. If your product costs you $15 to make then, in the above scenario, you are shipping a crisp $5 bill along with every Social Media order!

Where is it? Most likely in Excel. For Search it is in your Google Analytics or Omniture Site Catalyst reports. But for most other programs (Affiliate, Email, Social, Display) your Cost is likely sitting outside your web analytics tool. So extract the # of conversions, import into Excel, add a column for Cost, do the math, sing or weep (based on what the data says!:)).

If you are paying someone to do web analytics and this metric is not on top of the dashboard they've created for you, it might be time to say sayonara to them.

Behavior:

Page Views? Time on Site? No. You can do so much better!

Bounce Rate.

I continue to be a believer in trying to prompt love at first sight. Okay, okay, I'll settle for delivering relevance. :) Bounce Rate helps you identify campaigns where you might be targeting wrong people (who then come to your site and leave right away) or sending relevant traffic to irrelevant (and often flash-filled hideous) landing pages.

Bounce rate helps you find campaigns and landing pages that need to be killed / improved. Everyday.

Where is it? Standard metric in every web analytics tool worth anything. Look at your All Traffic Sources report and your Landing Pages report.

Checkout Abandonment Rate.

I find the fastest way to make money is to take it from the people who have already decided to give it to you. Obsess about checkout abandonment rate (the percentage of people who click Start Checkout to those who complete that process).

paditrack funnel setup

Focus on checkout steps with the highest abandonment. Tweak like crazy. A/B & Multivariate tests are a good option. But you are a small business… so just take away as many fields as you can, play with where to show shipping cost (I vote for way up front), reduce the number of checkout steps if you can, ask for account creation at the end of the process rather than at the start. Try, test, measure, be rich.

Where is it? In Excel. Or if you use Google Analytics: In Paditrack for free. (Google Analytics' native funnels are pretty sub optimal, ignore that entire feature.) For other tools: In KissMetrics. Create a funnel just for the checkout process (from clicking Start Checkout to Thanks for your Order) and both these tools will give you the metric automatically. They also allow you to segment the data! Make love to it.

[Bonus: What is abandonment rate?]

Outcomes:

My favorite Economic Value? No. As a small business I recommend…

Macro Conversion Rate.

You are a small business. Obsess about conversion rates, and everything connected to improving them. What products are people buying? Every single day (okay week) look at the All Traffic Sources report and seek out the Conversion Rate metric. Ruthlessly punish sources that are not working well and reward the pretty babies. Be they Earned, Owned and Paid media – oh and have a marketing strategy that has each of those elements or as a small business owner you are not going to win a lot.

macro ecommerce conversion rate

I love creating an advanced segment with just the people who buy twice the average order size. I call them the Whales. Look at sources, locations, product bundles purchased, keywords and campaigns and all that to learn where/how you can find more Whales.

Where is it? Standard metric in all analytics tools. Remember to look at both the rate and the raw number of conversions for context. People make silly decisions when they don't do that.

That's it!

You are a small sized business and these four simple key performance indicators will literally rock your world as soon as you start measuring them. Cost Per Acquisition. Bounce Rate. Checkout Abandonment Rate. Macro Conversion Rate. Don't look at any other metric until you feel you've mastered them.

Tip: If you've hired the right analytics talent/consultant to help you, they'll be measuring these fabulous four.

Best Metrics / KPIs for Medium Sized Business Websites

What if you are a medium sized business? What key performance indicators are optimal for you?

First, you are going to measure the KPIs mentioned above. But because you are running a bigger and more complex business you'll also measure…

Acquisition:

CPA

+ Click-through Rate

While CPA is a macro metric about your campaigns' bottom-line performance, Click-thru Rate (CTR) is a deeper dive into analyzing the creativity and relevance of your affiliate deals / search listing / blinky banner ads.

In the context of Search (Paid or Organic), the text in your ads, the number at which your listing is ranked, the match between the user query and your ad's intent all help you receive a higher CTR. And if someone comes to your site (and does not bounce!) then you get an opportunity to convince them of your product or service's glory.

click through rate custom report

Small tweaks to the subject line of your email campaigns can have dramatic improvement in CTR. Recency and Frequency capping of your display remarketing campaigns can have a huge impact. Changing demographic targeting options in your Facebook ads can work wonders. Etc., etc., etc.

Put another way… CTR helps you understand if you showed up at the right place for your first date. Are you dressed okay. And if you are smiling the right smile. Helpful to know, right?

Where is it?

Everywhere. Start at a campaign level. Drill down to individual creatives. Kill badness. Promote goodness. Rinse. Repeat.

Behavior:

Bounce Rate

Checkout Abandonment Rate

+ Page Depth

A very tiny percentage of visitors to your site will see more than a couple pages. That's the internet for you. As you improve the user experience, information architecture and relevancy of content on your site, it is important to keep an eye not on the rather useless metric of Average Page Views per Visit or Average Time on Site but rather on the distribution of page depth. Here's how that picture might look like (from a post I wrote in July 2006!)…

page depth analysis

From the deep detail reported by your web analytics tool you can choose to aggregate into buckets you most care about (like mine above). Categorizing the visits into Abandoners, Flirts, Browsers, One-off-Wonders, Loyalists will dramatically change your view of content consumption. Over time, as you move to deeper consumption, you'll see direct business rewards.

The above image emphasizes a sale/conversion at the end, but even if you are a content-only website improving Page depth helps you because more pages equal (at the very minimum) more ad impressions!

Where is it? The final table will be in Excel. If you use Google Analytics the data you need is here: Audience > Behavior > Engagement > Page Depth tab. If you use WebTrends, Yahoo! Analytics, Coremetrics please click around to find the data. They all have it.

+ Loyalty (Count of Visits)

If Page Depth helps you optimize for a single session experience, Loyalty helps you optimize pan session behavior. Put another way… how good are you at getting the same person to visit your website multiple times? For ecommerce or non-ecommerce websites, loyalty can mean the difference between life of survival and raking in profits like crazy.

First set a goal for the % of site Visits you would like for people who've visited more than x times. [Set a goal for x too. :)] For ecommerce websites use your Days to Conversion report (more on this metric below) to set your goal. For content sites perhaps mirror your content update schedule. If you are the New York Times and you update the website 24 times a day then should the average person be visiting the site at least 90 times per month?

Your BFF, as always, is analysis and not just reporting the metric. Create this simple segment in five seconds…

segmenting by visitor loyalty

Apply to your keywords and campaigns and referring sources reports and identify which sources drive loyal traffic. Apply it to your content reports and figure out which content drives Loyalty (Sports? Op Ed? International? Cat Stories?).

Where is it? In every web analytics tool on the planet. If you use Google Analytics the data you need is here: Audience > Behavior > Frequency & Recency.

Outcomes:

Macro Conversion Rate.

+ Micro Conversion Rate

Pick your favorite benchmark and you'll notice that less than 2% of visitors convert. Focusing on just the Macro Conversion Rate means you don't care if you received any business value from the 98% that did not convert. I refuse to accept that uber-lameness.

Identify your Micro Conversions (/Goals) and obsess about the long and short term business value they deliver. You'll quickly realize the Economic Value they create for you is often far greater than the Revenue your Macro Conversion reports! And optimizing for that will ensure you win HUGE.

micro conversion rates

Where is it? In Google Analytics it is here: Conversions > Goals. Even if you are a content site the data is there. Details in the Goal URLs report. Setting up goals takes two minutes, setting goal values might take you a week (see measurement strategies here). If you use other tools, please check with your vendor.

+ Per Visit Goal Value

This Key Performance Indicator 1. helps you move beyond the obsession of focusing on the 2% (because it forces you to focus on Every Visit!) and 2. encourages you to create a business that uses the web to deliver multiple outcomes to your visitors.

per visit goal value

Every visitor will not convert, but every visitor will, hopefully, deliver some Economic Value. Looking at this metric helps you identify Goals that contribute higher value, and and understanding of simple things like where you should focus on. If Twitter delivers 87 cents of Per Visit Goal Value and Google delivers 97 cents then perhaps I want to keep focusing on my SEO strategies rather than following the advice of the Social Media Guru who's just informed me Search is dead.

Where is it? In pretty much every single report in every single web analytics tool. Click on the Goals tab.

That's it!

For a medium sized business we ended up with nine metrics. Seems about right if you are making more than five million dollars of economic value. They key difference from websites that are in the small business category is that we are going to shoot for multiple conversions, deeper site engagement and better analysis of acquisition efficiency.

Time now to deal with the big boys and girls… large websites!

Best Metrics / KPIs for Large Sized Business Websites

Acquisition:

CPA

Click-through Rate

+ % New Visits

My choice of this metric perhaps betrays my refusal to rest on my laurels. There are clearly a finite number of people in the world relevant for any business. But staying hungry and staying foolish is a popular mantra for me. I use this metric to constantly calibrate my acquisition strategy to understand which inbound marketing efforts are bringing new "impression virgins" to the business.

If you look at your Earned, Owned and Paid media then this metric is especially important for your Paid media efforts. Except for your re-targeting / behavior targeting campaigns, you want your paid search, display, affiliate, and social efforts to bring new visitors to your franchise.

Where is it? It's like air, everywhere! Don't forget to segment for optimal analysis.

Behavior:

Bounce Rate

Checkout Abandonment Rate

Page Depth

Loyalty (Count of Visits)

+ Events / Visit

Every awesome large website delivers complex experiences (videos, demos, dynamic slideshows, configurators + + +) via sophisticated technologies (Flash, AJAX, Gadgets + + +). Almost all of the time we leave measuring their effectiveness on faith (or the HiPPO). I love event tracking because it helps us measure these often astonishingly, expensive initiatives.

events per visit metric

Of 110,842 visits to the site, 9,054 interacted with your delightful experiences and each of those visits had 2.24 Events per Visit. Is that good? Bad? Could be better? Are these 2.24 interactions delivering higher economic value to your business?

In the above case the answer was a big NO. In your your case you'll decide based on your strategy and goals. At the end of the analysis you'll make significantly smarter decisions about your content (especially because the Analysis Ninja that you are, you'll triangulate performance of this metric with first, Page Depth and, second, Loyalty).

Where is it? Most web analytics tools do some type of event tracking. Please check with your vendor (it might not be called event tracking in their lingo, just describe my first paragraph above). In Google Analytics the data is here: Content > Events.

Outcomes:

Macro Conversion Rate.

Micro Conversion Rate

Per Visit Goal Value

+ Days to Conversion [or Time Lag for Content sites]

Another pan session metric I adore.

Life, no matter how hot you are, is not a series of one night stands. Yet because of how they analyze the data most companies end up optimizing their web marketing campaigns for one night stands. Come here and convert NOW! If yes: Oh, I love you. If no: Kill the campaign!

That approach is not just short-sighted; it is an insult to your visitors. Convert them at a pace they are most comfortable with. This metric helps you understand how quickly or slowly your visitors convert. You can, at the very minimum, change your campaign messaging and come hither calls to action and adjust your landing pages. If the Days to Conversion are much longer, then create a robust (slow dance) micro conversion strategy.

days to conversion time lag 1

If you have a non-ecommerce website then there is something delightful for you in the Google Analytics Multi-Channel Funnel reports. Checkout the Time Lag report . It is showing you exactly the same data as the Days to Transaction for Ecommerce sites. The metric you see immediately above is called Conversions. It is essentially your Goals (/micro conversions).

Optimize your "hello, nice to meet you, what would you like, here is what I have to offer, why don't you check with your spouse, come back and check it out again, multiple times, I'm still here, you ready to convert / deliver economic value, here's how… " process.

Where is it? Days to Conversion is in the Ecommerce section of your web analytics reports. It is a standard report. (Don't forget to segment your sources. Deep insights await.) Time Lag may or may not be a standard report in your tool. Please check with your vendor. In Google Analytics it is a standard report here: Conversions > Multi-Channel Funnels > Time Lag.

+ % Assisted Conversions

This is the newest metric I've made standard for all my clients / partners / BFFs. And it is a sweetie.

Assisted Conversions builds on the above mental model. It takes a while for a majority of your visitors to convert (macro and micro conversions), so why does almost all of web analytics focus on single channel analysis and optimizing that single channel in a silo? Just because the Affiliate click was the last one before conversion should it be optimized for that conversion? Especially if the Visitor originally came via Facebook (or Google or whatever)?

How many of your conversions had more than one ad / media / marketing touch prior to converting? Really smart Analysts at really successful companies understand that…

assist interaction analysis

…and then use that data to optimize the portfolio of channels rather than individual channels for the company.

Even if you don't do portfolio optimization (and desperately hope you do) you can easily see how the above data will cause you to execute a different marketing optimization and expectation strategy for Email (1.18 Assist / Last Interaction rate) vs. Organic Search (0.61).

I am being modest when I say that this metric and subsequent analysis will have a fantastic impact on your company.

Where is it? % Assist Conversions may or may not be in your web analytics tool. Please check with your vendor. In Google Analytics you'll find it here: Conversions > Multi-Channel Funnels > Assisted Conversions.

And we are done!

For large businesses we've identified 13 key metrics that would give a robust end-to-end view of business performance. The key difference vs. medium sized businesses is that we are really, really, really focused on pan-session (multiple visits) behavior. Put another way, we really care about people here and not just a single visit.

Here is a summary of the metrics I am recommending in this post…

best metrics small medium large business

I hope the picture above will quickly help diagnose where current gaps in your measurement strategy might be.

Additionally if you are a small business you'll know what else to measure when you start to become medium sized and if/when you cross that threshold you'll know the metrics that come with your large business status. :)

You'll notice that I'm not focusing on KPIs like AdSense Ads CTR or Page Load Time or Actions per Social Visit or Search Exits (I love this metric!) or Content Distribution vs. Content Consumption Rate or Conversation Rate (in case of a content site) etc. That's simply because these KPIs tend to be unique to the type of business you are running. My strategy above was to focus on just the KPIs that would be applicable across all types of businesses.

That brings me to a very important point.

While it is my hope that you'll find my recommendations above relevant and yummy… the most optimal way to identify that best key performance indicators for your company will come using the process and structure outlined in the Digital Marketing & Measurement Model.

I'll end with the thought I started this post with… we have more data than God wants anyone to have. But web analytics does not have to be scary or impenetrable. Use the roadmap above, focus on all three elements (acquisition, behavior, outcomes) and I promise you'll soon be on your way to being as happy as God wants everyone to be.

I wish you all the best!

Okay as always it's your turn now.

Does your business use the above recommended metrics / key performance indicators? Do you have an absolute favorite metric that's not mentioned above? Which metric above do you find most useful? Which one most useless? What is your strategy for identifying the most relevant metrics?

Please share your suggestions, critique, and helpful best practices via comments.

Thank you.

PS:
Couple other posts on metrics / KPIs you might find interesting:

Best Web Metrics / KPIs for a Small, Medium or Large Sized Business is a post from: Occam's Razor by Avinash Kaushik

Más sobre marketing online

Comercio electrónico

Facebook Prueba Nuevas Opciones para la Creación de Facebook Ads

{lang: 'es'} Los anuncios publicitarios en Facebook llamados Facebook Ads, últimamente están sufriendo numerosas mejoras para que los anunciantes puedan sacarle más partido, y una de las últimas que por el momento está en fase de pruebas es la creación de anuncios en base a los objetivos de marketing. Según Facebook, han detectado la necesidad de las marcas de utilizar los Facebook Ads para objetivos concretos como conseguir más descargas de una aplicación o generar nuevos “Me Gusta”, y por ello están testando un nuevo diseño con nuevas características en la plataforma de Facebook Ads que incluyen una interfaz más simple de usar, la optimización automática de anuncios en base a los objetivos marcados por el anunciante y más opciones … Sigue leyendo

Más sobre comercio electrónico

Tendencias en Internet

Introduction To URL Rewriting

B&Q went to all the trouble and expense of acquiring diy.com and implementing a stock controlled e-commerce website, but left its URLs indecipherable. If you guessed “brown guttering,” you might want to considering playing the lottery.

Even when you search directly for this “miniflow gutter brown” on Google UK, B&Q’s page comes up only seventh in the organic search results, below much smaller companies, such as a building supplier with a single outlet in Stirlingshire. B&Q has 300+ branches and so is probably much bigger in budget, size and exposure, so why is it not doing as well for this search term? Perhaps because the other search results have URLs like http://www.prof…co.uk/products/brown-miniflo-gutter-148/; that is, the URL itself contains the words in the search term.

screenshot

Almost all of these results on Google have the search term in their URLs (highlighted in green). The one at the bottom does not.

Looking at the URL from B&Q, you would (probably correctly) assume that a file named nav.jsp within the directory /diy/jsp/bq/ is used to display products when given their ID number, 11577676 in this case. That is the resource intimately tied to this URL.

So, how would B&Q go about turning this into something more recognizable, like http://www.diy.com/products/miniflow-gutter-brown/11577676, without restructuring its whole website? The answer is URL rewriting.

Another way to look at URL rewriting is like a thin layer that sits on top of a website, translating human- and search-engine-friendly URLs into actual URLs. Doing it is easy because it requires hardly any changes to the website’s underlying structure — no moving files around or renaming things.

URL rewriting basically tells the Web server that
/products/miniflow-gutter-brown/11577676 should show the Web page at: /diy/jsp/bq/nav.jsp?action=detail&fh_secondid=11577676,
without the customer or search engine knowing about it.

Many factors (or “signals”), of course, determine the search ranking for a particular term, over 200 of them according to Google. But friendly and readable URLs are consistently ranked as one of the most important of those factors. They also help humans to quickly figure out what a page is about.

The next section describes how this is done.

How To Rewrite URLs

Whether you can implement URL rewriting on a website depends on the Web server. Apache usually comes with the URL rewriting module, mod_rewrite, already installed. The set-up is very common and is the basis for all of the examples in this article. ISAPI Rewrite is a similar module for Windows IIS but requires payment (about $100 US) and installation.

The Simplest Case

The simplest case of URL rewriting is to rename a single static Web page, and this is far easier than the B&Q example above. To use Apache’s URL rewriting function, you will need to create or edit the .htaccess file in your website’s document root (or, less commonly, in a subdirectory).

For instance, if you have a Web page about horses named Xu8JuefAtua.htm, you could add these lines to .htaccess:

RewriteEngine On
RewriteRule   horses.htm   Xu8JuefAtua.htm

Now, if you visit http://www.mywebsite.com/horses.htm, you’ll actually be shown the Web page Xu8JuefAtua.htm. Furthermore, your browser will remain at horses.htm, so visitors and search engines will never know that you originally gave the page such a cryptic name.

Introducing Regular Expressions

In URL rewriting, you need only match the path of the URL, not including the domain name or the first slash. The rule above essentially tells Apache that if the path contains horses.htm, then show the Web page Xu8JuefAtua.htm. This is slightly problematic, because you could also visit http://www.mywebsite.com/reallyfasthorses.html, and it would still work. So, what we really need is this:

RewriteEngine On
RewriteRule   ^horses.htm$   Xu8JuefAtua.htm

The ^horses.htm$ is not just a search string, but a regular expression, in which special characters — such as ^ . + * ? ^ ( ) [ ] { } and $ — have extra significance. The ^ matches the beginning of the URL’s path, and the $ matches the end. This says that the path must begin and end with horses.htm. So, only horses.htm will work, and not reallyfasthorses.htm or horses.html. This is important for search engines like Google, which can penalize what it views as duplicate content — identical pages that can be reached via multiple URLs.

Without File Endings

You can make this even better by ditching the file ending altogether, so that you can visit either http://www.mywebsite.com/horses or http://www.mywebsite.com/horses/:

RewriteEngine On
RewriteRule   ^horses/?$   Xu8JuefAtua.html  [NC]

The ? indicates that the preceding character is optional. So, in this case, the URL would work with or without the slash at the end. These would not be considered duplicate URLs by a search engine, but would help prevent confusion if people (or link checkers) accidentally added a slash. The stuff in brackets at the end of the rule gives Apache some further pointers. [NC] is a flag that means that the rule is case insensitive, so http://www.mywebsite.com/HoRsEs would also work.

Wikipedia Example

We can now look at a real-world example. Wikipedia appears to use URL rewriting, passing the title of the page to a PHP file. For instance…

http://en.wikipedia.org/wiki/Barack_obama

… is rewritten to:

http://en.wikipedia.org/w/index.php?title=Barack_obama

This could well be implemented with an .htaccess file, like so:

RewriteEngine On
#Look for the word "wiki" followed by a slash, and then the article title
RewriteRule   ^wiki/(.+)$   w/index.php?title=$1   [L]

The previous rule had /?, which meant zero or one slashes. If it had said /+, it would have meant one or more slashes, so even http://www.mywebsite.com/horses//// would have worked. In this rule, the dot (.) matches any character, so .+ matches one or more of any character — that is, essentially anything. And the parentheses — ( ) — ask Apache to remember what the .+ is. The rule above, then, tells Apache to look for wiki/ followed by one or more of any character and to remember what it is. This is remembered and then rewritten as $1. So, when the rewriting is finished, wiki/Barack_obama becomes w/index.php?title=Barack_obama

Thus, the page w/index.php is called, passing Barack_obama as a parameter. The w/index.php is probably a PHP page that runs a database lookup — like SELECT * FROM articles WHERE title='Barack obama' — and then outputs the HTML.

screenshot

You can also view Wikipedia entries directly, without the URL rewriting.

Comments and Flags

The example above also introduced comments. Anything after a # is ignored by Apache, so it’s a good idea to explain your rewriting rules so that future generations can understand them. The [L] flag means that if this rule matches, Apache can stop now. Otherwise, Apache would continue applying subsequent rules, which is a powerful feature but unnecessary for all but the most complex rule sets.

Implementing the B&Q Example

The recommendation for B&Q above could be implemented with an .htaccess file, like so:

RewriteEngine On
#Look for the word "products" followed by slash, product title, slash, id number
RewriteRule  ^products/.*/([0-9]+)$   diy/jsp/bq/nav.jsp?action=detail&fh_secondid=$1 [NC,L]

Here, the .* matches zero or more of any character, so nothing or anything. And the [0-9] matches a single numerical digit, so [0-9]+ matches one or more numbers.

The next section covers a couple of more complex conditional examples. You can also read the Apache rewriting guide for much more information on all that URL rewriting has to offer.

Conditional Rewriting

URL rewriting can also include conditions and make use of environment variables. These two features make for an easy way to redirect requests from one domain alias to another. This is especially useful if a website changes its domain, from mywebsite.co.uk to mywebsite.com for example.

Domain Forwarding

Most domain registrars allow for domain forwarding, which redirects all requests from one domain to another domain, but which might send requests for www.mywebsite.co.uk/horses to the home page at www.mywebsite.com and not to www.mywebsite.com/horses. You can achieve this with URL rewriting instead:

RewriteEngine On
RewriteCond   %{HTTP_HOST}   !^www.mywebsite.com$         [NC]
RewriteRule   (.*)           http://www.mywebsite.com/$1  [L,R=301]

The second line in this example is a RewriteCond, rather than a RewriteRule. It is used to compare an Apache environment variable on the left (such as the host name in this case) with a regular expression on the right. Only if this condition is true will the rule on the next line be considered.

In this case, %{HTTP_HOST} represents www.mywebsite.co.uk, the host (i.e. domain) that the browser is trying to visit. The ! means “not.” This tells Apache, if the host does not begin and end with www.mywebsite.com, then remember and rewrite zero or more of any character to www.mywebsite.com/$1. This converts www.mywebsite.co.uk/anything-at-all to www.mywebsite.com/anything-at-all. And it will work for all other aliases as well, like www.mywebsite.biz/anything-at-all and mywebsite.com/anything-at-all.

The flag [R=301] is very important. It tells Apache to do a 301 (i.e. permanent) redirect. Apache will send the new URL back to the browser or search engine, and the browser or search engine will have to request it again. Unlike all of the examples above, the new URL will now appear in the browser’s location bar. And search engines will take note of the new URL and update their databases. [R] by itself is the same as [R=302] and signifies a temporary redirect.

File Existence and WordPress

Smashing Magazine runs on the popular blogging software WordPress. WordPress enables the author to choose their own URL, called a “slug.” Then, it automatically prepends the date, such as http://coding.smashingmagazine.com/2011/09/05/getting-started-with-the-paypal-api/. In your pre-URL rewriting days, you might have assumed that Smashing Magazine’s Web server was actually serving up a file located at …/2011/09/05/getting-started-with-the-paypal-api/index.html. In fact, WordPress uses URL rewriting extensively.

screenshot

WordPress enables the author to choose their own URL for an article.

WordPress’ .htaccess file looks like this:

RewriteEngine On
RewriteBase /  
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]

The -f means “this is a file” and -d means “this is a directory.” This tells Apache, if the requested file name is not a file, and the requested file name is not a directory, then rewrite everything (i.e. any path containing any character) to the page index.php. If you are requesting an existing image or the log-in page wp-login.php, then the rule is not triggered. But if you request anything else, like /2011/09/05/getting-started-with-the-paypal-api/, then the file index.php jumps into action.

Internally, index.php (probably) looks at the environment variable $_SERVER['REQUEST_URI'] and extracts the information that it needs to find out what it is looking for. This gives it even more flexibility than Apache’s rewrite rules and enables WordPress to mimic some very sophisticated URL rewriting rules. In fact, when administering a WordPress blog, you can go to Settings → Permalink on the left side, and choose the type of URL rewriting that you would like to mimic.

screenshot

WordPress’ permalink settings, letting you choose the type of URL rewriting that you would like to mimic.

Rewriting Query Strings

If you are hired to recreate an existing website from scratch, you might use URL rewriting to redirect the 20 most popular URLs on the old website to the locations on the new website. This could involve redirecting things like prod.php?id=20 to products/great-product/2342, which itself gets redirected to the actual product page.

Apache’s RewriteRule applies only to the path in the URL, not to parameters like id=20. To do this type of rewriting, you will need to refer to the Apache environment variable %{QUERY_STRING}. This can be accomplished like so:

RewriteEngine On
RewriteCond   %{QUERY_STRING}           ^id=20$                   
RewriteRule   ^prod.php$             ^products/great-product/2342$      [L,R=301]
RewriteRule   ^products/(.*)/([0-9]+)$  ^productview.php?id=$1             [L]

In this example, the first RewriteRule triggers a permanent redirect from the old website’s URL to the new website’s URL. The second rule rewrites the new URL to the actual PHP page that displays the product.

Examples Of URL Rewriting On Shopping Websites

For complex content-managed websites, there is still the issue of how to map friendly URLs to underlying resources. The simple examples above did that mapping by hand, manually associating a URL like horses.htm with the file or resource Xu8JuefAtua.htm. Wikipedia looks up the resource based on the title, and WordPress applies some complex internal rule sets. But what if your data is more complex, with thousands of products in hundreds of categories? This section shows the approach that Amazon and many other shopping websites take.

If you’ve ever come across a URL like this on Amazon, http://www.amazon.co.uk/High-Voltage-AC-DC/dp/B00008AJL3, you might have assumed that Amazon’s website has a subdirectory named /High-Voltage-AC-DC/dp/ that contains a file named B00008AJL3.

This is very unlikely. You could try changing the name of the top-level “directory” and you would still arrive on the same page, http://www.amazon.co.uk/Test-Voltage-AC-DC/dp/B00008AJL3.

The bit at the end is what really matters. Looking down the page, you’ll see that B00008AJL3 is this AC/DC album’s ASIN (Amazon Standard Identification Number). If you change that, you’ll get a “Page not found” or an entirely different product: http://www.amazon.co.uk/High-Voltage-AC-DC/dp/B003BEZ7HI.

The /dp/ also matters. Changing this leads to a “Page not found.” So, the B00008AJL3 probably tells Amazon what to display, and the dp tells the website how to display it. This is URL rewriting in action, with the original URL possibly ending up getting rewritten to something like:
http://www.amazon.co.uk/displayproduct.php?asin=B00008AJL3.

Features of an Amazon URL

This introduces some important features of Amazon’s URLs that can be applied to any website with a complex set of resources. It shows that the URL can be automatically generated and can include up to three parts:

  1. The wordsIn this case, the words are based on the album and artist, and all non-alphanumeric characters are replaced. So, the slash in AC/DC becomes a hyphen. This is the bit that helps humans and search engines.
  2. An ID numberOr something that tells the website what to look up, such as B00008AJL3.
  3. An identifierOr something that tells the website where to look for it and how to display it. If dp tells Amazon to look for a product, then somewhere along the line, it probably triggers a database statement such as SELECT * FROM products WHERE.

Other Shopping Examples

Many other shopping websites have URLs like this. In the list below, the ID number and (suspected) identifier are in bold:

  • http://www.ebay.co.uk/itm/Ian-Rankin-Set-Darkness-Rebus-Novel-/140604842997
  • http://www.kelkoo.com/c-138201-lighting/brand/caravan
  • http://www.ciao.co.uk/Fridge_Freezers_5266430_3
  • http://www.gumtree.com/p/for-sale/boys-bmx-bronx-blaze/97669042
  • http://www.comet.co.uk/c/Televisions/LCD-Plasma-LED-TVs/1844

A significant benefit of this type of URL is that the actual words can be changed, as shown below. As long as the ID number stays the same, the URL will still work. So products can be renamed without breaking old links. More sophisticated websites (like Ciao above) will redirect the changed URL back to the real one and thus avoid creating the appearance of duplicate content (see below for more on this topic).

screenshot

Websites that use URL rewriting are more flexible with their URLs — the words can change but the page will still be found.

Friendly URLs

Now you know how to map nice friendly URLs to their underlying Web pages, but how should you create those friendly URLs in the first place?

If we followed the current advice, we would separate words with hyphens rather than underscores and capitalize consistently. Lowercase might be preferable because most people search in lowercase. Punctuation such as dots and commas should also be turned into hyphens, otherwise they would get turned into things like %2C, which look ugly and might break the URL when copied and pasted. You might want to remove apostrophes and parentheses entirely for the same reason.

Whether to replace accented characters is debatable. URLs with accents (or any non-Roman characters) might look bad or break when rendered in a different character format. But replacing them with their non-accented equivalents might make the URLs harder for search engines to find (and even harder if replaced with hyphens). If your website is for a predominately French audience, then perhaps leave the French accents in. But substitute them if the French words are few and far between on a mainly English website.

This PHP function succinctly handles all of the above suggestions:

function GenerateUrl ($s) {
  //Convert accented characters, and remove parentheses and apostrophes
  $from = explode (',', "ç,æ,œ,á,é,í,ó,ú,à,è,ì,ò,ù,ä,ë,ï,ö,ü,ÿ,â,ê,î,ô,û,å,e,i,ø,u,(,),[,],'");
  $to = explode (',', 'c,ae,oe,a,e,i,o,u,a,e,i,o,u,a,e,i,o,u,y,a,e,i,o,u,a,e,i,o,u,,,,,,');
  //Do the replacements, and convert all other non-alphanumeric characters to spaces
  $s = preg_replace ('~[^\w\d]+~', '-', str_replace ($from, $to, trim ($s)));
  //Remove a - at the beginning or end and make lowercase
  return strtolower (preg_replace ('/^-/', '', preg_replace ('/-$/', '', $s)));
}

This would generate URLs like this:

echo GenerateUrl ("Pâtisserie (Always FRESH!)"); //returns "patisserie-always-fresh"

Or, if you wanted a link to a $product variable to be pulled from a database:

$product = array ('title'=>'Great product', 'id'=>100);
echo '<a href="' . GenerateUrl ($product['title']) . '/' . $product['id'] . '">';
echo $product['title'] . '</a>';

Changing Page Names

Search engines generally ignore duplicate content (i.e. multiple pages with the same information). But if they think they are being manipulated, search engines will actively penalize the website, so avoid this where possible. Google recommends using 301 redirects to send users from old pages to new ones.

When a URL-rewritten page is renamed, the old URL and new URL should both still work. Furthermore, to avoid any risk of duplication, the old URL should automatically redirect to the new one, as WordPress does.

Doing this in PHP is relatively easy. The following function looks at the current URL, and if it’s not the same as the desired URL, it redirects the user:

function CheckUrl ($s) {
  // Get the current URL without the query string, with the initial slash
  $myurl = preg_replace ('/\?.*$/', '', $_SERVER['REQUEST_URI']);
  //If it is not the same as the desired URL, then redirect
  if ($myurl != "/$s") {Header ("Location: /$s", true, 301); exit;}
}

This would be used like so:

$producturl = GenerateUrl ($product['title']) . '/' . $product['id'];
CheckUrl ($producturl); //redirects the user if they are at the wrong place

If you would like to use this function, be sure to test it in your environment first and with your rewrite rules, to make sure that it does not cause any infinite redirects. This is what that would look like:

screenshot

This is what happens when Google Chrome visits a page that redirects to itself.

Checklist And Troubleshooting

Use the following checklist to implement URL rewriting.

1. Check That It’s Supported

Not all Web servers support URL rewriting. If you put up your .htaccess file on one that doesn’t, it will be ignored or will throw up a “500 Internal Server Error.”

2. Plan Your Approach

Figure out what will get mapped to what, and how the correct information will still get found. Perhaps you want to introduce new URLs, like my-great-product/p/123, to replace your current product URLs, like product.php?id=123, and to substitute new-category/c/12 for category.php?id=12.

3. Create Your Rewrite Rules

Create an .htaccess file for your new rules. You can initially do this in a /testing/ subdirectory and using the [R] flag, so that you can see where things go:

RewriteEngine On
RewriteRule   ^.+/p/([0-9]+)   product.php?id=$1    [NC,L,R]
RewriteRule   ^.+/c/([0-9]+)   category.php?id=$1    [NC,L,R]

Now, if you visit www.mywebsite.com/testing/my-great-product/p/123, you should be sent to www.mywebsite.com/testing/product.php?id=123. You’ll get a “Page not found” because product.php is not in your /testing/ subdirectory, but at least you’ll know that your rules work. Once you’re satisfied, move the .htaccess file to your document root and remove the [R] flag. Now www.mywebsite.com/my-great-product/p/123 should work.

4. Check Your Pages

Test that your new URLs bring in all the correct images, CSS and JavaScript files. For example, the Web browser now believes that your Web page is named 123 in a directory named my-great-product/p/. If the HTML refers to a file named images/logo.jpg, then the Web browser would request the image from www.mywebsite.com/my-great-product/p/images/logo.jpg and would come up with a “File not found.”

You would need to also rewrite the image locations or make the references absolute (like <img src="/images/logo.jpg"/>) or put a base href at the top of the <head> of the page (<base href="/product.php"/>). But if you do that, you would need to fully specify any internal links that begin with # or ? because they would now go to something like product.php#details.

5. Change Your URLs

Now find all references to your old URLs, and replace them with your new URLs, using a function such as GenerateUrl to consistently create the new URLs. This is the only step that might require looking deep into the underlying code of your website.

6. Automatically Redirect Your Old URLs

Now that the URL rewriting is in place, you probably want Google to forget about your old URLs and start using the new ones. That is, when a search result brings up product.php?id=20, you’d want the user to be visibly redirected to my-great-product/p/123, which would then be internally redirected back to product.php?id=20.

This is the reverse of what your URL rewriting already does. In fact, you could add another rule to .htaccess to achieve this, but if you get the rules in the wrong order, then the browser would go into a redirect loop.

Another approach is to do the first redirect in PHP, using something like the CheckUrl function above. This has the added advantage that if you rename the product, the old URL will immediately become invalid and redirect to the newest one.

7. Update and Resubmit Your Site Map

Make sure to carry through your new URLs to your site map, your product feeds and everywhere else they appear.

Conclusion

URL rewriting is a relatively quick and easy way to improve your website’s appeal to customers and search engines. We’ve tried to explain some real examples of URL rewriting and to provide the technical details for implementing it on your own website. Please leave any comments or suggestions below.

(al)


© Paul Tero for Smashing Magazine, 2011.

Más sobre tendencias en Internet