This is one article in a series giving you the behind the scenes story of setting up a .NET and SQL Server hosted application platform that runs on Windows 2008, IIS7.  The series will cover how to set up a blog engine, RSS feeds, optimize them and give you best practices on writing Search Engine Optimized content. The series will also cover tips on how to publicize the content with a Social Networking Optimization strategy.  This is a living series, happening in real time.  Each post will be updated as the story develops, so be sure to check the last modified date listed at the top of each post.  Please post any questions in the comments, as they will be answered directly through the updated content.  The goal of the series is to help both novice and intermediate developer go independent with their own customized blogging and development platform.

For information on the entire series, please refer to the original stub post which links to all the sub-posts in the entire series. Or, better yet, subscribe to the actual feed: Blogging 101 - Behind the Scenes at SlingAlibi (1)

Last modified : 8/31/09

Going Indie!  Buying a domain 

1. So only a week after launching on MSDN, I have decided to republish the content on another domain. For several reasons (1) to get the content off a MSDN owned side (2) for ease of management purposes (3) for new features, such as Facebook connect, that the current (old) version of Community Server on MDSN doesn’t provide (4) to maintain my readership should I ever leave the company (which i am definitely not planning to do) or if something happens to MSDN blogs. (5) maintain my own branding. So I am now going to walk through the process of moving from MSDN onto my own indie site.  It’s early enough in the life of my blog as my subscribers are only at 15, with 6 reach (number of actions taken on my site – clickthroughs off my blog), so hopefully it will be relatively painless to migrate : 
2. Although GoDaddy isn’t necessarily family friendly and it is littered with upselling ads, apparently it is the domain provider of value and choice amongst my colleagues. I did a search on an anagram of my name on WHOIS and found it available.  Also, apparently GoDaddy supports DNS redirection so you can move your hoster around. Using a promotion code given to me by my colleague (thanks Tim!), I was able to get 10 years down from $106 to $76:  
3. One warning, be careful on what you put down for the Administrative Contact, Technical contact & Registrant address fields!  A simple Who.Is will pull up your information for all the world to see so don’t put down an address and phone number that you don’t want to share with the world:
4. Now I had to set up the hoster.  From what I heard from my fellow DPE colleague Brian, webhost4life was the best provider if I wanted to own an entire, site and database.  I opted for the middle package because it gives you SQL Server & ASP.NET in case I want to add custom pages and projects to my site one day.  It takes a few hours for them to set up your account. Once it is complete, you will receive an email. It took me 3 days, or 1 full business day to receive the mail.
5. Next, the DNS routing needs to be setup. Your hoster will send you the DNS servers to use. These need to be plugged into GoDaddy settings. Choose the Manage option from the site, Advanced Details. Then edit the nameservers to match the ones given to you by your provider.

Be sure to read the Living Dustjacket for information about this series.

Yes, curating is a made up word, but it’s the best way to describe the process of managing of collection of items past and present. Many of us have collections – whether it’s books, stamps, coins, shells, boxes, wine, handbags – anything that comes in multiples can be collected. What do you do when your collection becomes more than a hobby, and becomes almost a museum that tells a story?  How do you manage the data about your collection?

In this series, we will walk through the process of deciding when to upgrade your personal collection into a full inventory management. We’ll focus more on the “Why Do I” rather than the “How Do I'”. Microsoft has a rich array of webcasts, videos and podcasts out there to show you the “How” and we’ll be sure to point you to those resources as they are appropriate.  The goals of this series is to show you can started with programming from scratch! Even if you are new to .NET or to programming altogether!  This series is geared towards the beginning developer who wants to be empowered with technology, and if you are a woman, even better! We certainly need more women in this industry.

Throughout the series, you will see the benefits of using the newest technologies to invent, create and manage your personal pet database and system. Ideally, this book presents technology in a way that’s easily digestible for a non-developer.  The sheer amount of information around software development can be overwhelming. The best way to approach software development is to wade in, and create something that is useful for you to use every day.  Almost everyone has used eBay at one point or another. How would you like to build a system where you could create your own customized system that stores not only information about your personal collection, but also enables you to sell it online?  Visual Studio 2010 and SQL Server 2010 makes this very possible. But let’s start slowly, and first explore the Why behind the technology.

Options for Storing Your Collection

Every collection has an inventory management process.  Your collection of items is your inventory.  Now you need to decide where to store it. Consider an oenophile,a connoisseur of fine wines.  What are ways to document your knowledge?

What kind of curator are you?

Learning how to build your own system will give you the freedom you to shape, share and socialize your knowledge and your precious items in any way you see fit. You will see how you can combine the reach of the Internet with the power of software, particular in the .NET platform.  Then, you can share your data globally and become a the type of curator that makes sense for you. For example, you could be:

• a curator librarian - as an expert to share knowledge and help people with their questions, and manage a library
• a curator designer - showing off of your collection over the web, and manage a gallery
• a curator auctioneer – to match people with items that are for sale in a collection, and manage a store

You will learn how to be any or all of these in this series.

Your homework

Plato was the inventor of most every word that ends in –ize.  He was the father of categorization. Most collectors love to categorize and this skill will serve you well when you design a database or a software system.

Your homework is to think of a subject matter in which you are a cognoscente and collector. Every collection begins with an item.  Think of an item that means something to you, that you would like to curator.

For me this project will start with a charm. Charms are typically collected individually as a souvenir of something special – such as a a beloved travel spot, a favorite hobby, or simply as a symbol of love. :

Each charm is an item, a member of a specific grouping, or collection. They can then be categorized into bracelets – a bracelet for travel spots, a bracelet for lucky charms, a bracelet just specific composed of three-dimensional cameras (by the way, you’ll see all of these in this series. more on that later)*.

As you are deciding on what item you want to choose, think of it terms of a larger collection. Can your item be organized into various groups? For example, you could be collecting seaglass. Seaglass could be arranged by color, by shape, by original source. Your item should be something you love and something that you can categorize:

When you come back for the next chapter, have your item in hand. We will then teach you the principles of object oriented programming and help you design a system that’s tailored a la .NET a porter, specifically to your exact needs.  Once we have the system in place, we will then show you how you can extend it to the web.

Chapter by chapter, we will walk through the process of how you can boost your knowledge and share the special information that you know using the power of technology.  

~ end chapter one ~

* note: whenever you see “more on that later” without being associated to a hyperlink, it means that I will go back later and make “more on that later” on something that I will write in the future.

Who has the politest browser for Microsoft users?

(Results measured with the beta PB Index)

Last updated: January 12, 2010

So I have the lovely fun of testing my site on 4 browsers and had an opportunity to gauge each suitor for my site in terms of politeness to a Microsoft technologist.

I did two forms of analysis. One is friendliness when installing a new browser with a default browser already installed. This measures the ability to migrate your settings such as URL history, default search engine, etc.  Secondly, I evaluated various developer features (such as media streaming, source code display) to determine ease of use when testing web sites and applications.

So far it looks like Google Chrome is the politest non-MSFT browser.  They were each evaluated with the PBI (Polite Browser Index).  The index criteria will continue to grow in my evaluations, but here are the preliminary results.

PBI#		Internet Explorer 8(Default)	Chrome 2.0.172.43	Safari 4.0.3	Firefox 3.011 (now .013)
1	Does it ask you for your choice for default browser?	It is the default
2	Does it pay respect to your default search engine?	Bing was default
3	How well does it play Windows Media Player?	Fabulously with little tweaking (Set AutoStart=false and custom windows size)	*with tweak	*with tweaks	* weird buffering, page never stops loading
4	Does it remember your URL history?	Naturally but not fair to rate this when it is the default browser
5	How politely does it install its own updates?
6	How considerate is it with remembering memory is limited?
7	How elegantly does it display source?
8	How gently does it shephard your form values (e.g. use names and passwords)	already cached by default

I’d be curious to see this index in reverse, in terms of the Internet Explorer experience for someone using Safari or Chrome as a default browser. 

IE8 unmatched in terms of feature richness

Here are two IE8 features that I use most often that I can’t seem to find in other browsers.

Wishlist: “Translate this Human”

Although the politest non-MSFT browser when it comes to respecting your default browser settings, it definitely doesn’t quite match up to the features in IE8. My biggest “new feature” use in IE8 is the simple right click & translate with IE8.  I use this all the time when doing research on obscure German cites and coats of arms. For example, if I come across a search that only brings me back German results, like tonight when I was looking up more information on Hoherrodskopf. Let’s say I keep digging and digging into page after page until I get to a page that is completely German. Only in IE8 can I right click and have the page automatically translated for me. And continuing to click through, the right side of my screen keeps an updated live translation going at all times!

I use this feature A LOT and wish we had this in real life when traveling abroad. How cool would it be to right click on a person and say “Translate this Human?”

Are you commitment phobic?

Why commit to a clickthrough until you had a taste for the meal? With the a sneak preview feature, you can get a small morsel appetizer of the page description before committing to a clickthrough. Easy enough to get a sneak preview:  I simply hover over a link to get a bit more detail in a popup:

Detailed Findings & Analysis for Polite Browser Index

PBI1: Respecting your default browser.

All the browsers will ask before they override your default browser during the installation process. They will also politely inquire every time you launch unless you tell them to go away.

PBI2: Respect for Default Search Engine

Google honors Bing

Firefox goes straight for Google, but gives lots non MSFT choice (unless you count Yahoo)

And Bing is definitely not a contender for consideration. Although Bing is still in its early years, so understandable.

Safari sees a world of only two

PBI3: Playing Video

This is the one that’s definitely the biggest challenge. Apparently Macs do not honor the AutoStart=false option, which annoying causes any embedded WMV video to immediately start playing.  A work around is to switch this to an image link that in turn will pull down the video source.  Take a look at the before and after pictures. Not pretty.

BEFORE in Internet Explorer

AFTER in Chrome, Safari, and Firefox respectively

So neither browser will honor the object size that you set, unless you match that size with the embed tag size attributes. As you can see in the series of shots, unlike IE8, all other the browsers will use the ActiveX control size  listed in the EMBED tag as the default, not the size indicated in the OBJECT tag. This is by design.

If you modify the EMBED Tag to use the correct size, the Video will display in the correct aspect ratio.  Just remember to scroll down to change those settings if you are seeing undesirable control sizes.

   1: <object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" width="120" height="90" codebase="http://www.microsoft.com/Windows/MediaPlayer/"> 

   2: <param name="Filename" value="http://mschnlnine.vo.llnwd.net/d1/ch9/0/Microsoft%20Developer%20Evangelists.wmv"> 

   3: <param name="AutoStart" value="false"> 

   4: <param name="ShowControls" value="true"> 

   5: <param name="BufferingTime" value="200">

   6: <param name="ShowStatusBar" value="false">

   7: <param name="AutoSize" value="false"> 

   8: <param name="InvokeURLs" value="false"> 

   9: <embed src="http://mschnlnine.vo.llnwd.net/d1/ch9/0/Microsoft%20Developer%20Evangelists.wmv" type="application/x-mplayer2" autostart="1" enabled="1" showstatusbar="1" showdisplay="1" showcontrols="1" pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" CODEBASE="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=6,0,0,0" width="240" height="180"></embed> </object>

After making the adjustment, your video should size nicely.

Now what to do about that AutoStart?  So by default if you set the parameter for the OBJECT Tag to be false….

<param name="AutoSize" value="false">

…none of the browsers will honor it.  Just like the other issue, you will have to set yet another attribute to disable the autostart.  This is the attribute that you will change in the EMBED tag:

autostart="0"

The final code will look like this:

   1: <object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" width="120" height="90" codebase="http://www.microsoft.com/Windows/MediaPlayer/"> 

   2: <param name="Filename" value="http://mschnlnine.vo.llnwd.net/d1/ch9/0/Microsoft%20Developer%20Evangelists.wmv"> 

   3: <param name="AutoStart" value="false"> 

   4: <param name="ShowControls" value="true"> 

   5: <param name="BufferingTime" value="2">

   6: <param name="ShowStatusBar" value="false">

   7: <param name="AutoSize" value="false"> 

   8: <param name="InvokeURLs" value="false"> 

   9: <embed src="http://mschnlnine.vo.llnwd.net/d1/ch9/0/Microsoft%20Developer%20Evangelists.wmv" type="application/x-mplayer2" autostart="0" enabled="1" 

  10: showstatusbar="1" showdisplay="1" showcontrols="1" 

  11: pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" 

  12: CODEBASE="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=6,0,0,0" 

  13: width="240" height="180">

  14: </embed> 

  15: </object>

After these tweaks, Chrome worked great.  Safari also did well. Firefox was a little slow and was doing something strange with buffering, that made the page load for ages.

PBI4: URL History

Chrome remembers my URL history

And nicely drops down a list for me of autocomplete entries.

Safari  & Firefox draw a blank on where I have been

I don’t even get a drop down prompting me to autocomplete the Dot Com at the end of www.bing.

Likewise with Firefox

PBI5: Installing updates courteously

Firefox says “Talk to the Hand”

I just had to wait 3 minutes for Firefox to launch, as it was hung on installing updates. This was the screen I waited on.

PBI6: Respecting memory

So I opened up all 4 browsers, and cleared each browser’s cache respectively. Except for Safari, I couldn’t figure out where Apple buried that setting. I will address that later should Safari be an underdog in PBI6. Then I pointed each one to blog.slingalibi.com and popped open Task Manager to see what I saw (I’m probably going to get into a little trouble about this one so I will skip the editorial and just pop in my checkboxes up top with no comment):

PBI7: Whose source is most elegantly dressed?

I just wanted to do a basic text of a typical View Source experience. For each browser, I popped open my blog, hit a shortcut to view the source, and then hit another shortcut to find a piece of text (in this case: Twitter) and see how intuitive and polite the experience was for me.

Safari is definitely wearing casual khakis, shirt untucked

So I did a View Source on Safari, which was a wrist-bending CTRL+ALT+U or awkward mouse shift. This is what I see:

• black  & white (ok for Hitchcock, but not you, Safari)
• hard to search,
• no features besides zooming
• all it all I give a hearty… meh:

Internet Explorer is definitely wearing a nice suit with matching shoes & belt

So I open up IE and hit Alt V,C and this is what I see:

• Nice color coding, including green for comments
• Kind of liked the in-window search that Safari had, but the Find box isn’t a modal and was able to pop open the menus
• which didn’t have much besides zoom either
• all in all i give a nice hmm.

Firefox is wearing a tuxedo

Firefox has an easy CTRL+U to show off their source. And this is what I see

• CTRL+F to find text, just like IE, but it’s in-window- just like Safari
• Color coded result matching - Typing in letters into find immediately color coded the matching text in a green so bright I couldn’t help but miss the text!
• Gorgeous color coding for the actual code, in eye pleasing colors. The IE red hurts my eyes a bit.
• A bunch of bonus features like highlighting multiple matches
• All in all, hands down the most elegantly dressed & the best displayer of source

Chrome is wearing either a Halloween costume or maybe it’s supposed to be a hipster outfit, I can’t tell which. It’s either weird or weird. And just plain confusing.

So Chrome gave me a hard time finding the shortcut because their menu is buried under Developer. Who says you have to be a developer to look at source?  People steal images all the time from Ebay by digging into the source (oops, more on that later. Remind me).

But anyway, the short cut is an easy CTRL+U, and once I popped open the source this is what I see:

• First I was startled. For multiple reasons: 1. It was really fast. (that was the only good startle) 2. I didn’t know what happened. Turns out Chrome popped open a new tab. I thought for a second it replaced my normal code window and didn’t know how to go back. Then i realized it was a tab, and saw my original window besides it as a tab 3. The font is really small!!  4. I didn’t even know where to begin to Find the Find. Luckily CTRL+F Worked
• The color coding is there, but it’s so jumbled! No preservation of white space
• The color coding on the matching terms is nice (pink highlights), like Safari. And as an extra bonus, it gives you a second color for the out of focus matching terms (see the yellow highlights)
• The arrows to scroll through terms are ok
• I have no clue what those yellow bars in the scroll are about – I clicked on them, they didn’t do anything.
• All in all – it’s just weird and distracting for me.  (* And at this point I was still on the fence about it, until I went to close down the source window, and it shut down both source AND main window!  Without even asking me!! Now that’s definitely not polite).

PBI8: Who kindly escorts you into sites, remembering your form variables?

I tried each of the newly installed browsers by visiting a site that required login with a user name and password. I had never visited this site with either browser yet.

Chrome was extremely thoughtful

Not only did it remember the user name to a site that I have never visited with Chrome, it also autopopulated the password for me. Very impressive!

Firefox was very polite

Although it didn’t remember my password, it did remember my user name.