http://drupal.org/node/640780

Displays a block on node or listing page

<?php
     $make_block_visible = FALSE;
     // the term id to show this block on
     $term_id_to_trigger_show_block = 1;
     // LISTING PAGE. taxonomy/terms/x
     if ((arg(0) == 'taxonomy') && (arg(1) == 'term') && (arg(2) == $term_id_to_trigger_show_block)) {
          $make_block_visible = TRUE;
     }
     // NODES
     if (arg(0) == 'node' && arg(1) && is_numeric(arg(1))) {
          $node = node_load(arg(1));
          foreach ($node->taxonomy as $term) {
               if ($term->tid == $term_id_to_trigger_show_block) $make_block_visible = TRUE;
          }
      }
      return $make_block_visible;
?>

Reference http://drupal.org/node/320795

<!-- Get taxonomy term, ID 2 (section background image) to write out section header -->
<?php
     if (arg(0) == 'node' && is_numeric(arg(1)) && !arg(2)) {
     $node = node_load(arg(1));
     $taxonomy_terms = $node->taxonomy;
     foreach ($taxonomy_terms as $term) {
          if ($term->vid == 2) {
               $ld_bg = $term->name;
          }
      }
    }
?>

<img src="/sites/all/themes/collective/img/<?php print $ld_bg; ?>_bkg.jpg" border="0" alt="<?php print $ld_bg; ?>" />

You can easily set up the experiment to look at your staging server and test like that but you are not going to get too many visits and/or conversions since it is a staging environment with only developers and a few others testing on it. When you launch a project on a site with decent traffic, that is when you can start having some issues. GWO and GA usually work together fairly well but I have run a couple of experiments that jogged the GAs numbers as soon as you implemented GWO.

The main problem I had recently was on a very complex issue, that ended up being a simple fix. Here is the flow of the experiment, an AB experiment testing 2 registration funnels

[image]

Everything was looking good except on side (Control) was getting a few more visits on staging. Not a huge deal with only around 30 visits accrued. We decided to move forward and launch. That is when the discrepancy between the 2 numbers became quite clear. After one day the numbers were
1344/75 (visits/conversions)
Control has 37/127
Variation had 38/47

There was a problem with the tracking script on Funnel B. We realized there was a problem and thus began me trying to figured out what was happening.

The way the experiment was set up was a little hacky, the first page the user hit has the GWO control code and sets the _utmx and _utmxx cookie to determine which version A or B it will display, if it is A it continues to display the first page, then it hit a META redirect to pass the user into funnel A. if the GWO determines the user should see B, the user was passed to that funnel.

I thought that maybe the redirect was taking a hold of the page before it got the response from google. That was not the case.

Funnel B also had ClickTale running on it, so the entire page was wrapped in a ClickTale JS. That was my first warning flag, I thought for sure the scripts were conflicting and not allowing the pageTracker tracking script on funnel B page to fire. Removing CT did nothing.

Back to the drawing board and a lot of testing both funnels using Firebug and Charles to track requests and cookies.
Everything looked good, the AB GWO decision was definitely working correctly. The tracking for the control page Funnel A was working correctly. And conversions for both pages were working as well. It just looked like Funnel B tracking wasn’t working.

But how was the conversions working? Well the cookie set from the control script chooses what page to display A or B, that is a permanent cookie so that users get the same page or variation of a page every time they visit. The conversion goal is determined by the pageTracker call and by determining what cookie the user has set on their browser. So it reads the cookie, determines the user in on Variation X, and then sends the tracker to GWO.

So the last thing I tried (of course it was the solution) was to check out the domains. The tracking script on Funnel B was on a secure server AND a sub-domain. Well you don’t have to look far to see how many times that question is asked in the GWO support. The solution is to modify the control and tracking scripts and add in your domain so it will track all the sub-domains.

Before the Control script
[

<script>
_udn = ".example.com";
</script>


Within the Tracking script

<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try{
var pageTracker = _gat._getTracker("UA-xxxxxx-x");
pageTracker._setDomainName(".example.com");
pageTracker._trackPageview("/xxxxxxxxxx/yyyy");
} catch(err) {}
</script>

2 hours after I implemented this (about how long GWO needs to collect some data), along with doing some subtractions from the bogus numbers, we started seeing the correct numbers come in.

Of course I should have spotted the sub-domain issue earlier, but all of this did allow me to get my hands dirty and learn a lot about the behind the scenes of the GWO AB test.

~ Snah

As nice as the Wordpress API is, I think this may be my new more convenient way to publish my blogs. Publishing from the text editor I do the most work should prod me to blog more often and hopefully better.

Many thanks to Kristan Kenny for her very helpful post.

Seems like that blog has been deactivated, there is plenty of documentation about this on the Textmate site itself, happy blogging!

XSLT is a way to format XML data into a template based format, not the way you would usually think of a style sheet. For my particular example I wanted to have a better way to format my audio discography. The first step I did was to range all of the data in a logical format in a XML doc. That can be viewed here.

The finished formatted XML with XSL can be viewed here. (with the exception of Safari, it has a known issue with XSL and it has to be parsed for it to be read correctly)

I wanted to parse this out into a HTML doc to fix the Safari issue and so it could be presented along with some addition hard coded video pieces and some other layout constraints I had with WordPress.

This was easily handled by a simple PHP script…

<?php
   $xslDoc = new DOMDocument();
    $xslDoc->load("disco.xsl");
    $xmlDoc = new DOMDocument();
    $xmlDoc->load("disco.xml");
    $proc = new XSLTProcessor();
    $proc->importStylesheet($xslDoc);
    echo $proc->transformToXML($xmlDoc);
?>

And the finished product.

I’m going to go more in depth on XPATH selectors, another part of XSL in another post.
~ H

I began by reading “Always Be Testing: The Complete Guide to Google Website Optimizer” which was given to me by our marketing department who knows the author. While the book is a bit heavy on marketing concepts, it gives many valid reasons for testing, testing stratigies and served as a great guide to what GWO can do for you for free and what it’s limitations are.

I gave a presentation to the company (I will soon share this through Google Docs) where I used an example of a few ways we  could change the homepage to see if we could achieve more conversions to our register page.

The main concept behind the WO engine is testing either completely different versions of a page (A/B testing) or testing variations of sections on a page (Multivariate testing) to get the used to a specified conversion page. There are ways to test driving users through different funnel pages to get to that conversion, testing time on site, conversion on click and conversion on form submission. I put links to those conversion tactics since they are a bit harder to set up and are pretty buried within the WO help files

The WO can be tied to your Google Analytics account, but not have different account profiles attached to it. There are quite a few issues that need to be resolved, or other things that would make their product so much more robust, mave they will be announcing some of these in the future via their blog http://websiteoptimizer.blogspot.com/. But for free, this is a great testing tool that everyone involved in UI, testing and juggling peoples opinions should be using.

The reports are pretty simple compared to what Google has in their Analytic tools, there are 2 pages listing conversions and page section conversion with comparisons to how the different combinaiton beat or lost to the origianl. I have included my result for the experiametn I ran on an interstitial on TAKKLE.

There is a good explanation here…

http://dev.aol.com/accessibility/bestpractices/ARIA_Required

Accessibility has always been in the back of my head but has always come 2nd to the fast paced production environment I work in most of my employment career. I am going to blog about some of these issues in the coming months, issues with screen readers, mobile content, etc…

The selector block article has some innovative ideas on grouping selectors into blocks and making them Macros.

~ H

New Properties | Selector Blocks

I received an introductory email via Linkedin from a Google recruiter asking if I had interest in working for the Big “G”. I wasn’t looking for work at the time but thought that if anything it would be a great learning experience and see how they handle their hiring practices. I graduated with my BS in Computer Science from Georgia Southern, far from the ivy league expectations that I had heard about Google’s hiring practices but the recruiter was legit and I started the process. After narrowing down the field to Google Front End Engineer, she quickly quizzed me with 3 questions over the phone to move on to the next phase of the interviewing/testing process. I did not sign any confidentially agreement, so I can reprint them here for any would be tech recruits looking to work for the Google.

Included after the questions are links to the most correct/in-depth responses from my knowledge and some basic link you could find the information on the web.

#1. What is a HTML DOCTYPE (DTD) and what is it’s purpose.

Per HTML and XHTML standards, a DOCTYPE (short for “document type declaration”) informs the validator which version of (X)HTML you’re using, and must appear at the very top of every web page.

DOCTYPEs are a key component of compliant web pages: your markup and CSS won’t validate without them.
http://www.alistapart.com/articles/doctype/

Follow up – why is validation important?

1. Validation as a debugging tool
2. Validation as a future-proof quality check
3. Validation eases maintenance
4. Validation helps teach good practices
5. Validation is a sign of professionalism

http://validator.w3.org/docs/why.html

#2 What is the difference between the CSS properties Visibility: hidden and Visibility: none?

‘display: none’ means that the the tag in question will not appear on the page at all (although you can still interact with it through the DOM). There will be no space allocated for it between the other tags.

‘visibility:hidden’ means that unlike display:none, the tag is not visible, but space is allocated for it on the page.

http://stackoverflow.com/questions/133051/what-is-the-difference-between-visibilityhidden-and-displaynone

Some additional information on the display property http://www.quirksmode.org/css/display.html

What is a Javascript JS Closure?

A “closure” is an expression (typically a function) that can have free variables together with an environment that binds those variables (that “closes” the expression).

http://www.jibbering.com/faq/faq_notes/closures.html

I did well on questions and 2 and completely blew question #3. In hindsight I knew plenty about closures but not enough to define them on the spot and I chocked. I assumed 66% was not a great score and I would not move on the next phase, which was an at home test that had to be completed in under 3 hours. I was wrong, I will write a post about that Google Front End Engineer – Coding home test that I completed.

Follow up (04-13-09) | I have recently been on some more interviews, here is the ever growing list of potential employer questions I get.

Define/describe the CSS box model

The CSS box model describes the boxes that are formed around elements of content in a Web page. Every element in a Web page is in a box or is a box, even if it’s an image of a circle. The boxes on Web pages are constrained by rules defined by the box model.

Parts of the CSS Box Model: The CSS box model is made up of four parts:

• margin
• border
• padding
• content

What is the difference between absolute and relative positioning?

Absolute positioning is relative to the page itself, relative positions relative to the object it is within, it’s starting position. position: absolute; tells the browser that whatever is going to be positioned should be removed from the normal flow of the document and will be placed in an exact location on the page. It is also taken out of the normal flow of the document – it won’t affect how the elements before it or after it in the HTML are positioned on the Web page.

Relative positioning uses the same four positioning properties as absolute positioning. But instead of basing the position of the element upon the browser view port, it starts from where the element would be if it were still in the normal flow.

What is !important mean and what does it do within a CSS class

An “!important” declaration (the keywords “!” and “important” follow the declaration) takes precedence over a normal declaration. Both author and user style sheets may contain “!important” declarations, and user “!important” rules override author “!important” rules. This CSS feature improves accessibility of documents by giving users with special requirements (large fonts, color combinations, etc.) control over presentation.

What are sprites/sprite collections?

This is a simple technique used for page load performance purposes. Since HTTP requests are the most expensive thing you can do in regards to front-end performance, you strive for making as little requests as possible. So instead of having the browser download 4 rounded corner images for example, you create one image that has all four. Then you use CSS background-position to only show the part of the image you want.

What is semantic code?

Basically, it’s a way of writing your HTML in a more meaningful, structured and to be honest, sensible way. It’s all about using your header tags (H1, H2, etc) for yep, you guessed it – headers, instead of bolding the text and increasing the font size with the old <i>span</i> tag. For paragraphs, use the <p> tag rather than sizing the font and adding hundreds of line breaks, for lists use the <li> tag, and so on.

If you want to add an image, you use the <img> tag because it’s the tag for inserting images, so it stands to reason really that when you’re adding a heading, list, etc, you use the correct tag, not some sort of bodge.

So why use Semantic HTML? What are the benefits? Why can’t I just do things my way? Well you can just do things your way if you want, but I’d probably not advise it. The biggest benefit of using Semantic Code is that you’ll be adhering to the Internet standard. And the benefit of that is that when things change and progress as they like to do on the Internet, the stuff that makes your site work isn’t going to get left behind.

http://boagworld.com/technology/semantic-code-what-why-how

~ H