Tip To The MSDN Team, Props on the Site

Yesterday I wrote a somewhat critical blog entry to Microsoft regarding their completely unintelligible use of domains, subdomains, and messaging around products.  I’m not sure who exactly is responsible, but I hope they read it.  I didn’t mean it as a personal attack or anything, just simply as a “please get yourself in line and respect what you do” type of message.

So that leads me to this open letter.  This open letter is primarily about giving props for a job well done on the site redesign of MSDN.  First off though I want to mention one thing.

Tip #1 – The URL is still a bit funky with the .aspx and en-us in it.  Clean that thing up. http://msdn.microsoft.com/en-us/default.aspx should look more like http://msdn.microsoft.com/ and that’s it.  NOTHING else.  At least get rid of the “default.aspx” page hanging around there.  Almost every major framework stack; PHP, Ruby on Rails, etc has removed the index.htm and at least left clean RESTful URIs.  It is a beautiful thing, make yours beautiful too.

Ok, now for the props!

Dear MSDN Team,

I wanted to write this open letter and commend the team on the redesign of the MSDN Site.  First let’s take a look at the MSDN Site.

MSDN Site Home Page
MSDN Site Home Page

At the very top of the page two things I like immediately.  Some UX Folks might not, but I dig the UX design around the UI for the four links; desktop, web, cloud, and phone.  The simple nature, basic styles of the blocks, and the hover over effect creates a very immediate communication of what each is focused around.  I read blog entry by Pete Brown about the MSDN and these blocks, which Microsoft’s Team dubbed “Hubs”.  There is a FAQ also available on the redesign.

The other point I’d like to draw attention to is that someone put the news on the upper part of the page.  Here I caught the “Visual Studio Lightswitch” News bit.  Of course, one could say it’s just a big add, but it really is more about MSDN news bits.  But I digress, I like that the upper section has that instead of digging around for it.

The sections below that have various links, that often don’t show up on the initial page display.  Scrolling down to search through this information is acceptable though, as it is something one would dig through and have intent around something very specific.

desktop

desktop
desktop

The desktop section of the site is setup following the new guidelines around simplification of data presentation.  This is something that has been sorely needed on MSDN for years.  Not sure if one remembers the nasty nested to the Nth degree treeview on the left hand side.  I don’t know where it went, but I’m really happy it is gone.  Now the layout is simple and to the point, with the key points of information being laid out in multiple steps.

web

The web section, again follows this new redesign model of user experience.

web
web

cloud

The cloud section again follows this new redesign…

cloud
cloud

phone

This too follows the redesign.  Simple, clean, and straight forward presentation of information.

phone
phone

I also like how the messaging around the primary platforms is clear.  It almost doesn’t’ seem like marketing is involved, which in my opinion is the best type of marketing.  When marketing kind of acts as the librarian that is helping you to find that key piece of information.  It’s very cool, it’s almost kind of cool in a way.

To summarize, I’m impressed.  MSDN Team, you guys have done a great job.  Props!

A Frequent Business User and Customer,
Adron @ Composite Code

That’s it for open letters for a while.  Now I’m off to do a bit of coding with Azure for the Phone using Visual Studio 2010.  🙂

Some Constructive Criticism to Microsoft Web Properties Leadership

Dear Microsoft Web Properties Leadership,

I’m a user of the various web sites that Microsoft releases on a daily basis.  I work with, for, and around Microsoft web sites to complete my daily work in software development.  However, the way the domains, sub-domains, and other web related properties are organized is often difficult to remember, use, and generally frustrating on many levels.  I know there are no hard rules for domains, sub-domains, etc, but there are some ideals and guidelines behind the usage of such things.  Life for the technical community would be much easier if you guys actually followed these ideals and guidelines.  Let me provide a prime example of a service I have to use regularly.

BPOS (and I’m not defining what BPOS is, because this is part of the issue…)

Before even using it, I’ll start by searching for it.  To provide what a new user of the system may see if they’re trying to sign up or such.  If I navigate to a search engine, I’ll use Bing for this particular example, and try to find out about Microsoft BPOS Services I get the following results.

Bing Results for "Microsoft BPOS"
Bing Results for "Microsoft BPOS" (Click the image for a full size rendering)

These are good results, so no problem yet.  Now with some basic intuitive analysis of the results I have the following obvious Microsoft Properties to check out.  At least, I hope that I do.

This is one of the more straight forward results for a product.  Setting us on a good path, so let’s take a look at each of these sites.

First the http://www.microsoft.com/online/default.aspx, which gives us this page.

Microsoft BPOS Site Property #1
Microsoft BPOS Site Property #1 (Click the image for a full size rendering)

There are some glaring issues with the page itself, but first take note of that URI.  That’s a nasty URI for the main root page to begin with.  It ends with *.aspx, and there is a sub path which an Internet power user wouldn’t be able to understand let alone a novice or standard business user.  Let’s go through the red arrows real quick.  I’ll hit on each arrow in order from top to bottom.

Ok, before continuing with the domain & sub-domain issue, let me step into another concern here.  There are the two choices for a Free Trial or Buy Now.  These two options are not that bad, but look below a big $10 sign, only $10 dollars!?  NO.  It’s $50 dollars not $10.  In the small print, the third red arrow, it states you will need to order a minimum of 5 users, which equates to $50 dollars.  I think somebody at Microsoft should clean this up a bit, at first glance it is misleading.

I know this isn’t a sub-domain or domain naming issue, as I started with, but I just want to point this out as it is a problem for reputation.  So my first critique tip is…

Critique Tip #1 – Clean up the selling point on the page and don’t be misleading.

Fourth arrow is a pet peeve of mine.  Again, not to the domain and sub-domain issue yet, but I want to tackle these because they’re frustrating.  For some reason Microsoft expects everyone to scroll way down their pages to find out news about the product.  In addition, as the last arrow points out, it is also assumed that everyone always understands all of Microsoft’s Acronym Soup.  No, we don’t Microsoft, you’re making these up.  So please actually write some regular, intelligible titles for products or use some of those awesome secret names as product names.  People would LIKE IT if you did.  I want you guys to succeed with some of these services too, and writing headlines like this, in a news section that is at the bottom of the page, and not easily accessible and up front isn’t doing you guys any favors.  I’m trying to help out here.

Critique Tip #2 – Give us the news higher on the page, where it is easy to find, and write the articles for people that may not work for Microsoft itself.

The next link is I suppose another page related to BPOS from Microsoft.  http://microsoftbpos.net/ is navigated to and I find this.

A BPOS Company?
A BPOS Company?

Nope, this is NOT a Microsoft property.  But being there are so many Microsoft Properties with no rhyme or reason to the domain and sub domain usage, this seemed like a legitimate Microsoft Site.  It isn’t Microsoft’s fault that this link is a little misleading, but if one is looking for a company to handle this confusion for them, this may be a great company.  Otherwise, I’m moving on to the next link.

The next link is http://microsoftbpos.com/. This one has to be a Microsoft Site, I hope.

Business Productivity Online Standard Suite (BPOSS??)
Business Productivity Online Standard Suite (BPOSS??)

Yup, we’re good.  But it is confusing isn’t it.  What exactly is BPOSS anyway?  I thought I searched for BPOS?  Is this BPOS?  Maybe just another S on the end?  Anyway, I digress.

No intuitive use of the domains going on here.  Two completely autonomous and separate domains being used for the same business within Microsoft.  Not cool, Microsoft you are driving down the WRONG way on the road with this.  Even if there is differences between this and the other BPOS site, it isn’t immediately apparent and they come back in the same search results.  So if they are different, SEO #fail.

Again, there are standard UX no no’s at work here too.  News is at the bottom in a little right hand corner box.  The same sales point is being made, $10 per user, which isn’t inherent to the real base cost, and those same two buttons are there to simply lead users into purchasing without realizing what they’re getting.  Last, the page is too long.  We don’t need to scroll down so far and there does NOT need to be a big huge Bing search at the top.  This is the type of activity I’d expect from Black Hat SEO Hacks trying to get higher SEO ranking illegally, NOT from Microsoft.

Tip #3 – A single domain for a single business segment or use a sub-domain off of the microsoft.com domain such as http://bpos.microsoft.com or http://onlineproductivitysuite.microsoft.com.

The last link is definitely Microsoft, as it hangs off of the microsoft.com domain.  http://www.microsoft.com/business/bpostestdrive/demo.aspx?CR_CC=200000034&WT.srch=1&CR_SCC=200000034&WT.srch=1 maybe it just has some simple info on it but isn’t, yet another, landing or portal page for the product?  It couldn’t be right?  Wrong again.  It is a primary landing page with all that nasty URI query string nonsense.

Ahh, a nice looking BPOS Site!!
Ahh, a nice looking BPOS Site!!

This site, I have to admit, seems better.  Tabs at the top, no pointless Bing search at the top, and actual topic points of concern in the center of the page.  Whoever this group is, design the other pages.  Better yet, get rid of the other pages and go with this design.  This isn’t the best page, but it’s 10x better than the others.

Tip #4 – Use this site as a reference for creating a single BPOS site with appropriate navigation, section on the page, move the news up to the forefront, and get the site re-published.

That’s it for this critique.  Microsoft representatives, management, and others please take heed.  I’m honestly trying to write an entertaining yet constructively critical entry here as a sort of open letter, it may seem I’m attacking, but from outside (or inside) Microsoft it is difficult to get things like this fixed.

I hope this helps.  😉  Cheers to a good solution!

A Frequent Business User and Customer,
Adron @ Composite Code

PS:  I’ll be following this open letter tomorrow with a letter providing props for some awesome sites, UX, and general offerings that Microsoft has put together.  So I didn’t just write this to hate on Micrsoft, I’m just frustrated intently by their blatant bad usage around domains, sub-domains, etc.

So stay tuned, I’ve got props coming instead of all this grumbling.  Cheers!

IE9 Pinning for WordPress

I decided, contrary to my last few years of experiences, that I should give IE9 a go.  Especially after seeing the pinning capabilities for WordPress.  I must say the IE9 pinning feature is pretty awesome.  Is it enough to make me switch?  Well, I’ll roll through some of the awesomeness of the pinning features and then lay out the yes and nos.

IE9 Pinning for WordPress
IE9 Pinning for WordPress

I’ll hit on each of the red arrows from top to bottom.

The first red arrow, just at the tip pointing at the tab shows the favicon.ico missing.  That’s probably the only bug I’ve seen with IE9 related to WordPress Pinning so far, and really it isn’t related.  But I thought I’d point it out regardless.

The far upper left has the site icon (which should be the favicon.ico also).  The second arrow beside that one points at the navigate back to the main blog that is related to the login arrow I put in the middle of the page that is related to me having clicked on the Blog States menu option of the pinned menu that the second to last red arrow points to.  <- That one was hard to follow eh!  😉   It’s the Friday challenge is what that was.

So then at the very bottom, pinned to the Windows 7 Start Bar is the C# Icon that I use for the my Composite Code Blog (that you’re reading).

Now as for the question, “Would this make me switch?”  Nope, not at all.  The IE9 beta has already had enough issues at this point that I’m definitely sticking with Chrome.  Also there are a few Chrome features that I will not do without for my regular work with all the SaaS Applications I use;

  • Tabs that are very fast, use minimal ram, and don’t “cease to exist” or “crash” as IE9 tabs currently do.
  • Sync my bookmarks across all installations of Chrome on any system anywhere.  Chrome has that, haven’t found it on IE9, or Firefox yet.  Maybe there is an add-on, but since Chrome has it, I haven’t found any reason to look for it.
  • Performance that currently is incomparable in the JavaScript, HTML & CSS rendering, and related features.  Nothing touches Chrome right now for the sights I use a lot.  For social media sites it is flawless in execution.  Facebook, LinkedIn, Flickr, Twitter, etc.  Chrome is blazing fast.  On sites that have tons and tons of AJAX calls and JavaScript to execute, even more flawless.

So overall, GREAT feature that as far as I can tell, the IE9 team created.  Great job!  But I still expect more at this point, so we shall see come time for the full release.

NOTE to Microsoft Marketing:  Just get rid of the version number.  Chrome has done this perfectly.  The updates are seem-less and far as I can tell the update mechanism is even Microsoft Technology (at least on the Windows install).  This is something that Internet Explorer should absolutely imitate!  🙂

Anyway, just wanted to publish a nice simple Friday blog entry.  Fini.

Exam 70-515 Focus Developing a Web Application by Using ASP.NET MVC 2

…and with this entry, I’ve skipped to the last section of the exam topics related to ASP.NET MVC 2.  Reading and studying the old viewstate based ASP.NET material was a bit rough, which I’ll be writing about in an upcoming entry.  For now, back to focusing on the test at hand.  The MVC Framework is pretty rock star awesome, so with that I’ll get to the notes.

Focus Point:  Developing a Web Application by Using ASP.NET MVC 2

Create Custom Route

  • ASP.NET Routing – ASP.NET enables you to use URLs that do not have a map to specific files in a Web Site.  Because the URL does not have a map to a file, you can use URLs that are descriptive of the user’s action and therefore are more easily understood by users.  Check out URL Patterns for more information (on the same page) and Adding Routes to an MVC Application.  Also for real world implementation you may want to know the difference between Routing and URL Rewriting.
  • Adding Constraints to Routes – In addition to matching the URL request to a route definition by the number of parameters in the URL, you can specify that values in the parameters meet certain constraints.  If a URL contains values that are outside the constraints for a route, that route is not used to handle the request.  You add constraints to make sure that the URL parameters contain values that will work in your application.  Constraints are defined by using regular expressions or by using objects that implement the IRouteConstraint interface. When you add the route definition to the Routes collection, you add constraints by creating a RouteValueDictionary object that contains the verification test. The key in the dictionary identifies the parameter that the constraint applies to. The value in the dictionary can be either a string that represents a regular expression or an object that implements the IRouteConstraint interface. If you provide a string, routing treats the string as a regular expression and checks whether the parameter value is valid by calling the IsMatch method of the Regex class. The regular expression is always treated as case-insensitive. For more information, see .NET Framework Regular Expressions.  If you provide an IRouteConstraint object, ASP.NET routing checks whether the parameter value is valid by calling the Match method of the IRouteConstraint object. The Match method returns a Boolean value that indicates whether the parameter value is valid.
  • Route Class – Provides properties and methods for defining a route and for obtaining information about the route.  The Route class enables you to specify how routing is processed in an ASP.NET application. You create a Route object for each URL pattern that you want to map to a class that can handle requests that correspond to that pattern. You then add the route to the Routes collection. When the application receives a request, ASP.NET routing iterates through the routes in the Routes collection to find the first route that matches the pattern of the URL.  Set the Url property to a URL pattern. The URL pattern consists of segments that come after the application name in an HTTP request. For example, in the URL http:www.contoso.com/products/show/beverages, the pattern applies to products/show/beverages. A pattern with three segments, such as{controller}/{action}/{id}, matches the URL http:www.contoso.com/products/show/beverages. Each segment is delimited by the / character. When a segment is enclosed in braces ( { and } ), the segment is referred to a URL parameter. ASP.NET routing retrieves the value from the request and assigns it to the URL parameter. In the previous example, the URL parameter action is assigned the value show. If the segment is not enclosed in braces, the value is treated as a literal value.  Set the Defaults property to a RouteValueDictionary object that includes values that are used if a parameter is missing from the URL or to set additional values that are not parameterized in the URL. Set the Constraints property to a RouteValueDictionary object that contains values that are either regular expressions orIRouteConstraint objects. These values are used to determine whether a parameter value is valid.
  • Route.Constraints Property – Gets or sets a dictionary of expressions that specify valid values for a URL parameter.  The Constraints property enables you to limit acceptable values for a URL parameter that is processed by a route. You assign a RouteValueDictionary object to the Constraints property. Each element in the RouteValueDictionary object contains the name of a parameter and one of the following:
    • A string that defines a regular expression. The regular expression is case-insensitive.
    • An object that implements the IRouteConstraint interface and that includes a Match method.

The following example is from the MSDN, which shows allowed methods of GET and POST.

[sourcecode language=”csharp”]
void Application_Start(object sender, EventArgs e)
{
RegisterRoutes(RouteTable.Routes);
}

public static void RegisterRoutes(RouteCollection routes)
{
string[] allowedMethods = { "GET", "POST" };
HttpMethodConstraint methodConstraints = new HttpMethodConstraint(allowedMethods);

Route reportRoute = new Route("{locale}/{year}", new ReportRouteHandler());
reportRoute.Constraints = new RouteValueDictionary { { "httpMethod", methodConstraints } };

routes.Add(reportRoute);
}
[/sourcecode]

Create Controllers and Actions

  • Controller and Action Methods in MVC Applications – The ASP.NET MVC Framework maps URLs to classes that are referred to as controllers.  Controllers process incoming requests, handle user input and interactions, and execute appropriate application logic.  A controller class typically calls a separate view component to generate the HTML markup for the request.  The base class for all controllers is the ControllerBase class, which provides general MVC handling.
  • Two great articles;  MSDN Magazine titled Building Web Apps without Web Forms and there is the What’s New section on the ASP.NET MVC Site.
  • Create an action – You add a new action to a controller by adding a new method to the controller. These methods must meet these requirements:
    • Must be public
    • Cannot contain a static method
    • Cannot be an extension method
    • Cannot be a constructor, getter, or setter
    • Cannot have open generic types
    • Cannot contain out or ref parameters
    • is not a method of the controller base class.
  • Create a Controller – This tutorial covers creating a controller including the menu options and scaffolding, etc.
  • Action Filtering in MVC Applications – In ASP.NET MVC, controllers define action methods that usually have a one-to-one relationship with possible user interactions, such as clicking a link or submitting a form.  For example, when a user clicks a link, a request is routed to the designated controller, and the corresponding action method is called.  ASP.NET MVC provides action filters that are custom attributes that provide a declarative means to add pre-action and post-action behavior to controller action methods.

MVC 2 Template Project

Structure an ASP.NET MVC Application

  • MVC Framework and Application Structure – In an ASP.NET website, URLs typically map to files that are stored on disk (usually .aspx files).  These .aspx files include markup and code that is processed in order to respond to the request. The ASP.NET MVC framework maps URLs to server code differently than an ASP.NET Web Forms page. Instead of mapping URLs to ASP.NET pages or handlers, the framework maps URLs to controller classes. Controller classes handle incoming requests, such as user input and interactions, and execute appropriate application and data logic, based on user input. A controller class typically calls a separate view component that generates HTML output as the response. The ASP.NET MVC framework separates the model, view, and controller components.
  • Global URL Routing Defaults see below (from MSDN Article)

[sourcecode language=”csharp”]
public class MvcApplication : System.Web.HttpApplication
{
public static void RegisterRoutes(RouteCollection routes)
{
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

routes.MapRoute(
"Default", // Route name
"{controller}/{action}/{id}", // URL with parameters
new { controller = "Home", action = "Index", id = "" } // Parameter defaults
);

}

protected void Application_Start()
{
RegisterRoutes(RouteTable.Routes);
}
}
[/sourcecode]

Create and Customize Views

Using the begin BeginForm Helper

[sourcecode language=”html”]
<% using(Html.BeginForm("HandleForm", "Home")) %>
<% { %>
<!– Form content goes here –>
<% } %>
[/sourcecode]

Using it declaratively…

[sourcecode language=”html”]
<% Html.BeginForm(); %>
<!– Form content goes here –>
<% Html.EndForm(); %>
[/sourcecode]

Using the Checkbox Helper

[sourcecode language=”html”]
<%= Html.CheckBox("bookType") %>
[/sourcecode]

Using the DropDownList Helper

[sourcecode language=”html”]
<%= Html.DropDownList("pets") %>
[/sourcecode]

[sourcecode language=”csharp”]
List<string> petList = new List<string>();
petList.Add("Dog");
petList.Add("Cat");
petList.Add("Hamster");
petList.Add("Parrot");
petList.Add("Gold fish");
petList.Add("Mountain lion");
petList.Add("Elephant");

ViewData["Pets"] = new SelectList(petList);
[/sourcecode]

Using the RadioButton Helper

[sourcecode language=”html”]
Select your favorite color:<br />
<%= Html.RadioButton("favColor", "Blue", true) %> Blue <br />
<%= Html.RadioButton("favColor", "Purple", false)%> Purple <br />
<%= Html.RadioButton("favColor", "Red", false)%> Red <br />
<%= Html.RadioButton("favColor", "Orange", false)%> Orange <br />
<%= Html.RadioButton("favColor", "Yellow", false)%> Yellow <br />
<%= Html.RadioButton("favColor", "Brown", false)%> Brown <br />
<%= Html.RadioButton("favColor", "Green", false)%> Green
[/sourcecode]

Using the Textbox Helper

[sourcecode language=”html”]
Enter your name: <%= Html.TextBox("name") %>
[/sourcecode]

Exam 70-515 Pt 1 Focus on Developing Web Forms Pages – Addendum

I missed the last bit of the initial focus Developing Web Form Pages.  Primarily covering the state management, so to not leave the topic untouched I present the following notes.  Cheers!

Manage State

  • Control.ViewState Property – Gets a dictionary of state information that can be used to store and retrieve the view state of a server control across multiple requests for the same page.  For more information read ASP.NET State Management Overview.
  • The core functionality of viewstate is to read values and save values.
  • PageStatePersistor.ControlState Property – Gets or sets and object that represents the data that controls contained by the current Page object use to persist across HTTP requests to the web server.  Control state is an object comprised of critical view state that the controls need to function.  It is contained in a separate object form normal view state information.  This view state is not affected when the page view state settings are changed.
  • HiddenField Class – Represents a hidden field used to store a non-displayed value.
  • Another common way to manage state is with cookies.  This is a non-Microsoft specific way of managing state, which is used by all browsers, web technology stacks, etc.  HttpResponse.Cookies Property – Gets the response cookie collection.  ASP.NET includes to intrinsic cookie collections.  The collection accessed through the Cookies Collection of HttpRequest which contains cookies transmitted by the client to the server in the cookie header.  The collection accessed through the cookies collection of HttpResponse contains new cookies created on the server and transmitted to the client in the Set-Cookie Header.  After you add a cookie by using the HttpResponse.Cookies collection, the cookie is immediately available in the HttpRequest.Cookies collection, even if the response has not been sent to the client.  For usage review How to: Delete a Cookie and How to: Write a Cookie.
  • HttpRequest.QueryString Property – Gets the collection of HTTP query string variables.
  • ASP.NET Application State Overview – Application state is a data repository available to all classes in an ASP.NET application. Application state is stored in memory on the server and is faster than storing and retrieving information in a database. Unlike session state, which is specific to a single user session, application state applies to all users and sessions. Therefore, application state is a useful place to store small amounts of often-used data that does not change from one user to another.
  • HttpApplicationState Class – Enables sharing of global information across multiple sessions and requests within an ASP.NET application.
  • Also be sure to check out the Session State Modes:
    • In-process Mode
    • State Server Mode
    • SQL Server Mode
    • Custom Mode