Code snippets on Microsoft website shown in form of images. (msdn.microsoft.com)

It's not just MSDN which is inconsistent.

Microsoft's web presence in general varies widely. The philosophy appears to highly favor providing access to knowledge/content over standardization of form/presentation.

The scale of Microsoft's web properties is vast and they do not waste resources trying to get a herd of cats to goosestep.

I suspect that letting people do their own thing when it comes to placing content on the web is based on two historical features of Microsoft.

The first is that because many Microsoft employees were strongly engaged with computers, there were many early adopters of the internet and more importantly the web (Microsoft.com registered in 1991). I suspect that the anything goes culture of the wild west days of the web persists to some degree within the organization.

The second historical factor is that there were a lot of employees with fuck you money during the early days of Microsoft's web presence and Microsoft management didn't waste resources forcing developers to heel to the sacred ideas of branding experts.

If you dig around Microsoft, you will find lots of standard tools - e.g. MSDN has a fairly consistent graphic presentation when it comes to technical documentation - it just looks nothing like Channel9. However, these differences, while not ideal for consumers, are pretty much irrelevant when it comes to supporting developers.

Yes the bitmap code snippets are embarrassing but not in a Facebook security hole kind of way. Any developer doing .NET programming isn't going to be greatly slowed down by typing in the code rather than copying and pasting from the MSDN page.

When the code was adjusted to fit on the website they lost a lot of the formatting, and severely hurt the readability of the code. It appears that the lines of code were rather long, but were word-wrapped to fit within the size of that image, creating linebreaks at unexpected places. The first and last lines of the block open and close curly braces, but the rest of the code is not indented.

Readability is something you need to be aware of, but don't worry about learning bad practice. You'll become opinionated pretty quickly on your own.

Just a few quick observations:

The formatting is non-existant. That makes me angry. Because I have OCD. Most programmers do.

There's a lot of direct use of DOM traversing, which makes the code rather brittle. (Use a css selector for binding to the DOM - jQuery is the de-facto standard tool here).

Variables are not encoded in the URL. And when it is, it happens on a separate line from where it's used. That's just bad style.

Oh, and what's the point of those declared-but-unused variables (`spanish, german, english`).

And why aren't they in a hashmap?

I'm not the most savvy javascript developer, but I'll take a stab at it.

Variable declarations and assignments happen on multiple lines in the 2nd snippet instead of all being defined at once.

  var currentLanguage = "en";
  var spanish = "es";
  var german = "de";
  var english = "en";

vs

  var currentLanguage = "en", spanish = "es", german = "de", english = "en";

Additionally, "en" is assigned twice. If you're going to take the time to assign the "en" abbreviation into the "english" variable, then you should use it when assigning to "currentLanguage", in my opinion, if only to avoid typos and redundancy.

  var spanish = "es", german = "de", english = "en", currentLanguage = english;

The "disclaimer" element is accessed using the documentGetElementById DOM call twice. javascript is getting faster, but forcing multiple DOM calls when it's not necessary is bad practice. Ideally, you'd access it once and save it into a reference.

  document.getElementById("disclaimer").firstChild.nodeValue = response;
  var text = encodeURIComponent(document.getElementById("disclaimer").firstChild.nodeValue);

vs

  var disclaimer = document.getElementById("disclaimer"), text = disclaimer.firstChild.nodeValue;
  disclaimer.firstChild.nodeValue = response;

The code formatting is poor and inconsistent, notice an incorrect space after "encodeURIComponent (", but no spaces after "getElementById(" and "getElementsByTagName(". Also notice no indentation anywhere, or line-breaks after the function signatures and opening brackets "{";

The code is polluting the global namespace by not being enclosed in its own namespace or perhaps an immediately executed anonymous function.

I'm sure more seasoned JS devs can list some more things wrong with the code, but those are the ones that stood out to me.

    var x = 0, y = 1, z = 0;
    // Some looping or similar here

    var foo = 4,
        bar = 5,
        baz = 6,
        qux = 'quux;

    var foo = 4,
        bar = 5,
        baz = 6,
        sprinkles = 'wee';
        qux = 'quux';

There are plenty of MS employees on HN. I'm curious...what makes you think someone who works on translator is less likely to know what HN is?

This is why pair programming and code reviews work so well.