Omniture Implementation and JavaScript Exercises

The client is a large utility (electric utility) located in California interested in taking their SiteCatalyst deployment to the next level. They're using a competing SiteCatalyst product and have decided to re-implement SiteCatalyst across their site using dynamic ASPX included footers and static server-side includes.

• Dynamic applications (20-30 ASP application templates) that implement web applications for customers (such as bill pay, paperless statements, filing work orders, etc)
• Several of these applications include:
  • The "My Account" application, which helps registered customers navigate within their utility account and access other account features (online billing signup, direct bill payments, paperless billing, etc)
  • "Direct Bill Payment" (a one-time process to pay the utility bill with a credit card online),
  • "Online Billing signup" (allows recurring payments through a credit card)
  • Many other applications (at least 10 different applications)
• Static pages (10K-20K HTML pages with common headers / footers managed by server-side includes). Contains a significant amount of content about saving energy, forms to obtain rebates, legal compliance material, etc.

• How many Registered customers successfully enroll for Online Billing? Within the site, either customers are considered "Registered" customers (because they can access "My Account") or unregistered - but either customer base can enroll in online billing.
  • Set a success Event for the Online-Billing signup feature. This would include passing an eVar capturing the Register/Un-registered state.
    
    One question I would like to get clarification on: are they looking for Customers who are set to 'registered' (logged-in) at the moment of sign up, or are Registered at some point. Is it possible for customers who have Registered in the past to sign up for Online Billing while they are logged out because they didn't sign-in during that particular visit? The answer to this could affect how the number is calculated.
• How many people are downloading / viewing the online billing tutorial PDF from the static pages site? Are these people selecting the online billing tutorial from the Online billing sign-up page, or by searching for the tutorial through internal search?
  • Set up a Custom Link trigger for PDF's which populate a prop for the file name and another prop for the pagename. Set up a correlation between the two props.
• How many people are retrieving their current utility bill, and how many are coming thru from the email reminder that is sent to them?
  • Create a Custom Segment for Visits which include a view of the Utility Bill page. Make sure a distinct Campaign Code is put on the email reminder links. Using this segment you can then get a count of Visitors coming in from the email with the Campaigns report. While this data could be gathered without the Custom Segment, using this segment makes it easier to calculate percentages as well as more nuanced things such as how many customers use both the email and direct access to view their bill.
• How much of the utility's revenue is being generated by registered users versus one-time bill-pay customers?
  • First question: is it possible for a Registered user to do a one-time bill pay ('Direct Bill Payment')? The notes above indicate it is. If so, then the comparison is not a clean one, as a person who is registered and does a one-time payment would fall under both categories.
  • Second question: is bill-paying the only revenue being generated/recorded on the site? If yes, will it stay that way for the foreseeable future?
  • Depending upon the answers to these two questions there would be different ways to handle this request.
  • Assuming question 1 is FALSE, a simple pay while Registered (logged-in) vs one-time-only (logged-out) payment breakdown, and only bill-paying revenue, you could set the Category of the Products string to 'Registered'/'Un-Registered', and use a Revenue by Category report.
  • Assuming the answers two both question 1 &2 are TRUE, then to get the revenue sums or percentages in the same chart you could set an evar to capture the value of any one-time payment at the same time the Products string is captured. You could then build some calculated metrics to get the required sums. This would allow them to be in the same chart.
  • Other combinations of answers for question 1 & 2 would have additional options, which can be explained upon request.

Other questions:

• How do you recommend deploying the SiteCatalyst to this site to ensure consistency between static & dynamic pages?
  • The setting of SC variables and other code would be done in a separate called file for both dynamic and static pages. This can help avoid running into instances of the code on dynamic pages (which often call a separate SC file) and static pages (where SC code is embedded in the page source code) deviating over time.
• What page naming standard would you define to help support basic site taxonomy? Use the site http://www.sce.com as an example site to reference a proposed page naming standard that will provide appropriate level of detail for basic reports.
  • Desktop: s.pageName="REGION>SITE NAME>SITE SECTION L1>SITE SECTION L2>PAGE LEVEL CONTENT";
    • Example: us>sce>residential>energy solutions>energy solutions
  • Mobile: s.pageName="REGION>SITE NAME:mobile>SITE SECTION L1>SITE SECTION L2>PAGE LEVEL CONTENT";
    • Example: us>sce:mobile>residential>energy solutions>energy solutions
    • I've used and seen this model for mobile used for a while now, including on a recent Implementation for a major retailer. I'm curious though to hear the latest thinking on how the fast growing field of responsive design impacts this mobile/non-mobile tagging structure. I'm currently in the process of helping to set up some internal implementation training, and how responsive design affects tracking plans has been a frequently asked question.

Step 1

Exercises:

1. Define a global JSON object (using JSON syntax) that contains the following elements:
   • An attribute called "products" that is an array of strings (use three strings in the array)
   • An attribute called "merchandising" which contains name/value pairs for each of the three strings listed in the products array. The "name" will be one of the values listed in the "products" array. The value can be any free-form string that describes where the product was purchased. For example, if one of the products was "shoes", I might have a name-value pair called "shoes": "Famous Footwear".
     //create global object
     globalJSON = [
     {"products":["canvas","brush","paint"]},
     {"merchandising": {"canvas":"Blicks","brush":"Michaels","paint":"ACMoore"}}];
     
     
2. Write a function that accesses the global object defined in #1 above.
   • Make a copy of the products array so that it can be modified locally without altering the original.
   • Take those product strings in the array and add a leading "semi-colon" to each product.
   • Add together all the products in the modified array to a global string called "s_products", with each product delimited by a "comma" character. Make certain that the commas are balanced with no additional leading or trailing commas.
   • If the s_products string is already defined globally, then append it to the existing string. Otherwise, define it as a new global variable.
     • Multiple clicks will append string to end of existing s_products value.
         
       s_products string:
       
       CODE:
       
       ////////////create local copy
       function makeCopy() {
       //clear localJSON in case of rerun
       if(typeof localJSON =='undefined'){
       var localJSON = jQuery.extend(true, {}, globalJSON);
       
       ////////////Add leading semi-colan to each product
       for (var i = 0; i < localJSON[0].products.length; i++) {
            var prodTemp = localJSON[0].products[i];
            localJSON[0].products[i]= ";" + localJSON[0].products[i];
            localJSON[1].merchandising[prodTemp] = ";" + localJSON[1].merchandising[prodTemp];}};
       
       /////////////check if s_products exists as global - add if false, add all products to global string, delimited by a comma, with no leading or trailing commas
       ((window.s_products == undefined) && localJSON[0].products[0])? (x=1 , s_products=""):x=0;
       for (var i = 0; i < localJSON[0].products.length; i++) {
            var prodTemp = localJSON[0].products[i];
            prodTemp = prodTemp.replace(/;/,"");
            s_products += "," + localJSON[0].products[i]+localJSON[1].merchandising[prodTemp];};
       if(x==1) s_products = s_products.substring(1);}
       
3. Modify your function so that it can be called using the 'eval' syntax and contextually add a form field-value that contains a reference to the JSON object that contains the products attributes. So in other words, I should be able to type in the name of any globally-defined JSON object I want to process into an HTML form. When I hit a form button, that button will execute the JavaScript function (written in section 2 above) using "eval" syntax and process the global JSON object from the form field.
   
   Enter a JSON object:   Test products: 'brush', 'paint', 'canvas'.

   Object Attribute: [ ]        Product String: [ ]

   
   
   

   CODE:

   onClick event for RUN button (also works on Enter keypress in text box)

   onclick="JavaScript: eval('evalTest(document.getElementById(\'vTest\').value)');"
   
   

   JavaScript

   ///create local copy
   function evalTest(x) {
   ///check if entered value is in JSON
   if(globalJSON[0].products.indexOf(x) == -1) alert("JSON object is not valid");
   
   //clear localJSON in case of rerun
   if(typeof localJSON =='undefined'){
   var localJSON = jQuery.extend(true, {}, globalJSON);
   
   ///Add leading semi-colan to each product
   for (var i = 0; i < localJSON[0].products.length; i++) {
   var prodTemp = localJSON[0].products[i];
   if(prodTemp==x) var c=i;
   localJSON[0].products[i]= ";" + localJSON[0].products[i];
   localJSON[1].merchandising[prodTemp] = ";" + localJSON[1].merchandising[prodTemp];}}
   
   ///update results on page
   document.getElementById("eValR").innerHTML = "Object Attribute: " + localJSON[1].merchandising[x].replace(';','') + " &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Product String: " + localJSON[0].products[c] + localJSON[1].merchandising[x];};
   

   
   
4. Demonstrate how to defend against cross-site scripting attacks that might be used if you call an eval statement from #3 above.
   • The use of eval is indicated when the source is trusted and competent. It is much safer to use a JSON parser.
   • It is a general rule of thumb that whenever we receive data from users or external sources, we cleanse them.
   • The eval function has the ability to clean the incoming string to avoid XSS vulnerabilities.
   Not very experienced with this. I did some research to brush up on the concepts, but not something I'm fluent in yet.
   
   
5. Write a regular expression that can extract the second-level domain (something.com) from a full URL.
   To get the true second level domain:
   

   Second Level Domain:

   
   CODE:
   

   ///second level domain
   function sDomain() {
   document.getElementById("s_domain").innerHTML = "Second Level Domain: " + document.domain}
   

   
   
   Enter a URL, then a number between 1 and 10 to get a dynamic domain level.
   URL:     LEVEL:

   Fourth Level Domain: three.two.one.com <example>

   
   CODE:
   

   /////dynamic domain level
   function tdomain() {
   var dg = ['First','Second','Third','Fourth','Fifth','Sixth','Seventh','Eight','Ninth','Tenth'];
   td = document.getElementById("t_entry").value-1;
   (document.getElementById("u_entry").value==""||document.getElementById("t_entry").value=="")?alert("Please fill in both entries."): ta = document.createElement('a'),
           ta.href = document.getElementById("u_entry").value,
           (ta.hostname)?te = ta.hostname.replace(/http:(s?)|www(2?).|\//ig,""):te=document.getElementById("u_entry").value,
           tc = (te.split(".").length - 1),
           (tc>td-1)?document.getElementById("t_domain").innerHTML = dg[td] + " Level Domain: " + te.split('.').slice(tc-td).join('.'):alert("Not that many levels in entered URL.");}
   

1. Perform an audit of a retail or travel site of your choice to build a Solution Design Reference that details the current state of their analytics implementation.
   

   This first Excel file is a review of the current Omniture implementation on abercrombie.com. I chose this site after having been involved in the development of a small section of it recently. I was pulled in literally a couple of days before the Club section launched to 'fix' the tagging plan. What made it a challenge is not only did I have no insights into the background of the project, but the developers (in Buenos Aires) had never implemented Omniture before. The tagging plan (put together by our group) was also pretty messy with lots of questionable things going on. So between gathering information about the project, reworking the tagging plan, and helping train the developers on Omniture requirements, it was a rather frantic week. I ended up prioritizing the Omniture tagging between Need by Launch, and what could wait until the days following launch. Throughout this process I noticed there were tagging issues with the main site, and a lack of good coordination between the tagging plan I inherited for the Club section and what I was seeing on the main site.

   This first file is an review of the full site. It includes a breakdown of the Events, eVars, and props that I could see firing. I've also detailed a number of issues which I found; most of these are technical errors, but a couple are related to what I see as issues with how the SC data is structured. This is not a completely comprehensive site report, as I went through much of the site, but not every single page. I tracked the Products tags up to but not including the actual purchase, so the last steps in the purchase path were not tested.

   Review
2. Create a technical specification document or deployment guide detailing a recommendation, why/how/what to expect from your recommendation, and how to implement it.
   

   This is an updated SDR including recommended changes (highlighted in orange). The original plan looks to have been pretty solid overall, so I didn't make a great deal of changes. Having had a few follow up conversations with the client on reporting, some of the recommendations are based upon the difference between what the original plan outlines and what their expectations were. One of the most important aspects of any implementation is making sure you clearly understand the client's needs and expectations, and structure the data accordingly. Having the technical aspects working properly is of course always important. But even if the technical and coding stuff is perfect, if the client is not getting what they need the implementation will be flawed.

   NOTE: This is not as comprehensive as a normal document would be, as it's more of an outline without getting into too much of the coding, such as function calls for plug-ins. It also includes a Charles tag converter which I built. I've found this to be helpful during the QA testing phase, especially if the tester is not fluent in the SDR.

   Updated SDR

NOTE: Some data may have been dummied for confindentiality reasons.

1. Sample Presentation Deck for the following situation:
   • Have already engaged with client for a review and measurement plan proposal
   • 1-2 initial meetings with stakeholders about their business, current digital presence, and some current projects in various stages of development
   • Have had an initial peek at some of the data
   • Audience is the management team, not the nitty-gritty tech or analytics folks

   PDF includes link in Annex to more detailed list of Recommendations.

   Presentation Link
2. Presentation for Results of Change to an online Shopping List Builder
   Presentation Link
3. Resume
   Link