Friday, March 18, 2011

How to Use IE7 in Windows 7

Try to ignore the fact that this post is about a Microsoft tool. After my rant about how Microsoft people are horrible, anyone reading this is probably a bit perplexed about the title.

To make a long story short, I got a new laptop, and it came with Windows 7.

I am working on deploying live chat software for a client, and despite my hatred of Internet Explorer, more than 50% of the world's population still uses it, and it's up to me to put aside my personal distastes and make my clients' happy.

I found a bug in IE7 using IECollections. Generally, when I find IE bugs that I can't seem to immediately find the answers to, I figure it's just caused by the fact that I'm not using a real version of IE7. I spent over an hour trying to find someone in the organization who had IE7 installed, and another 20 minutes trying to get a screen share started to verify that we were really looking at IE7.

Well, after stumbling around Webmasters Stack Exchange, I found this question about How to Test IE7 on Windows 7. It turns out it's very simple. That link will show you a picture that will speak a thousand words. Go ahead, check it out!

Wednesday, March 9, 2011

StackOverflow Changes Name to StackExchange

The best time to make changes to something is during times of change. If you know your name isn't marketing your products to the right target market and need to change it, the best time to make that change is when everyone is watching, such as when you're recently awarded $12 million in venture capital funding.

If no one is watching and you change your name, there is a very strong likelihood you could skip away into obscurity. If no one was paying attention, there will be no transition of existing brand loyalty and brand recognition to help keep you afloat.

The name "StackOverflow" speaks to programmers, but it is meaningless to non-programmers. Non-programmers know "StackOverflow" as some wierd, obscure programming term. If you're a Motor Vehicle Repair enthusiast and your friend tries to convince you to join this Q&A network that was originally a Q&A site for programmers called StackOverflow, they may look at you like your crazy and pretend they never got your email invite to the private beta.

The reason for the name change was to fit the contours of the other Q&A sites that have absolutely nothing in common with programming. It was a strategic decision, and it was the right decision.

It's important to understand that the famous programming Q&A Site, http://stackoverflow.com, is still called Stack Overflow. The company changed it's name, not the Q&A site itself.

I am working on one of the newest Q&A sites, targeted at project managers. Project Management Stack Exchange is in public beta and has some great, experienced users who are able to help answer your professional project management question. If you have project management experience, we could use your expertise. Sign up for an account today!

Monday, March 7, 2011

How to Convince Project Team Members to Use Web-Based Tools

As Web technologies get more and more advanced, and as user interfaces become richer and snappier, desktop tools will decline. However, it's tough to convince some people to use the Web based tools.

According to this resource on How To Encourage Team Members to use Web Collaboration Tools, it's important to get over the initial reluctance.

There are some tips that you can use to help motivate people to accept the change:


Show them the value of the tool

Managers want to know that the tool isn't something that you just happen to find on some obscure website that hasn't seen a pageview of more than 10 in the last two years. From a risk perspective, if no one else is using the tool, then what's the point of the original developers spending their time maintaining it. Managers want to see that there are recent updates and that other reputable organizations are using the tool. It also helps to show a Google Insights search demonstrating upward trends.


Get support from others in the organization

As a project manager, it's your job to persuade people to join your cause. To accomplish this, you'll need to be attentive to who your audience is. While managers want to see low risk, employees on the team want to know that it's not going to create more unnecessary processes that impede their workflow.

The best time to try something new is during a time of change. For example, if the team has reorganized and has a new technical leader, he or she may be open to new ideas simply because no patterns have yet been established. If the team has new employees, the training they receive can include the new software. Trainers should approach the new employees with the software as if it were something already used within the organization.


Sign up users for a test drive

Sometimes the best way to gain support for a new tool is to just simply start using it. For push-based tools like Basecamp or Manymoon, this is easy, just sign up members of your team so that they get emails from the tool. With Basecamp, for example, the users who reply to the emails end up unwittingly using the tool. After a few weeks, it will become a habit to continue using it.

Some of these tips were originally suggested by Pawel Brodzinski, a consultant and coach in the field of software project management. For more information, check out the Project Management Stack Exchange Q&A Site.

Saturday, February 19, 2011

How to Use Stack Exchange Area51 Advertisements

I was part of the Project Managers Stack Exchange Private Beta. We were brainstorming some ideas as to how to promote the site, and so far the ideas we came up with include a Facebook page and blog articles. The idea of placing banner ads on a blog or website is of course another creative way to help spread the word.

The problem is, the only banner ads available are within the Stack Exchange network itself. They're essentially inlined into the page using data:image URLs, which doesn't make it easy to just grab some code and place it on your website.

Armed with Chrome Debugger, I set out to see what would be involved in placing an Area51 banner on my blog.

On one of the Stack Exchange sites, I used the inspector to view the HTML for one of the banner ads. It consists of inline CSS, a DIV and TABLE element that contains a hyperlink to the Area51 proposal, and the commit percent. The hyperlink innerHTML contained the name of the proposal.

While It's possible to paste the CSS, HTML, and JavaScript in an HTML page, the only way Blogger would accept the inlined CSS was through an IFRAME. As you can see, I've embedded the Running Q&A Proposal in this article:



DISCLAIMER: Stack Exchange and Area51 images and content are property of the Stack Exchange Network and are subject to the Terms and Conditions. Use of this content in this article falls within the "fair use" section of the Terms and Conditions. You must obtain written permission from Stack Exchange prior to use of this content.

Feel free to view the source of the IFRAME to get the code. Just paste everything within the opening and closing BODY tag on your site, or copy the entire HTML page to your Web server and use an IFRAME to embed the advertisement in the desired location.

I made comments in the code to show the 3 items that represent the proposal link, proposal display name, and percent committed.

View Ad Source

Since the view source link doesn't work in the inferior Internet Explorer browsers, you can also download the code here by right-clicking and selecting "Save File As", or "Save Link", or whatever the most popular way to save files in Internet Explorer is these days.

Tuesday, February 15, 2011

Project Management Stack Exchange Launches Public Beta

Project Management Stack Exchange is now in public beta, meaning that anyone can now join the Q&A site and contribute by asking questions or posting answers.

The site is in need of more expert level project managers. Many questions are basic questions, but I'd like to see more questions asked that are more advanced. Most basic information about any field is available in droves; it's the specialized, expert-level information that is oftentimes more difficult to obtain.

With three years in the field, I'm no expert, but I'm also beyond many of the basic questions about the definition of change management, for instance.

However, some individuals have posted some thoughtful questions, such as How to approach a project given to new PM during execution with vague requirements?. The question involves a specific experience by a project manager and not a random what-if scenario.

The site is still in it's infancy, and it's success will be defined by it's early members. If you have experience with project management -- no matter if your field is software, construction, engineering, or some other project management field -- create your account today at Project Management Stack Exchange.

Wednesday, February 9, 2011

Project Management Stack Exchange Begins Private Beta

On February 7th, 2011, the Stack Exchange network launched the private beta of the Project Management Stack Exchange website, a Q&A site run by the community to address questions regarding the field of Project Management.

The site is a place where professional project managers can go to ask objective or subjective questions regarding their field. The people who run the site encourage participation by professionals who either have a problem they seek the answer to or who would like to help other project managers improve their skills.

The Stack Exchange network works on a voting system, similar to Yahoo Answers. Users who ask really good, helpful, well-written questions will be rewarded with upvotes awarded by other users on the site. Similarly, users can vote on answers given by other users.

Upvotes and downvotes affect users' total reputation score, which represents how well the community trusts the user. As a user increases his or her reputation, the number of priviledges on the site increases. After reaching a score of 10,000, a user pretty much has access to the same tools as the moderators.

In short, this means that you, the user, runs the site. With enough reputation, you have the tools and community trust to close questions that are off topic or spam, edit questions and answers to clean them up, see vote counts, create chat rooms, and much more.

Out of the 57 total questions as of the time of this writing, here are a few of the questions asked so far:

How To Resolve Leadership Conflicts In The Project?

One of My Projects Was Cancelled Very Early. Will This Be Deterimental To My Career?

Do Technical Leaders Compete With Project Managers?


The Stack Exchange network consists of 44 different Q&A sites spanning from Programming, IT, Website Management and other technical topics to music, cooking, and parenting. It began as a single Q&A site, Stack Overflow, as a place for software engineers to ask objective questions.

New sites first go through a proposal phase where the community picks examples of on topic and off topic questions. After the proposal phase, the site undergoes a committment phase where a certain number of users must commit to asking at least 10 questions or submitting 10 answers in order to help get the site started.

After the committment phase, the site enters a private beta phase. The purpose of the private beta is to seed the website with some really good questions and answers, so that when the site launches the public beta, it already has some really strong content to attract good, professional project managers.

Although the site is still in private beta, anyone can view the current questions and answers by following the link to the Project Management Stack Exchange Site.

Saturday, December 4, 2010

Why I will Never Use Spring Tag Libraries in my HTML

The Facts - Web Design and Web Development Involve Completely Different Skills


I work with a team of developers and a team of designers. The designers I work with know Photoshop like they know the back of their hand. They are experts in writing clean, standards based, cross browser compatible HTML and CSS. They design and produce high-quality, beautiful, $15k websites for our clients. Their code validates with W3C validators. The results are amazing.

Our web developers know Java. They can pound away at any server-side problem and produce a solution. They use Struts, Spring, Restlets, JSP, JSTL, Velocity, they can configure Jetty and Tomcat, and they can look at log files and solve problems.

However, if you give them an HTML document, they'll give it such a severe beating that it becomes unrecognizable by it's original creators.

The beautiful HTML turns into a 3 headed monster with unclosed tags, numerous validation errors, and no IE support. The developers struggle for days with guesswork of adding a tag here, removing a tag there, editing a CSS rule here, and who knows what else there.

Of course, the designers are unable to help because of the code soup that results from mixing JavaScript, Java, and HTML into a JSP page.

The resulting web application looks great on the outside, but under the hood it's an absolute nightmare! Ask the designers to go back in and make a design update, and their faces go blank. A 4 hour change takes weeks! The developers can't make the changes because they barely got the HTML integrated with the backend system.

So developers and designers sit side by side trying to understand all of the complexity. The designers can't determine what the application is doing with the HTML, and the developer can't understand what modifications to make to the HTML. Logic mixed in with the HTML is of course overwhelming and makes the code completely unmaintainable.

In summary, designers and developers just plain have different skill sets, at least at my company, and it's foolish of us to think that designers and developers can use the same tools. People do better at what they specialize in, and to try to force that change is wasted energy.

How do I know this, you ask? Because I've fought this fight for years and have continued to lose miserably. "Eclipse is a software development tool, not a design tool", they tell me, "and we're not using it". End of discussion.

Of course, I have convinced a designer or two to try it out. In the end it just slowed both them and me down because Eclipse would inevitably break, and I would end up having to help fix it. Afterwards, we both silently agreed it was a bad idea. The designer stopped using it, and I stopped asking questions.


Light at the end of the tunnel - Keep Content and Behavior Separate



Recently, I took on the project of testing out a new Google App Engine feature and put together a prototype of Google's new ChannelAPI using Google App Engine SDK 1.4.0. Since we have chat designs, I used this as an opportunity to experiment with some new ideas regarding HTML integration with a J2EE application. Below are the details:

  • The HTML exists as a static HTML page. My rule for this experiment is no JSP pages!

  • I use JQuery to bind all my click event handlers dynamically, which leaves my HTML free of pockmarks and other markup that would bind it to the framework.

  • Chat applications involve inserting data in a message window. I used the concepts of manual templating to inject the messages dynamically, without mixing HTML and JavaScript. I'll describe more on this below.

  • My application sends messages to the server using AJAX. Calls to the server are made through the bound click event handlers. No tag libraries! Only client-side code!



I've observed designers over the years, and I've also observed developers. Our designers put placeholders in the HTML they create to mark where the dynamic content would go. The pages can be loaded as static files, and look just like the final result except the fake data. Below is an example of the body of an HTML file, with the placeholder in bold:

<body>
   <input type="text" name="alias" value="James" />
   <button id="join" value="Join Room!">Join room!</button>
   <button id="leave" value="Leave Room!">Leave room!</button>
   <button id="test" value="Test Message receive!">Receive Test Msg!</button>
   <div id="messages">
      <div class="message">
          <div>
              <span class="name"></span>
              <span class="timestamp"></span>
          </div>
          <div class="text"></div>
      </div>

   </div>
   <textarea id="messageBox"></textarea>
   <button id="sendBtn" value="Send">Send</button>
</body>

Now, my development team would normally be tempted to solve this problem by pulling out the bold HTML and placing it in the JavaScript callback method as follows:

// create the div for the message
var message = "<div class='message'><div><span class='name'>"+name+"</span><span class='timestamp'>"+timestamp+"</span></div><div class='text'>"+message+"</div></div>";

// inject the div onto the page
document.getElementById("messages").innerHTML += message;


When our designer needs to add a new feature to the chat application, he'll have to study the HTML that's inside the JavaScript to figure out where to make the changes. Instead of focusing on his area of expertise, the front-end, he'll have to become an expert on the actual application's inner workings. He'll need to understand Comet, JavaScript, and how the application works. As you can imagine, this is an extremely inefficient use of his time.

A better approach would be to use a templating engine, such as Velocity or Freemarker:

      <div class="message">
          <div>
              <span class="name">${NAME}</span>
              <span class="timestamp">${TIMESTAMP}</span>
          </div>
          <div class="text">${MESSAGE}</div>
      </div>

This is better, but it's still based on old ideas that still suffer from the same problems. I can't give a JSP file to a designer who knows nothing about Spring, Tomcat, Jetty, Eclipse, JavaBeans, and other technologies that bind the document to the framework. In addition, even if he did understand these technologies, he doesn't have 4 hours to spare to setup his development environment for just a 2 hour change. Even with templating, the files can't really be loaded outside of the JVM and outside the context of the framework.

Velocity and Freemarker are marketing ideas that in practice are failures. Anything that involves a developer mixing non-HTML markup with HTML will create more problems than it solves.

Instead, I took the approach of leaving the fake, empty HTML-valid message in the HTML and using it as the actual template:

var template;
$(document).ready( function() {
chat_template_read_only = $('.message'); // store the original template from the HTML (in bold) for later use.
};

Now, in my callback method, I do the following:

// make a copy from the template I saved earlier
var message = chat_template_read_only.clone();

// now use JQuery DOM methods to inject the content in the appropriate places in the copy.
message.find('.name').html(name);
message.find('.timestamp').html(timestamp);
message.find('.text').html(text);

// dynamically inject the new message into the HTML.
$('#messages').append(message);


Here you can see I'm accomplishing the same goal. I'm placing the dynamic content in an HTML block and injecting it into the DOM. Now, if in 6 months the design team needs to add a department header and maybe a response time to each chat, we can give them the current, live, HTML file and they can load it outside the context of the web framework, code their changes, and then send it back to the development team.

We can integrate new changes simply by making changes to the Jquery CSS selectors in the JavaScript files! There is no need for the web designers to understand anything about Eclipse, Java, Jetty, Tomcat, how to configure the application, or any of the applications inner workings.

Let me repeat that one more time: The HTML document is not bound to the framework and can be loaded outside the framework. It can be loaded from an Apache server, it can be loaded from the desktop by clicking on the file. It can be modified by the designers without needing to look at any Java, JSP, or JavaScript.


Spring Taglibraries



I was looking at Spring's JSTL tag, which is used to bind server-side data to an HTML form element so the form can be rendered with a session ID and any preloaded data from the server. The server-side tag generates an HTML form tag.

The benefit here is that web designers are supposed to be able to work with these tags, or at least that's what they say. In practice, in all my years of software development and programming, I have yet to ever see this magical unicorn walk out of the shadows and into the sunlight.

Where are these mystical organizations that operate in this manner? I'd like to meet one of these developers. Are they human? Do they eat and breathe like I do or are they just mere fiction?

This tag is useful in cases where a developer needs to pre-load the form with data from a persistent object. Although I'd love to just ask the developers not to use it anymore, but that's just as difficult as trying to set the web designers up with Eclipse! It just ain't gonna happen!

The problem with these templating languages and tag libraries is that they completely alienate the web designers while simultaneously encouraging the developers to trash the HTML. These frameworks make it impossible for designers to use their own tools. Although these templating engines claim their goal is to allow everyone to work together, they fall way short of the mark. These frameworks were obviously developed by programmers who have absolutely no clue about design.


JQuery Manual Templating



While looking at a <form:form> tag, I thought to myself: "Now wouldn't it be nice if I could use some tool on the server-side to bind my data to that form dynamically, without having to actually make any changes whatsoever to the actual HTML document, just like I did on the client side with JQuery?

Then it hit me! Java doesn't have anything like this that I know of, but since JQuery can run in server-side JavaScript, perhaps Rhino or Claypool is the answer! Imagine using JQuery to manipulate HTML documents on the server side without ever having to modify or template the code.

What I picture is a form of binding server-side tags dynamically. If we can use CSS selectors on the client side, why not create a method of doing so on the server side. I picture a solution such as this:

Import server-side JQuery into our JSP page:

<script type="extjs" src="server-side.js"><script>

// server-side.js
$('form').replace('form:form');
$('input').replace('form:input');


Now, instead of editing the HTML directly, we can bind our server side tags dynamically. When the designer needs to update the page, he can load it completely independent of the Spring environment, make modifications to it, and give the file back to the developer.

There is currently no solution out there for this, but I would greatly appreciate any advice from anyone who has ideas/suggestions for how to get this concept started!
Google